Introduction

Following is my take on How to start developing on Web? where you’ll find a basic summary that can be handy these days as a first step into the Web Development world.

Note: although technology is constantly changing, the following described concepts have been the most predominant out there for quite some time (at least 5 year) and will likely remain the same for a while.

Where to start?

Let me introduce the biggest concepts first.

Birds’ Eye View

So the biggest concepts these day include:

  1. HTML: I’d recommend to start with HTML, learning it will make the rest of stuff easier (JS, CSS).
  2. CSS: Then playing with CSS, not too much but understanding the basics will be more than enough.
  3. JS: The part that will require most of the time will be JavaScript, learning it well will take some time but it will pay off (80% of Web Development work is done with JS).
  4. React: Last but not least, would be good to round up all the three learnings into one Web framework, and the most populare one is React.

Greater details

List of technologies to learn, ordered from easiest to hardest:

  1. HTML
  2. ARIA
  3. CSS
  4. Flexbox
  5. Grid
  6. Animations
  7. JS
  8. Promises (fetching data from server)
  9. Async/Await (you can use Promises with or without async/await but is good to know the difference)
  10. React
  11. Redux (one of the hardest part of React is handling state, this is how lots of people do it)
  12. React Router (most popular library to do routes in React)
  13. Hooks (this is quit advance but its the new and cool way for developing React apps)
  14. NextJS (React framework, so it is even bigger than React itself!)

Resources

The following resources are free and, altough I haven’t tried them on my own, many people found helpful.

  • HTML: Codeacademy’s course is very easy and informative at the same time. In case you prefer practice instead of theory then Learn HTML might be of your choice.
  • CSS: the CSS guide by MDN covers very nicely theory and practice.
  • JS: almost every Web Developer have heard about You Don’t Know JS book which is a book introducing to, not only JavaScript, but programming in general as well.
  • React: now this phase will require from all the previous learnings (HTML+CSS+JS) and the best tutorial out is the official one.

Besides these specific tutorials and guides, a great resource for learning web development is EggHead which contains high quality learning video tutorials (in case you like learning from videos then is a good choice).