Hacker News new | past | comments | ask | show | jobs | submit login
Ask HN: Self-taught devs, what are the best cheap resources for learning webdev?
45 points by Mc_Big_G on Nov 14, 2018 | hide | past | favorite | 32 comments
My son would like to learn web development on his own, part-time after work. His goal is to get an entry level job within a year. He's currently working as a computer / electrical tech at an industrial fan company and doesn't have a degree or desire to go to college.

I'm a web developer and can easily google various resources but I'm looking for opinions from people who have actually done it and which resources turned out to be the best for them.

Ideally it would be a progression of HTML/CSS => Javascript => React




Although it's not directly related to webdev, I highly, highly recommend the Coursera course Learning How to Learn as a starting point: https://www.coursera.org/learn/learning-how-to-learn

For the computer side of things, I highly recommend Harvard's CS50, which is completely free, for an introduction to computer science [0]. It has a great subreddit [1] and is a fantastic resource. MIT also offers a great pair of free introductory classes on edx. [2]

FreeCodeCamp is an interactive online program that does that exact progression (HTML/CSS => Javascript => React). Here's a link to the curriculum: https://learn.freecodecamp.org/. It also has a wide support system (chats, subreddit, etc), and it's also completely free. I never finished the last few projects, but the rest of it taught me a tremendous amount.

There are so many variables and so much luck involved that there is no guaranteed path, but these are two great resources to get started. These were some of the resources I used to transition from no-CS (disclaimer: with a physics degree but zero programming experience) to a programming job at a startup. I've since continued learning through online and in-person classes and joined a large tech company.

Happy to answer any questions about these resources. Given how many variables there are, I hesitate to use my own experience as an example, but I'm happy to give back and pass on any knowledge I can.

[0]: https://www.edx.org/course/cs50s-introduction-computer-scien...

[1]: https://www.reddit.com/r/cs50/

[2]: https://www.edx.org/course/introduction-to-computer-science-...


I second this as well

I would do CS50 and doing FreeCodeCamp in parallel. This way he builds a light web foundation, and have a solid CS foundational base to work through other courses.

Other good courses are found through udemy, like Colt Steel. Another good one I recommend is watchandcode.com, for basic foundational programming principles


I'd recommend getting familiar with MDN: Web technology for developers. https://developer.mozilla.org/en-US/docs/Web

There's a textbook worth of knowledge on HTML, CSS, JS - the foundation of web development. I think it'd make a good reference, in addition to a more guided approach (books/courses).


LambdaSchool https://lambdaschool.com/apply/

My advice is if lambdaschool cant be done in his schedule then do a crash course in practical data science from CMU instead.

https://www.cs.cmu.edu/~112/schedule.html click on each topic, short youtube lecture for intro to Python3. Homework is self contained with tests.

http://www.datasciencecourse.org/lectures/ same school, lectures also open, a crash course in manipulating APIs and data to do analysis.

If he actually does the homework assignments he can easily go on any freelancer site and start knocking off small jobs like 'get me all these Amazon listings for X and then produce in excel format' which pay 25-100 depending on what kind of analysis they want. Enough for a portfolio to later apply to Stripe or Amazon as a junior data engineer or whatever they are called these days. Even if not interested in data or ML that course still covers a lot of web things like headers, authentication, response codes, parsing XML, sql crash course, ect. If he does like webdev the first course is still an excellent launching pad for building your own software after in any language or getting into lambdaschool


