/wdg/ - Web Development General

Everything Goes Edition

>old thread
>Discord / IRC
discord.gg/wdg
#Sup Forumswdg @ irc.rizon.net
Web client: rizon.net/chat

>Getting started
Get a good understanding of HTML, CSS and JavaScript.
Everything you learn will have these as their base.
The Mozilla Developer Network offers a good intro (no matter your browser choice)
developer.mozilla.org/en-US/docs/Learn/Getting_started_with_the_web

>Online courses
codecademy.com/
coderbyte.com/
freecodecamp.com/
bento.io/

>Further reading/viewing
youtube.com/watch?v=sBzRwzY7G-k
github.com/kamranahmedse/developer-roadmap
github.com/getify/You-Dont-Know-JS
github.com/vhf/free-programming-books/blob/master/free-programming-books.md

>Code challenges
codewars.com/
hackerrank.com/
codefights.com/

>Useful resources
developer.mozilla.org/en-US/docs/Web - General documentation for HTML, CSS & JavaScript
libraries.io/ - Discover and keep track of open source libraries, modules and frameworks
stackoverflow.com/ - Developers asking questions and helping each other
programmableweb.com/ - List of public APIs
caniuse.com/ - Check browser support for front-end web technologies

>Useful Youtube channels
youtube.com/derekbanas
youtube.com/learncodeacademy - codecademy
youtube.com/channel/UCO1cgjhGzsSYb1rsB4bFe4Q - funfunfunction
youtube.com/user/TechGuyWeb - Traversy Media
youtube.com/channel/UC8butISFwT-Wl7EV0hUK0BQ - freeCodeCamp
youtube.com/user/shiffman - coding train

>cheap VPS hosting in most western locations
digitalocean.com/
vultr.com/
linode.com/
scaleway.com/
heroku.com/

>an in-depth comparison of hosts
webstack.de/blog/e/cloud-hosting-provider-comparison-2017/

Other urls found in this thread:

localhost/handy/?api&random');
php.net/manual/en/function.json-decode.php
asiangourmetok.com/
github.com/Day8/re-frame
twitter.com/SFWRedditVideos

Anyone got any recommended JS meetups in Denver?

bla bla bla.. bla bla bla.. bla

>the next 300 posts

Anyone know of an free package that incorporates messaging and user profiles?
I hate WordPress, so only recommend plugins if they can be independent of it

Did any of you use flexbox in your recent projects? Should I use it or stick with regular CSS?

its pretty based. I use semantic-ui which heavily usess flex box, so I started using it too..


also, fuck those 2% who use IE 10 and lower

What do you guys use for your SSL certs?

I'd rather not use LetsEncrypt, since at least a year would be nice.

i used it once i fix some alignment issues with my text fields

yeah it's quite useful.
Still want to learn about the newer grid system as well.

it might only be 90 days, but they describe how to set up automatic renewals in their guide

Great, thanks. I will start using it in my next project.

>
>Weird post.
>The beginnings of web dev are incredibly hard, there's liek a thousand buzzwords raining down on you and you have no idea if they are important or not.
>I remember my first (real) project, every few days a completely new technology or topic. Each topic is not terribly hard in itself, but it's like fighting against the Zerg: the sheer number can bring you down.
>Do you understand at least the basics of Client-Server architecture and the HTTP model? Routing? Authentification? Security? Status Codes? YAML, JSON, XML? Templating systems? MVC? Where to put your code in MVC? JS and the DOM-Modell? SASS and SCSS? Bootstrap? jQuery? Whatever custom library you need to make things work? Did you learn your backend langauge of choice as well as the nuts and bolts of the framework you are using?
>And just when you think you figured it all out, deployment comes and you start with a million differnt topics again..
>How much do I have to pay, how can I calculate how much latency/bandwith/throughput is OK? How do I install that shit and what's this fail2ban thing about? XSS? XSRF? And of course you monitor and log your stuff right so you how what is actually happening on your site?
>A freaking nightmare.
>There just isn't a entry level like in "normal coding" where you make a tiny gear of a big machine, you need to know a little bit of everything.

