/wdg/ - Web Development General

>Previous thread
>Free resources to get started
Get a good understanding of HTML, CSS and JavaScript.
developer.mozilla.org/en-US/docs/Learn - a good introduction (independent of your browser choice)
developer.mozilla.org/en-US/docs/Web - General documentation for HTML, CSS & JavaScript
freecodecamp.com/
codecademy.com/

>Further resources
github.com/iRaul/awesome-portfolios - Portfolio examples
github.com/kamranahmedse/developer-roadmap - Roadmap
stackoverflow.com/ - Developers asking questions and helping each other

>Tools
jsfiddle.net/ - Use this and post a link, if you need help with your code
caniuse.com/ - Check browser support for front-end web technologies

Other urls found in this thread:

nodejs.org/en/download/package-manager/#debian-and-ubuntu-based-linux-distributions
chanstats.info/
gnu.org/philosophy/javascript-trap.html
flexboxfroggy.com/
archive.rebeccablacktech.com/g/thread/62517314/#q62519086
developer.mozilla.org/en-US/docs/Web/API/Fetch_API
twitter.com/NSFWRedditGif

Fucking around with the Stripe API today for a MERN stack application. Anyone have experience or resources with building a go-fund-me like application?

second for firefox quantum

I am trying to install node 9.x on ubuntu but it keeps installing node 6.x and I can't for the life of me get it working properly.

Also, I am trying to learn react but I just couldn't get anything working in regards to passing information down through components via state/props. Can someone bluepill me on the way its meant to work?

nodejs.org/en/download/package-manager/#debian-and-ubuntu-based-linux-distributions
replace 8 with 9 I guess... dont know why it's not updated yet.
>react
dunno, but just follow the tutorial to a tee?

>I am trying to install node
There's your mistake

How do i start learning webdev without wanting to kill myself? Everything seems so bloated and "custom"

what are you doing trying to force something, if you don't like it?
It's only bloated if you make it so.
Literally free choice of stack, if you are not working for someone who tells you what to do.

I followed the tutorial but I learn more by trying to do things for myself.