A lot has changed since I first began teaching myself HTML in the 90s and later on PHP around 2006. For HTML back in the day I would simply take a sites existing HTML and modify it to my liking. Today, if I am designing something (since I'm not a designer) I often find some sites doing UI things I like and rebuild them. Then I started seeing CSS appear around the late 90s and early 2000s, so I had to learn something new, but it was just copying and modifying. This will be harder today with how things have changed, but its still possible.

When I wanted to learn PHP some 10 plus years ago I grabbed a book from the library and went through all the examples. I typed the examples by hand, modified them and what not. After a month or two I got to the point where I could build my business idea. From there it was Google and message boards for answers.

When I started learning Python a few years ago I also took the library book approach. I like free.

There are so many more resources today, but things have gotten so much more complex. Keep it simple. Stick to HTML, CSS, and JavaScript for now. You don't need SASS, webpack or anything fancy and confusing out of the gate. All that stuff will just make you feel under water, heck even I feel under water with whatever new wizbang stuff is out.

The biggest thing is to build something that will keep you interested. Build a site about a hobby you have or a business idea. It will make things more fun and keep you motivated. Make it less homework and more a hobby. I would also suggest meetup.com.


There are loads of great resources but they are all easy to find if you look. The secret to being self taught is having the desire to learn rather than the desire for some one to teach you.


App Academy's online curriculum would be a good place to start, I can't speak to curriculum itself but App Academy grads have usually been solid in my experience: https://open.appacademy.io/


I'm personally a big fan of Frontend Masters: https://frontendmasters.com. I've found it to be one of the most comprehensive resources for web development out there, especially for front-end work. I think it's a great starting point for any prospective web dev, especially if you're keen on learning some crucial JS concepts.

Once you dive a bit into the fundamentals, you can also check out Wes Bos's suite of courses: https://wesbos.com/courses/. His React tutorial is definitely my favorite one out there.


I love Front End Masters and think their courses are some of the most indepth, especially Kyle Simpson (Getify). But I wouldn't call it cheap, relative to other products out there. Still recommend though if you've got extra money.


Can someone suggest good resources for debugging CSS? I found that most of the time either you know why something works or you do not. I have not seen a resource which says, "This box is placed here because this other box is 50px and there is no more place on this row." or "This box is next to this box because there is a float:right on it" etc. Basically, I am looking for a "log" showing the browser's decisions.

Some people seem to get this instinctively, but for some backend engineers like me, CSS has been a nightmare.


I've mostly cheated by using CSS preprocessors like Sylus (http://stylus-lang.com ) or Sass to avoid page rendering surprises, and a postprocessor like PostCSS to optimize and not worry if certain latest modules have multi browser support. A survey of these things here if interested: https://www.mdpi.com/2078-2489/9/1/17/htm

I also once read through this thesis, to understand how the rule overrides work and other problems in CSS, but gave up keeping with the new standards and switched to preprocessors https://www.wiumlie.no/2006/phd/#ch-problems


I'm actually legitimately curious too. I'm a backend dev now, but I started working with CSS and frontend since early 00s and that's the only reason I know many of those things. For newer devs coming into web now, I have no idea how one would learn CSS quirks easily.


https://developer.mozilla.org/en-US/docs/Web

Follow following Youtube channels: 1. FreeCodeCamp: https://www.youtube.com/channel/UC8butISFwT-Wl7EV0hUK0BQ 2. The New Boston : https://www.youtube.com/user/thenewboston/featured 3. Ben Award : https://www.youtube.com/user/99baddawg/featured

Outside Youtube: 1. Wes Bos : https://wesbos.com/ 2. Udemy : https://www.udemy.com/understand-javascript/ 3. CSS Tricks: https://css-tricks.com/ 4. Egghead: http://egghead.io

Etc etc


Depends what language you want to learn. For the HTML/CSS side, I always prefered http://htmldog.com, since it was (unlike W3Schools) mostly inline with standards and quality expectations in what it taught and did so in a clear and easy to understand way.

Obviously https://css-tricks.com is recommended too, because Chris Coyier is amazing at CSS (and writing about it), with him and his other writers managing to run a site which not only teaches the basics of CSS, but also keep you up to date with the developments in it too.

Mozilla has a good reference for this stuff, aka MDN. Tons of information about HTML, CSS and JavaScript there, as well as an extremely comprehensive reference for every event type, object data, CSS property, etc:

https://developer.mozilla.org/en-US/

If you want help with React, well the official site is pretty good on the documentation front:

https://reactjs.org/tutorial/tutorial.html

And if you're willing to pay a bit, I found this video tutorial series on the subject absolutely fantastic for learning it too:

https://frontendmasters.com/courses/complete-react-v4/

Hope that helps!


I think the Head First O'Reilly books are a great foundation.

This is my general recommendation to friends and family wanting to learn web development.

Head First HTML & CSS is what he should focus on first.

As he is working through the book have him purchase a domain, setup a website on something like hostgator. That's a great learning experience.

After that book I'd recommend Head First PHP & MySQL.

At this point he could probably setup websites for small local businesses. There are usually lots of local businesses who need a website. Use html/css templates for the design of sites.

Then he can move on to the Head First Javascript then jQuery.

I would create some type of web application using PHP and MySQL so he can see how they work. Maybe a project useful to him to play around with. I would recommend using the bootstrap css framework for the app.

Up till this point deploying with FTP is fine. But this would be a good time to learn about using and deploying with GIT (Github, Bitbucket and GitLab).

After that he could start looking at frameworks, I like Rails (Ruby) and Laravel (PHP).

There is RailsCast.com and LaraCasts.com that are great sites for learning those two frameworks.

After you have the framework basics down and has built a few traditional applications then is a good time to learn Vue or React.

I would also have him pickup a last gen macbook air on sale if he's not a mac user. Rails and Laravel development is just easier on mac. When I was trying to learn Rails on windows I would literally spend more time working around issues with windows than the actual tutorial.


http://www.freecodecamp.com/

https://www.codecademy.com/

https://teamtreehouse.com/

https://www.pluralsight.com/

https://scrimba.com/

https://www.theodinproject.com/

https://www.bento.io/

http://exercism.io/

https://learnxinyminutes.com/

And tons of others...


I see a few sites listed on here, but one of the most valuable skills that allowed me to become a software engineer was the ability to find this kind of information and reason about it.

I would encourage you to (if possible) sit with your son and just observe as he tries to figure out things. When he asks questions, try to respond with questions that prompt him to refine the questions he is asking, until he answers it himself.

This was something I had to learn on my own, and I've seen resources every now and then referring to this as "grit" or "persistence". In learning software engineering, I've found a lot of things boil down to getting the questions right, rather than the answers.

A big part of that is developing the vocabulary and grammar used to speak and reason about web development. Learning that was a ton of googling and head scratching till things started to click.


I know a lot of HNers hate udemy because of the piracy and shady sales tactics but for me at least it has been an invaluable resource. I was able to learn Vue in almost 2 hours including some advanced concepts very quickly.

There are some great teachers on that site like Maximilian Schwarzmüller who are not only great at explaining concepts but also show you how to create real world app. Also YouTube is another great resource, for some reason a lot of paid courses are uploaded on youtube by the authors for free too.

One last thing. My secret sauce for learning is a chrome extension called video speed controller. I generally watch these video tutorials at 4x to 6x speed.. it not only saves you a lot of time but I think I'm able to learn much better at faster speeds (maybe as it doesn't let the mind wander)