Is there a single book or website that goes over all of this type of stuff? Like maybe a school textbook? I feel like I'm just going through the motions of learning languages and don't really understand what is actually happening.

>crosslink preview in US eastern time
>actual thread in local time

there is no point in trying to learn "everything"
What you actually need is an incredible small subset of what's available.

My suggestion would be to pick one frontend framework, one backend language and start building.

Then whenever you encounter something you don't know about, but would like to use, you can learn it then and there in a practical way.
Plus you are actually motivated, because you want to implement it in your own project instead of just learning it "because that's what a webdev supposedly needs to know before they can do anything real"

the fuck is all this webpack shit? never seen any course or class go over all of this. What the fuck is it? A bunch of JS libraries?

it's a tool to bundle your files and do some processing on them

you specify your entry JS file and everything that gets "required" inside it gets bundled together in the output.
There are "loaders" you can use, so you can "require" almost anything from other JS files, to CSS/SCSS, images and what else you have.
So you could for example have a bunch of small images inlined in your JS output and thereby save a bunch of HTTP requests, when the user loads your site.

Then there are also plugins, that let you minify your code, treeshake JS and CSS, rebundle your site on file changes, hotload in the browser, and so on.

Think something like Gulp or Browserify

I heard, that the best way to learn something is making toy projects.
So, can you help me with some ideas of reactjs beginner projects?

Or maybe, the way how to "imagine" what to make?

I need help from someone good with photoshop. I need to cut this guy out from the background, but his hair is hard to do. I tried using erase background, but it still looks wrong around his hair because it's not exact. Is there a better way to crop the figure out or change the background to white?

Use gimp and you can just adjust the threshhold of "select by color" by holding down the button when you click the background and dragging the mouse

I like writing services I can use on multiple devices using i.e. crud or websocket. If you have a pi or something you can serve it on there over the local network and gain access to it from your laptop/phone whatever.

Ok I'll try that.

its really easy man, id do it if i had photoshop on this PC

use the magnetic lasso (?) around him until you get to the hair, then go very carefully around it manually. Then select your selection, border the selection (or maybe its called grow? i cant remember) then add a glaussian blur to that bordered selection

yeah this might be easier, didnt notice you have a solid background color

I have another question. I need to set up a voicemail box online to receive calls and play a message, etc. What is the best option? I checked out Google Voice but it requires you to link your cell phone. I'm looking for a standalone voicemail service.

20 seconds with quick select tool in photoshop.

The problem is some parts of his hair are black from shadow, so they erase along with the black background.

I have json output like this
[
{
"id": "1928",
"name": "1474669205977.webm"
}
]

How can i get it with php and save as 2 separate values. $id and $name
i get it with
$json = file_get_contents('localhost/handy/?api&random');
$obj = json_decode($json);


i tried with foreach but it aint working

I've gotten it this far but i still think it looks fucked up.

store the JSON response in a variable called data, then just go like this:

var faggot = data.id;
var tranny = data.name;

etc

no no, with php

even easier

php.net/manual/en/function.json-decode.php

Here's the picture I first posted but with select opaque -> invert selection -> expand selection by 4 pixels -> select by color black -> delete. As in deteting black, but only near edges.

Hmmm that's a good point. The light seems so far away and obviously I want that first job because that's where most of the learning will be done anyway.

Thank you user for the response user.

Nice. Thank you for this

>never seen any course or class go over all of this
Relying on courses or classes in web dev is retarded, the technology moves too fast. Webpack is the future.

defringe > black

is learning js today makes any sense? specially if I want do more than just create websites.
>how js can be usefull now if not only in coding websites?

Why does everyone (even Google) shill Node.js? There is absolutely nothing that will persuade me to use JavaScript more than I absolutely need to: for a client-side interface.

Learning JS makes sense if you want to do frontend web development, i.e. clientside scripting and web apps.

You can also use JS on the backend (using Node.js), but that's just one out of many choices for a backend language.

You can use it for writing native apps using something like Cordova for mobile and Electron for desktop. But both of those are basically like writing webapps that have some extra native functionality added in. Also, there are many other programming languages and platforms for developing native apps.

When you say "more than just create websites", did you have something specific in mind?

In 2077, operating systems will simply be a web app.

