Discord

>Discord
discord.gg/wdg

>IRC Channel
#Sup Forumswdg @ irc.rizon.net
Web client: rizon.net/chat

>Learning material
codecademy.com/
bento.io/
programming-motherfucker.com/
github.com/vhf/free-programming-books/blob/master/free-programming-books.md
theodinproject.com/
freecodecamp.com/
w3schools.com/
developer.mozilla.org/
codewars.com/

>Useful Youtube channels
derekbanas
thenewboston
learncodeacademy
funfunfunction
computerphile
codingrainbow

>Frontend development
github.com/dypsilon/frontend-dev-bookmarks

>Backend development
en.wikipedia.org/wiki/Comparison_of_web_application_frameworks
[Gist] backendDevelopmentBookmarks.md

>Useful tools
pastebin.com/q5nB1Npt/ (embed)
libraries.io/ - Discover new open source libraries, modules and frameworks and keep track of ones you depend upon.
developer.mozilla.org/en-US/docs/Web - Guides for HTML, CSS, JS, Web APIs & more.
programmableweb.com/ - List of public APIs

>NEET guide to web dev employment
pastebin.com/4YeJAUbT/ (embed)

>How to get started
pastebin.com/pDT82mQS (embed)
pastebin.com/AL6j7GEE (embed)

>cheap vps hosting in most western locations
lowendbox.com
digitalocean.com/
linode.com/
heroku.com/
leaseweb.com

Other urls found in this thread:

stackoverflow.com/questions/19844545/replacing-css-file-on-the-fly-and-apply-the-new-style-to-the-page
eloquentjavascript.net/
alissa.ninja/paint/
stackoverflow.com/questions/13874161/is-there-a-way-to-ignore-handlebars-templates-within-a-handlebars-template
codepen.io/user/pen/QpJEdm
twitter.com/SFWRedditGifs

I got a new problem for you people.

When I press back after logging in, my browser loads the login form from its cache. How do I stop that?

My current solution is to set the Cache-Control response header to "no-store" when I serve the page, but I am not happy with that.

Supposedly, before the browser loads a page from the cache, it asks the server if the page is still valid. If not, it downloads the page from the server rather than loading it from the cache. So, how do I add custom checks to that server side validation? I am using Node and Express.

Where can I browse well made webpages? Right now I just CTRL + S what I like, then scroll it.

But I would like to study the anatomy of web projects. Is there a github storehouse for web page projects somewhere?

Which is the best for frontend and why?
- angular
- react
- vuejs
- ember

Which is the best for backend and why?
- rails
- django
- laravel
- sailsjs
- spring

Which is the best for mobile and why?
- react-native
- cordova
- xamarin

What is everyone's view on stuff like Jekyll or Hugo, do employers tend to look for experience in them.

employers don't give a fuck about static site generators

react - easy find job, works fast, easy to learn.
>backend
golang (go) - performance, easy to develop.
>mobile
plain ES7, css4,html6.

bait

I know of simple preprocessors for basic front end like Sass/less and Jade/Pug, but they seem so inefficient how do people "merge" them all together so developing is quick and seamless.

That is an awfully worded question I am sorry, but I don't know how to make using multiple preprocessors a clusterfuck.

they're all shitty old technologies. Get with the times and use React with PostCSS senpai.

Simple question.
Let's say you're making a mobile app (Android). Are you supposed to make it like you would be making a website but instead you change the display and a bunch of stuff or is it a whole different way of doing things ?

If there was a best one, everybody will use it.
It's not the case. All have their own strength and weakness. It would be too long to explain each. There are multiple articles around, just do some research.

Oh my god why do they keep adding shit every fucking month

The differnt frameworks in one category are pretty similar..
If you're great with React, you'll understand Agnular2 fast.
If you're great with Rails, you'll pick up Laravel or Django fast.

So it's more a matter of what langauges you know, /like or what your team/company uses.

Also there are always trade-offs. I.e. Golang is nice for small servers, but you don't have that many libraries as i.e. Rails and you produce a lot of boilerplate code. Rails is fun to code, but not that fast and deployment is a little bit bothersome. PHP is faster and has super eaasy deployment, but the language itself is cumbersome and there are not so many good frameworks.. and so on.


You can't have everything at the same time. Just start somewhere and work with things you like.

It depends on what you want. You can make it like you would a website and wrap it in phone gap and cordova, or you can make it native. Native will be faster, but phone gap allows you to port it over to iOS and to the overall internet (as a website)

You forgot jquery movile, mobile angular ui, and titanium.