So I had some basic info in a .json file and was reading it into the app (which took ages to figure out because trying to 'fetch' or 'xmlhttpreq' it would keep pulling the index.html.. I ended up just pulling the file into the app as an include/require.

Then I wanted to put that info into a very basic component to simply display the info but couldn't figure it out.

Also, I look for different tutorials and they all seem to develop react apps in vastly different ways and don't really give away what 'best practices' are. Its rather frustrating.

how confident are we in webassembly being fastest than javascript? because those files that this compiler spits out are 11k lines

how so?

Turn your ubuntu box upside down. Install 6. When you turn it right-side up again, it'll be 9.

nvm fixed it by passing optimization flags
webasm is not a meme

What can epic gnu man tell us about open web development?

Stick to the basics. No jquery, no frameworks, no wrappers. Go straight to

>HTML
>CSS
>javascript
>php
>apache
>mysqli
>ajax
>start moving to nginx because apache is dead and takes 1000x more memory to run a server. Knowing apache is important though

Then try making your own website with your own routing/post processing mechanisms. After that look into a framework you'd enjoy (laravel, code igniter, whatevers) and take it from there.

Overtime if you feel the need then start getting all the custom shit. All the custom shit is merely wrappers and frameworks to deal with the basics above.

Basically any web service beyond a yellow-pages directory is unethical
It's more ethical to steal food than be a webdev

time to post my little project again.
Rewrote the backend, made boards refresh twice as often and added longer options in the timeline.
And some minor UI things.

chanstats.info/

More boards can be enabled in the settings, top right.
Only have data from ~100 days so far and for some boards, that I added later (mostly nsfw and image generals) only ~3 weeks of activity.
Thought of maybe going through the archives and get the older data from there, to extend the timeline, but that's going to take some time to get done.

Still open for ideas if anyone has any.
Or if there is some glaring issue I overlooked.

he certainly has an opinion on JS at least
gnu.org/philosophy/javascript-trap.html

good job

>pol -> 134046 posts day

Lel

>Sup Forums is now more active than Sup Forums
When did that happen?

Learning object-orientated programming through PHP. What do PHP devs usually use classes for?

What do I actually do with backend stuff? I've learned the basics of PHP, node, and Django, but I never have anything to apply it on so I end up forgetting it all. I currently want to fucks with Swing/Hibernate.

when Sup Forums became a board solely for porn after mods banned raids and generally anything fun that let us mess with other people or places

>What do PHP devs usually use classes for?

You can pass a whole server or application object, or even a whole framework object through an object.

Also for routing classes, and pretty much every task you'd like your end application to perform

Database connectors with dependency injection

myDatabaseConnector->connect('username','password')

public function connect(username,password) {
$this->driver->connect(username,password)
}


Then you pass the driver you want to the database connector with a constructor or factory pattern


databaseConnector->useDriver(mysqliDriver);
//or databaseConnector->useDriver(something shitty and faded to die like PDO);

Thanks for answers fellas. How did you guys learn OOP? Just through constant practice / projects?

someone here recommended "head-first design patterns" once, i already knew what classes were but it showed me new ways to use them

it's in java but all imperative languages are the same

I mostly learned how not to use OOP.

>How did you guys learn OOP?

After you know the basics of setting up a class in PHP and everything, read books about Design patterns in PHP

Sup Forums is even only #4, when it comes to posts.
Think Sup Forums and /vg/ just got more popular over time and Sup Forums got a huge boost from the primary and election period.
Do you mean, how to figure out what to actually do, or some examples?
I don't know, it can be really hard to think of something novel and useful.
If you just want to try something, then for learning purposes a simple chat app or a simple pastebin clone are interesting to do.

Did you try my framework?

I'M SO FUCKING HORNY RIGHT NOW FUCK I WANT TO FAP MY SHIT OUT OF MY DICK
WHY THERE'S NO WEBSITE WITH RMS PORN CALLED GENTOOED.COM

Read the react docs properly, EVERYTHING is explained very well

C A N C E R
A
N
C
E
R

excuse me?

y-y-y-you too....

Q: Do you guys bother with sass?

yes

no, use just postcss and pick and choose
I like modules, nested, extend

scss

I don't know why I find Flex more difficult than regular CSS stuff. It just never seems to do what I want it to do.

I guess I'll keep hammering my head at it until I get it. Everyone says it's better.

Flexbox "is" regular css. Just check the article on css-tricks. There is a good one explaining the properties. Other excellent learning tool is flexboxfroggy.com/ . Can absolutely recommend it, together with css-diner

That's pretty neat. Thanks, user.

>copy js straight from another website, carefully adding own stuff
>doesn't work

>copy js straight from another website

Where does /wdg/ host their personal projects? I've been using GitHub pages but it doesn't support php. Preferably somewhere free that supports external domains because I'm a poorfag college student.

.row {
display: flex;
flex-direction: row;
flex-wrap: wrap;
}

.column {
flex-basis: 100%;
margin: 0 10px;

&:first-child {
justify-content: flex-start;
margin-left: 0;
}

&:last-child {
justify-content: flex-end;
margin-right: 0;
}
}

.wrapper {
max-width: 1170px;
margin: 0 auto;
}

@media screen and (min-width: 740px) {
.column {
flex: 1;
}
}


How's my simple grid?

not bad

Explain this syntax


class ImageUpload extends Component {
constructor(props) {
super(props)

this.state = { preview: null }
this.handleDrop = this.handleDrop.bind(this)
}

handleDrop([{ preview }]) {
this.setState({ preview })
}

render() {
const { preview } = this.state

return (


Drag a file here or click to upload.

{ preview &&

}

)
}
}


>>
handleDrop = ([{ preview }]) => {
this.setState({ preview })
}

([{ preview }])

this looks like something a Sup Forumsack would write.
>([{they}])

Raspberry pi.

wasm cryptominer, meme or golden ticket?

could it be used as an alternative to ads/patreon/flatter etc? anyone did the math?

Meme
ads and Patreon will always be dozens to hundreds of times more profitable

archive.rebeccablacktech.com/g/thread/62517314/#q62519086
Here's the post that does the math proving that coin-hive is merely a meme

Do you genuinely enjoy JavaScript, /wdg/?

I’m starting to feel like I do.

I love object-orientated PHP!

I plan on going to uni for web dev in a year, but what are some things that I can get prepared for in the mean time?

After my experience with c#, I enjoy js more.

what do you even learn in a webdev uni course?
Is there a lecture about the new ES6 features, or whats going on there?

For you I hope, that you aren't forced to use some legacy framework, that will make you want to end it all.
Especially, if you decided to start learning some modern stack on your own beforehand.

yeah that's where I wwas heading to I g ueas...
but how?

what's the curriculum for the course?
You probably can judge based on that and see how much you can get out of it and how realistically you can apply those skills outside of uni.

okay, so here is my question...where can I find material so I can learn javascript in depth?

>web dev uni

lost it

I lost my fucking wallet that's for sure.

ebook-dl.com

are there any courses I can take for free?

also, anybody has any idea what kind of website/sites would make me some money to get by?

Try udacity udemy edx coursera etc free lectures, paid certificates

I have two divs DIV1 and DIV2
I want DIV2 to have width 500px and DIV1 to fill any remaining width space on the screen.
So if the screen is 1200px wide then DIV1 would be 700px wide.
This has to be CSS and HTML only, no javascript

--div1stuff--

Add overflow:hidden in div1 css style arimasu

But what if i place like a 10000px wide image into div 1? it will push the div2 content off the screen

1) You are probably retarded if you place 10000px wide image into your website
2)Wrap your divs into another div with a class "container" and give it a "max-width" property.