If you're working in web, you should learn JS.

>how js can be usefull now if not only in coding websites?
It runs on the client-side, server-side, and now thanks to React Native and similar frameworks, you can create desktop apps, too. You'd be stupid not to learn JS these days. Check out the stackoverflow survey which places JS at the very top. Check out which language has the most repos on Github (read: it's JS). There is no better time to learn JS. But if you're just starting you've got a lot of catching up to do: DOM APIs, Node, npm, React, Redux, Express, Koa, ES6, PostCSS, Webpack, Babel, Browserify, Gulp, RxJS, MongoDB, and the list goes on.

>Why does everyone (even Google) shill Node.js?
>There is absolutely nothing that will persuade me to use JavaScript more than I absolutely need to: for a client-side interface.
Why would I bother answering your initial question given your subsequent statement? Your whole post negates any possible discourse.

What is your advice for programming for graphic design with GUI (Dreamweaver CC)? I'm studying web development for one semester.

>Dreamweaver CC

because it's actually quite good

use color replace to change the background to hot pink/green>Magic wand tool>change 5x5 to 11x11 pixel selction>click background>replace with paintbucket or transparency

I'm taking this class to graduate with a BA in Graphic Design faggot, are you aware Dreamweaver has a code view option where you can program to your autistic content.

what CSS selector JS framework does Sup Forums use?

Any good RL php courses?

Finished codecademies course and its nice for learning the syntax and what objects, classes and methods are (again) but it fails to show what you can actually do with it.

Like creating a registration and login option for a website. Or storing a shopping cart in a mysql database.

>inb4 wrong thread

>What is your advice for programming for graphic design with GUI (Dreamweaver CC)?

The best advice is not to use Dreamweaver or any WYSIWYG editor.

For design, you just need HTML, which is pretty simple, and CSS, which is simple to start, but getting the hang of the box-model can be tricky. Also there are a ton of random attributes and selectors that you'll almost never need, but in a tiny percent of cases, will make something way easier.

If you just want to make some simple things, you can learn enough CSS in a short period of time though.

I dont even know what you are asking user

vanilla
>getElementsByID
>getElementsByClassName
>querySelector
>querySelectorAll

I'll try, for a moment, to be rational. What advantages does Node.js provide that are unique?

Alright I bookmarked the link in the sticky. I'm going to lurk here while I take the class so I cn have people review my code.

What are some nice FF extensions for dev tools

If you want out-of-the-box functionality rather than assembling everything together from the bottom up then learn web programming with Java or C#.

The only advice for all the complexity of open source frameworks is to just avoid all the fancy new frontend frameworks and start out with html/css and vanilla js and move up from there. I think you learn more by starting out with vanilla PHP rather than using a framework like Rails, Django, Laravel, etc.

>a BA in Graphic Design faggot
sounds about right

thx guys for answers.

back to your question
I am new in the programming topic and I spend a lot of time doing research of what language should I start to learn. After trying a bit of any modern use languages (like C/C++, Java etc. and yes I know they are much 'harder' than js but only in first look) I came to conclusion that only JS fits my requirements and it seems like a good output for later coming decisions on what I really want to do and learn (frameworks)

I was just a little scared of usability of js (a jack of all trades is master of none) but I hope that frameworks really do their job.

Run JS relatively well in contexts outside of the browser.

$()

not the user you replied to but here is my take on it.

If you don't like JavaScript to begin with, then of course you will not like to use Node either.
I know some python and some C++, but currently pretty much only use JS in my projects.
It's nice to be able to easily switch back and forth from front- to backend and stay in the same language with the same environment of packages.
Node is the only backend I used, so I can't make comparison, but the non blocking nature of everything is nice and easy to use imo.
A regular argument is the lack of types. Some swear on TypeScript, but I haven't used that yet.
ES6/7 also move the language in a good direction.
Anyway, there is a reason why there is more than one option for backend languages, so use the one you think works best for you.

I find that CSS selectors in JS are rarely actually needed, but when I do need them I use querySelectorAll.

Its good for SPA's, I think most frontend frameworks are fed from the backend by node

Most frontend frameworks have no particular tie to backend frameworks.

