
Ask HN: Self-taught devs, what are the best cheap resources for learning webdev? - Mc_Big_G
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&#x27;s currently working as a computer &#x2F; electrical tech at an industrial fan company and doesn&#x27;t have a degree or desire to go to college.<p>I&#x27;m a web developer and can easily google various resources but I&#x27;m looking for opinions from people who have actually done it and which resources turned out to be the best for them.<p>Ideally it would be a progression of HTML&#x2F;CSS =&gt; Javascript =&gt; React
======
otras
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](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/](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...](https://www.edx.org/course/cs50s-introduction-computer-science-
harvardx-cs50x)

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

[2]: [https://www.edx.org/course/introduction-to-computer-
science-...](https://www.edx.org/course/introduction-to-computer-science-and-
programming-using-python)

~~~
Kagerjay
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

------
lioeters
I'd recommend getting familiar with MDN: Web technology for developers.
[https://developer.mozilla.org/en-
US/docs/Web](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).

------
hackermailman
LambdaSchool
[https://lambdaschool.com/apply/](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](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/](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

------
systematical
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.

------
dangerface
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.

------
babaganoosh89
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/](https://open.appacademy.io/)

------
marpodomarp
I'm personally a big fan of Frontend Masters:
[https://frontendmasters.com](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/](https://wesbos.com/courses/).
His React tutorial is definitely my favorite one out there.

~~~
respawnzero
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.

------
3into10power5
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.

~~~
hackermailman
I've mostly cheated by using CSS preprocessors like Sylus ([http://stylus-
lang.com](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](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](https://www.wiumlie.no/2006/phd/#ch-problems)

------
shubham_sinha
[https://developer.mozilla.org/en-
US/docs/Web](https://developer.mozilla.org/en-US/docs/Web)

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

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

Etc etc

------
CM30
Depends what language you want to learn. For the HTML/CSS side, I always
prefered [http://htmldog.com](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](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/](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](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/](https://frontendmasters.com/courses/complete-react-v4/)

Hope that helps!

------
saluki
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.

------
zuttton
[http://www.freecodecamp.com/](http://www.freecodecamp.com/)

[https://www.codecademy.com/](https://www.codecademy.com/)

[https://teamtreehouse.com/](https://teamtreehouse.com/)

[https://www.pluralsight.com/](https://www.pluralsight.com/)

[https://scrimba.com/](https://scrimba.com/)

[https://www.theodinproject.com/](https://www.theodinproject.com/)

[https://www.bento.io/](https://www.bento.io/)

[http://exercism.io/](http://exercism.io/)

[https://learnxinyminutes.com/](https://learnxinyminutes.com/)

And tons of others...

------
banashark
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.

------
superasn
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)

------
ilaksh
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.

------
elliekelly
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.

~~~
Mc_Big_G
THANKS! Great timing on the black friday sale.

~~~
vidro3
it's basically always on sale

------
CloudBuddy
[https://www.theodinproject.com/](https://www.theodinproject.com/)

------
Ptyx
[https://medium.freecodecamp.org/my-journey-to-becoming-a-
web...](https://medium.freecodecamp.org/my-journey-to-becoming-a-web-
developer-from-scratch-without-a-cs-degree-2-years-later-and-
what-i-4a7fd2ff5503)

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

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

------
samorozco
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.

------
vmware505
Frontend and JavaScript tutorial for beginners (free):
[https://yoember.com](https://yoember.com)

------
lsiunsuex
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.

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

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

------
albumdropped
User toddmcleod and channel JustForFunc on YouTube.