I wish all those backend rockstar superstars in my team fucked off from my frontend. Somehow the html is so easy and below them yet all they do is always mess it up.

What is your guys opinion about using stuff like { condtion ? : } in react render instead of putting all this code in separate functions that are placed 100 lines below somewhere in file.

Called a ternary operator. If that's the only place that that condition is used AND the outcomes are simple, I'd use them inline like that. Otherwise I'd extract them out

I use them like that too, but the people at my job behave like those are some kind of insults to their religion and families.

You can have a task runner perform one compilation then another.

I get the same thing from some coworkers. But unless there's a standard set that all logic must be in the controller, those rules are reasonable. Maybe they want all logic in the controller, I'd be fine with that too. Just so long as there's a reason things are the way they are

There is barely any standard. They would put it into dozens of render functions and spread it all around file without any logic.

100% yes. They have no idea what the fuck they're doing on the front so they should stay the fuck out. Especially when they try getting into design. Nightmares.

Try to find the best way to talk about this to your project manager or team.

I'm not entirely familiar with how react files are laid out. You'll have to give me more detail to understand

They would just put this into renderCondtion() { if condtion ( return } else { return } }. Those would be put all around file without any logic.

I find having a lot small functions like that just breaks the flow when you have to jump all around file.

Especially when they only work on chrome and it looks ok for them. But you have also need that site to display correctly on your boss moms 10 year old electrical oven display.

Yep. It's just annoying, I don't waltz on over to the backend and start fucking around. Why do they think they can do it to me? They act grand all the time about how the front end is worthless and yet the concept of media queries just don't exist for them.

>Which is the best for frontend and why?
vuejs

Easy to learn. Good docs. Everything is in the docs.
No need to search stackoverflow for questions. The vuejs author is a former angular/react user so he knows what's good. Easy to remember syntax well. Shorter code. Its up to you if you would like a simple "central state" or a full-blown VuexStateManager like in redux

vuejs version:

>he isn't getting paid for vue shilling
exploit user

I need advices.
I'm currently working on a web app with a Javascript framework (Vue.js) and Spring.
And I'm struggling too hard on fixing every error I meet.
When I have to write a method in Spring for a repository or anything, I'm doing fine.
But as soon as I have to make an http request to pass some info from the Javascript to Java, I fuck up.
Any advices or tutorials that'll help me with this. I learned Javascript on the spot without a proper theory so that might come from that but I don't know, it doesn't seem to be really complicated in the first place.

Trying to swap stylesheets using a button on my website but I have no idea why it isn't working, can anyone help?

HTML FILE, SCRIPT AND LINK ARE IN HEAD, LIST IN BODY


JS FILE
function SwapStylesheet() {
var currentSheet = document.getElementById("pagestyling").href;
var newSheet;

if (currentSheet == "style.css") {
newSheet = "styleDark.css";
}
else {
newSheet = "style.css";
};

document.getElementById("pagestyling").setAttribute("href", newSheet);
}

stackoverflow.com/questions/19844545/replacing-css-file-on-the-fly-and-apply-the-new-style-to-the-page

Why is safari so shit. If something wont render properly it's always in safari. I feel like I'm back in ie6 sometimes.

>And I'm struggling too hard on fixing every error I meet.
>it doesn't seem to be really complicated in the first place.

Safari is the new IE. Especially if you count iphones.

Where the fuck can I learn about Javascript?

Literally every video tutorial and book has outdated information and the code does not work anymore.

>got a $200 Udemy course for free on web development
>guy does CSS on the html files, tells everyone about external stylesheets on the last video of that section
>Javascript time
>literally just create a button and an alert
>it doesn't fucking work

Javascript doesn't change that dramatically that code just suddenly stops working. Unless the content produced in the first place was some random ass youtube videos.

Just torrent some pluralsight shit m8

So send http requests from front to back end using ajax or whatever

In spring make sure you have spring mvc jar loaded by your project management system (maven or graddle) or relevant spring boot starter if you use spring boot
Define a controller class with @Controller or @RestController annotation, make functions that handle http calls you are gonig to make with annotations to define parameters, http path, http methods and whatnot. Call your services in these methods, make them either return a view name if you use a templating engine or just some object that should get serialized to json. You'll need to define more or less config depending on if you use spring boot. Just look shit up on stack overflow, any spring tutorials or spring's official tutorials and docs
example controller
@Controller
public class Controller{
@RequestMapping(method = RequestMethod.PATCH, value = "session")
public ActivitySession patchSession(@RequestBody ActivitySession session){
session = sessionService.doWhatever(session);
return session;
}
}

eloquentjavascript.net/