Generally frontend frameworks need some API to get data from the backend. I think is just saying that the APIs are commonly implemented using Node, not that they have to use it.

Thanks captain obvious.

>some API to get data from the backend.
Either AJAX or the native fetch API is used for that purpose. APIs used in front-end frameworks like React all really boil down to AJAX under the hood. Neither are "implemented" by Node.

>61472949
And while we're at it, let's not forget how the front page of SASS is filled with bullshit buzzwords, and the front page of LESS is filled with the actual code

...

LESS? SASS?

>not using PostCSS and cssnext in 2017 a.k.a. THE FUTURE

Is hating MongoDB just a meme?

MongoDB is just a meme

I think you're confused because I used the term "API".

What you're talking about is APIs for frontend features provided by libraries or frameworks.

I mean implementing a serverside API for communication between the client and the server. The client provides parameters in a request, and the server sends back a response containing some information.

An example of what I'm talking about is the Sup Forums API, which allows a client to retrieve metadata about boards and threads from the Sup Forums server.

base64'd meme god database

If this:
:root {
--mainColor: red;
}

a {
color: var(--mainColor);
}


is the future, I'm just going to become a luddite because it's shit compared to:

@mainColor: red;

a {
color: @mainColor;
}

Is PHP a /wdg/ thing or a /dpt/ thing?

...

shy push

nice solution

t. Javababby

I was going to order some Chinese.


asiangourmetok.com/

I've never done java before, so I don't really understand

How does postmates, uber eats etc etc get the prices of food from stores?

Do they manually call like once a week or do companies sign up for the service and email in to change prices?

Postmates is a mix of store participation and user/driver contributions, Ubereats is 100% store participation

Interesting. Uber Eats relies on their established brand, while Postmates offers incentive.

So, incentive it is.

Is the Udacity Full Stack nanodegree good? I can get code reviews for free via a grader friend so it's basically free for me

It wouldn't hurt.

If your goal is to get a job and you already have some fantastic code samples, then adding new shit to your resume is a good idea.

>jQuery

Top shiggy

You don't need one if you are using a modern view library.

>2100 Psychiatry Appointment
>$npm rebuild brain

>not using component-based styling
>not being able to change themes dynamically
>bundling your styles and for every view in one file even though the view isn't loaded
>fucking up your whole site because of one CSS change


Hi 2016

Pretty much every modern framework is just a meme at this point.
Most languages are memes.
Our whole industry is a meme.

...Holy shit guys. We're living memes.

Did it take anyone else a while to fully grasp IoC and dependency injection specifically in .NET Core? I've only been studying it for a couple days, but it's such an abstract concept for me.

Yes, we're a meme that is quickly becoming oversaturated.

If you're not in the career then get in as fast as you can and move jobs to get a higher title.

Once the "everybody needs to code" groups start shitting in sub-par coders and the "girls can kode too!" groups start forcing html4 using girls into Node positions, salary will plummet and no one will know what a serious developer is anymore. Diamond in a pile of trash scenario.

>no one will know what a serious developer is anymore
That's why you need to focus on the things that differentiate you as a serious developer, as opposed to a codemonkey.

Given specific enough instructions on what needs to be written, and Google/StackOverflow, a codemonkey will be able to get a task done. A serious developer needs to be able to take requirements and design something that fulfills them, generally on a larger scale.

Why is React so comfy? Literally just a component library that isn't a bloated framework.

Set up with create-react-app, Don't have to touch webpack build config and it will always stay up to date, does proper code splitting and deferring resources. Does all the progressive web app stuff like register service workers and manifests.

Styled components actually make styling fun. Redux makes sharing state between many components very clean without needing to pass props everywhere or worry about parent components. React motion with their presets allow for awesome DOM transitions.

You think that's comfy?

github.com/Day8/re-frame

is there an app that can spellcheck the showing text in html code and ignore the rest?

I feel like sublime does that.

When will this meme die

As soon as the world stops using JS.

What ide do you guys use?

I've been using Brackets but I'm missing hints, warnings, and autocomplete features.

I'm using php, html, css, and js with jquery.

For sql I just use Xampp in browser at localhost phpmyadmin