How do people learn foreign languages fast ?
Basically, they combine two principles :
- You do not need to know everything about a subject to be confortable with it.
- You will remember only what you practice.
Well, you can apply those principles to learn Web dev very efficiently ! First, you need to prioritize and eliminate everything that is not absolutely necessary to know. Then, everytime you encounter a new topic, you must practice it, ideally in a complex project.
Here is my method to start from scratch and efficiently become a Web developper in less than 2 months, by practicing !
HTML & CSS ⇒ To make an attractive website
Learn the basics of HTML and CSS through one of the billions of free courses that already exist. It should not take you more than a week or two, especially if you know your way around computers 😉 !
More importantly, because this topic is quite boring, practice every new thing you learn through a portfolio, which you can later use to show your work.
This portfolio should act as a sandbox environment for you to experiment every new piece of information you encounter. It does not matter if it is not professional or clean looking, but it does matter that you have fun while making it !
Vanilla JS ⇒ To add little interactions
Use Javascript to add basic interactions to your portfolio. If it is your first programming language, take your time to assimilate every concept, two weeks is not too much to do that. Remember, your portfolio is a fun experiment field, so add fun interactions !
A list of possible simple interactions :
- A dark mode switch
- A tab system for a section of your portfolio
- A fun and dum little chatbot
- A collapsable animated component
- A secret page that requires password to access 🔒
Git ⇒ To fix your own mistakes
No need to learn Git very deeply, simply spend a day or two to be confortable with the CLI. Setup Git with your portfolio. Learn the role and how to make commits, pull requests and branches. Try to understand how Git can help you roll back to previous versions of your code.
Put your project online on Github, and setup a Github Pages. Now you can share it with the world ! So send it to your friends and see what they think !
React/VueJS ⇒ To easily make incredibly complex apps
Time to learn a front-end framework ! You can learn React or VueJS, both do the same kind of stuff, but once you start with one, you should stick with it. Do your own research to see what you would prefer. If your programming basics are good, you should not need more than a week.
For both frameworks, the original documentation is very good and well maintained, so start with that. For React, make sure to learn hooks and the functional way of writing components.
As always, practice by making a small project. Maybe you are sick of your old portfolio now ? Good, because you should do something a bit more interactive.
Try a ToDo app or reproduce any kind of simple app you use daily.
Stay away from advanced features like authentication or database. You will need a backend for that. Focus on learning the frontend framework as fast as possible. Use the local storage if you need to.
Node + Express + SQL ⇒ To learn back-end and understand how 90% of apps work
This is a big one, so try to not get drown under too much information. Focus on that for only 1 or 2 weeks.
Make a small backend to store data for your frontend app. Don't waste too much time to connect both apps together, use a tool like Postman. Try to understand the role of every element you are manipulating.
First setup a Node/Express server that can receive various HTTP request from Postman. Play with the HTTP protocol, try to understand the REST paradigm.
Then, setup a SQL database, connect it to your Node backend, and use Postman to perform operation on your database. Try to store data, and get it back.
If you still have time, try to connect your API to your front-end app. But don't waste too much time on that.
Improve your stack ⇒ To build your dream project !
There is so many cool and interesting frameworks, libraries and tools in the Web ecosystem, but you don't have time to learn all of them. And a company cannot ask you to know everything. What you need however, is a deep understanding of the basics, and know what kind of tool you need for the right problem.
So it's time to have fun ! Imagine a cool and more original project, something that you would be proud of. Try to solve a problem in you and your friends' life. Scroll through public APIs and find a cool way to use some.
You don't think you can build it ? Good ! That's what everybody think at first.
Now, plan how to build it, research online some tech you may need, and finally, once you have a global overview of your project, start coding. The total process may take some time, depending on your ambition, spend at least a week or two, but maybe more if you want. Either way, you will learn a lot.
You should know how to make a front-end interface, usable on desktop and mobile, how to make it widely interactive, and how to connect that to a back-end, which can handle a database and storing any kind of data.
You will probably need an authentication system (Passport, JWT, Okta, ...), a nice design CSS framework (SASS, Tailwind, Bootstrap), or a third-party API. But if you made it this far, you should be able to gather all the necessary information to decide what you should do.
Use the community, because sometimes you will be really stuck...
Nowadays, you can very easily find communities. If you found this post, you probably are already in some of those. You can participate there and plenty of people will be very happy to help you !
Stackoverflow, Twitter, Reddit, ... have amazing communities for self taught learners, use them well !
Just remember to give back to the community you are in. Answer to other beginner questions, it could start a conversation and you could end up learning even more !
You are done with your big dream project ?
Great ! Now polish it as much as possible. Show it to one or two people. See how they react, and fix your project accordingly.
And now share it with the rest of the world !
To put it online, if you are feeling adventurous, you can try to use Docker and CI/CD pipeline tools.
And don't forget to put it in your precious portfolio.
Oh and... one more thing... Congrats on becoming a Web developer ! 😲 🥳
💡 Feel free to follow me on Twitter (@remyhidra), to get more articles and tutorial about Web development. I just started writing blog posts and I am trying to build a small audience from it, so there will be plenty of content coming soon ! 😄
Top comments (0)