lets say i have an orders table and each order can have multiple items. User clicks the "add item" and inputs that items info, but then they add another item. How do i save that item in the table? if i create another input form for it and click save, how will it know to save just that item? How do i seperate the items? the first item input has some unique id's but they wont be unique anymore once a user adds another item, thus screwing up my back end code for grabbing that form data. Hopefully im explaining this clear...confusing as fuck.

dropwizard or spring boot for rest

one to many relationship between user and order, one to many relationship between order and item
order starts out as not validated by user, then gets user validated (ie user clicked "order" button and isued payment), order then gets processed, shipped or whatever
you can now return unvalidated order when user browses the site so he can add items before validating it, with some kind of shopping cart interface. you can update order in database each time user adds or removes items to it, until user validates order

this is just an internal app i dont need validation or shopping cart software, etc. Lets say users adds 2 items. Fills out the info for them. Hits save. How do i have those 2 items get put in the orderItems table? i know how to do it with one item. But more than 1 item is confusing me. How do i give it different id's and names so its saved properly? everything needs to be separated and its confusing the fuk out of me my brain cant comprehend it. The first item im grabbing the data using the forms id, but if they were to add another item would all the id's need to be generated on the spot? and when i click save how will it know to save both items? this is crazy as fuck....

Attempting to use this in javascript file to swap an icon. Can anyone see any issues with it? The rest of the code in my if statement works.

document.getElementById('stylesheetButton').className = "fa fa-moon-o";

Ignore this, I'm an idiot and didn't give the icon the id

store order with its own id and an array of foreign keys corresponding to this order's items ids. you pobably need a user id field as well
update the item id array each time you add or remove items
you access all this by querying orders with corresponding user's id or just have an array of order ids as attribute to each user, get the item id array, fetch each item from db using thoses ids
you might need a way to differenciate current orders that can still be modified to past orders, that's why i suggested you maintain a state attribute on each order to keep track of which order can still be updated

Updated and fixed some stuff on my paint site:

alissa.ninja/paint/

What does the english/japanese button do?

It's Korean. It changes the buttons into Korean

You some kind of koreaboo?

How the hell do I create a handlebars template inside a handlebars view?
I have an index.hbs-file in which I want to create an inline template like


{{rowText}}


But since it is in a handlebars view it tries to set {{rowText}} when the view loads thus not printing out {{rowText}} at all. Am I doing this the wrong way?

can being a webdev be comfy or is it always high stress?

use three braces like {{{rowText}}}

I'm comfy.. real comfy.

Sadly it doesn't work

what are you even trying to do?
this seems like the complete wrong approach, why not use partials?

I want to have a template in the view in script tags that I can use in the front end javascript to create elements.
I guess I'm not thinking about this the right way.

Making a partial of the template didn't work either as it still removes {{rowText}} from the inner html of the script tag.

...as in this example:
stackoverflow.com/questions/13874161/is-there-a-way-to-ignore-handlebars-templates-within-a-handlebars-template

Yes oppa

It worked to escape the tags, like \{{rowText}}

which is easier to make mobile first or desktop first design? and which resolution is the minimum to start for mobile design?

Desktop first isn't a design philosophy and never was. Mobile first is though.

Mobile first means your base css is for mobile devices and media queries are for larger resolutions. Just use Firefox/Chrome's responsive tool to test the design.

What is the project? What stack is being used?

You can make both at once.

Instead of

@media only screen and (max-width: 600px){
#foo{
width: 100%;
padding: 1px;
}
}
@media only screen and (min-device-width: 601px){
#foo{
width: 8in;
}
}

simply do like:

#foo{
width: calc(100% - 10px);
max-width: 8in;
}


Design your site so that the same CSS rules make a good, responsive site, regardless of screen width or aspect ratio

>wasting resources for no good reason
web dev was a huge mistake

it seems like a pain to design it first for mobile, I display big tables of data and they look awful when they get resized for mobile since you have to scroll over each column independently

i have some forms in a div and trying to do this

#rightSide form:nth-child(even) {background: #fff;}
#rightSide form:nth-child(odd) {background: #f2f2f2}


not working tho. Any ideas?

Ideally you remove columns as you scale down to mobile, keeping only the most important

your probably fucked up the markup part.
post it.
codepen.io/user/pen/QpJEdm

Actually it's not that much of a pain even when displaying a lot of data. It's a good way to trim down on irrelevant data to mobile users, in addition to this you should be designing vertically when it comes to mobile. Again, not all that difficult even when you add in a query for mobile devices being held in landscape.

