# Zero to Hero -- HTML, CSS & JS

> Source: <https://gist.github.com/elsewares/acc41e73717e1c9bc9dda5956e8fe282>
> Published: 2018-06-19 18:14:07+00:00

The start of the runway is pretty shallow, but it gets deep fast as soon as we hit the Javascript parts. You should be sure to have the following on your computer (I'm assuming a Mac, but if it's Windows, we can work with it).
- Atom, Sublime 3 or some other better-than-plain-text editor. I recommed Atom: https://atom.io/
- iTerm 2 - A vastly superior terminal for MacOS: https://www.iterm2.com/
- A non-Safari browser: Chrome or Firefox will do. (Safari is the modern-day equivalent of IE back in the day. Horrorshow.)
- Basic HTML.
- Basic CSS.
- CSS Framework(s) - Bootstrap
- Flexbox.
(Note: I'm not going to lie - FreeCodeCamp has almost everything you need to get started on the ground floor. If you go there and decide not to follow the rest of this outline, you're not doing yourself any harm at all.)
- Basic JS - learning the basics of the language, syntax.
- jQuery - Uses CSS selectors to manipulate the DOM. Also, teaches chaining, DOM nodes.
- Bootstrap 2: Electric Boogaloo - Using the JS components from Bootstrap.
- https://css-tricks.com/javascript-learning-landscape-2018/ - An overview of learning modern JS development.
- http://jsforcats.com/
Up until this point, all you've needed is a text editor of choice and a web browser. To get into the real hardcore modern JS development, we need to talk about tooling. Unfortunately.
- https://www.telerik.com/blogs/how-to-javascript-in-2018 - Basic overview.
- https://ashleynolan.co.uk/blog/frontend-tooling-survey-2018-results - Another overview.
I provide these mainly to give you an idea of the complexities involved in working with the most popular JS libraries (React, etc) - these all require using command-line tools to work effectively and efficiently. It's a broad landscape with lots of opinions that I won't push on anyone. Just know that the hockey-stick of learning gets steep for a bit, but once you have the concepts down (pre-compiler v. packager v. task-runner v. test-runner), you're more than halfway there.
- https://vuejs.org/ - Vue.js
- https://reactjs.org/ - React
- https://angular.io/ - Angular