>float

Hello year 2012.

How do you make the text to fill the area around image without using float?

I'm having trouble working with this API. I'm able to update an array of integers correctly, but reading from it produces an incorrect array that stays the same each time I call it. What do?

...

Why's your website in Greek or something wtf

>Not knowing what a 'Lorem ipsum' text placeholder is.

a first class post and code example my friend that is.
Someone will be able to do the needful and provide you with the helpful soon.

I was still trying to solve it on my own before I wanted to post the code. I was gonna post my code but I can an error replying, so I took a screenshot.

After more testing I found out it only returns the updated array after reopening the browser.

>Falling for most blatent bait.

>I was only pretending

>XMLHttpRequest
>alerts
>4 spaces indentation
Use fetch, console.log and 2 spaces you fucking mongoloid

I am a mong, what do you mean by using fetch

>2 spaces
i bet you also use apostrophes instead of quotation marks and rely on automatic semicolon insertion

>php
>apache
>mysqli
Don't do any of this though. This is for shite developers who probably think using html tables is a good idea

>developer.mozilla.org/en-US/docs/Web/API/Fetch_API
I indeed use single quotes and omit useless semicolons, yes.

developer.mozilla.org/en-US/docs/Web/API/Fetch_API

>rely on automatic semicolon insertion
yes please. Why clutter up my code with useless ; where they are not needed.

how does that function work?
You send the request and then immediately afterwards in the next line, you parse a response, without waiting for it? (169-171)
No callback, no promise?

>mfw I use 3 spaces

LOCK ME UP

>single quotes
ecma262 literally refers to them as apostrophes
>useless semicolons
they are required, the language just inserts them for you

>If the language already does something for me I will go ahead and do it myself for the sake of micro optimization.
I bet you still use 'for' loop, fag.

>tfw in 2017 css still can't do trivial shit like
width: 20%-50px

disgusting

>what is calc()

>he uses browser with f12 bloat
kill you'reselves

I'm calling it to retrieve an array, which I use to append a new value to it, then send it back with the new array to update it. So adding a value for the first time works, but trying to call the function again it returns only that first value unless I close and reopen the browser. So it could be what you suggested.

If I recall correctly, calc does not support (percent - px), it treats it like a (percent - percent)

fuck you i haven't done any web dev since i got fired from my web dev job in 2014 (i'm not a brainlet i was downsized), we didn't have any fancy shit like that back then, you kids have it easy now with your gay little class definitions in javascript and math support in css and fancy new input fields in htm like datetime
and you dare to talk down to me?
FUCK
YOU

this