Much easier to scale up than it is to scale down. So next time when you're even designing 'big tables' start with your mobile design of them (hence mobile first...) and then expand the fuck out of them for larger screen users. So many great examples of ways to go about this too, like on mobile devices you can lock the first column, or you can set rows to expand on tap, etcetcetc. Whatever, get creative.

Are HTML image maps verboten and replaced by some javascript nightmare or are they still totally acceptable?

(I don't have any real use for them right now, but it occurred to me it could be a fun and relatively simplistic way of hiding easter eggs in a personal site.)

ok its kinda wokring now...except its treating 2 like an odd number....i only have 3 forms.

Image maps as in tilesets for icons and stuff? Most people use fonts since they scale properly for high DPI, or SVG.

nevermind i got it. I had to do it this way

#rightSide form:nth-of-type(odd) {background: red;}
#rightSide form:nth-of-type(even) {background: green}


weird.

wut

So have any of you actually gotten a web dev job in a reasonable amount of time (under 6 months) from teaching yourself from scratch?

im sure its happened. Probably not a good job tho. The real shit is full stack development. A sturdy year of studying that could get you in with teh big boys

whats the best way to rewrite this piece of shit code?

switch (data["taken_by"])
{
case "bob":
document.getElementById("taken_by").value = data["taken_by"];
break;
case "john":
document.getElementById("taken_by").value = data["taken_by"];
break;
case "phil":
document.getElementById("taken_by").value = data["taken_by"];
break;
case "joe":
document.getElementById("taken_by").value = data["taken_by"];
break;
case "sean":
document.getElementById("taken_by").value = data["taken_by"];
break;
case "clark":
document.getElementById("taken_by").value = data["taken_by"];
break;
case "jake":
document.getElementById("taken_by").value = data["taken_by"];
break;
default:
document.getElementById("taken_by").value = "john";
}

stop calling the dom so often, make a variable with the call to the element and use that reference to modify .value

>reasonable amount of time
> (under 6 months)
cant stop laughing
> from teaching yourself from scratch?
omg it gets worse lmao

const validNames = ['bob', 'john', 'phil', 'joe', 'sean', 'clark', 'jake'];

let name = data['taken_by'];
if (!validNames.includes(name) {
name = 'john';
}

document.getElementById('taken_by').value = name;

missed a closing ) for the if, but you get the idea.

>cant stop laughing
I actually got a full stack job in a little under 3 months, but I was practicing at least 8 hours a day.

What's the workload like? I'm also studying pretty hard but I have no clue when to stop and when to start looking for a job

I got a part time full stack job 1 month into transferring from community college to 4 year school, as well as a summer internship

Once I got my second project done for my portfolio I started applying. Only got $50k starting, but that was more than I was expecting since I live in a very low cost of living city.

School?

>School?
No, self taught.

No I mean what did your education look like, high school? College dropout? Grad in diff industry?

Community college dropout. I was pissed since I could have taught myself the entire first CS course I took in like 30 minutes. I just stopped going to all my classes like 3 weeks before the semester was over and started teaching myself.

Same, but I'm finishing my degree

First sem dropout? Not bad in that case, good on you user. Saved yourself some tuition money at least lmao

>First sem dropout? Not bad in that case, good on you user. Saved yourself some tuition money at least lmao
Yeah, first sem. And since tuition was only $2500 a semester anyways I'm not in any debt since the pell grant covered it all.

Say you are starting a static website, what process do you go through?

At the moment I am just doing it analogue, making the folders and shit, but I feel like there must be a better way seeing how so many people need to do 90% of the same shit.

Depends what tools you use. There definitely are tools that do majority of that for you automatically.

>So have any of you actually gotten a web dev job in a reasonable amount of time (under 6 months) from teaching yourself from scratch?
If you look at the bootcamp curricula, the amount of hours you spend working is anywhere from 600-800 in a 3 month span. If you're top tier you can get a job about a month after graduation. So if you can hit that 800 hours of work in 6 months, I think it's feasible to get a job.

Has anyone used pug?

All the material and support is for Jade which became pug, does anyone know good compilers for Pug?

Does Koala work?

>get a bachelors degree in communication technology
>uni focused on PHP because "most jobs rely on modifying existing shit and php used to be everywhere"
>only touch on JS for half a semester (they had more optional JS classes that no one told me to take)
>many jobs around me but they all want JS people
>php and mysql jobs all need JS experience too
>try to teach myself JS but I am just too stupid to understand any of it


well shit

Huh, if I go to work coffee free I get to come home not mentally exhausted.

When I drink coffee in the morning at work I am so mentally exhausted it's hard to drive.