I think Google is the best resource. You want to ensure that he is good at training himself. Google plus CodePen for starters.

So have him come up with a simple project and then have him break that down into sub goals. They have him start googling. Make sure he drills down and searches for more basic information when that is referenced in relation to his specific problem and he doesn't know part of it.

Have him use Google and web resources to teach himself to set goals, decompose problems, search for solutions, and learn fundamental concepts. That involves some coaching in your part.

Online courses should probably be used to supplement and test breadth of knowledge. But primarily it is about giving him time to practice problem solving and self-training.


I cannot say enough good things about Colt Steele on Udemy. It's about $10 for "Web Developer Bootcamp" that covers HTML/CSS, JavaScript, NodeJS and touches on MongoDB. Then another $10 for "Advanced Web Developer Bootcamp" which covers advanced JavaScript, AJAX, React, etc. If the site is quoting you more than $10 or $15 for the courses try deleting your cookies or using incognito. They're known for showing users "custom" prices.


THANKS! Great timing on the black friday sale.


it's basically always on sale


https://www.theodinproject.com/


https://medium.freecodecamp.org/my-journey-to-becoming-a-web...


many public libraries provide free subscriptions to Lynda.com which has some pretty good tutorials


I always try to recommend https://teamtreehouse.com. They helped me start my career, and they've helped a few friends do the same.


The best advice I can give is to just start programming. Get your hands dirty, experience using something will teach you more than any book. Think up something cool and build it.


Frontend and JavaScript tutorial for beginners (free): https://yoember.com


pluralsight.com has great videos for Angular; I'm sure their content is equally as good for React.

It's "cheap" to me as a 15+ year web developer, but price is objective - $35 / month or just commit and drop the $299 for the year (USD)

'been soaking up all kinds of content. Angular, C#, Python, even brushing up on some HTML / JS - the videos are probably the best I've seen.


Laracasts.com and codecourse.com for laravel and vuejs rapid application development


“Web Dev” encompasses a hell of a lot of material. I’m still a fan of books.


User toddmcleod and channel JustForFunc on YouTube.




Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: