This course is for people who want to build simple projects from scratch, understand how to read and modify existing code, be able to talk to other developers and actually understand what they’re talking about, etc.
I’m not going to lie, this is not one of those “Code Like a Pro in 2 hours!” or “The Ultimate Guide to Get Hired as a Developer!” spiels. There are four steps in this article. Each one of them is going to take more or less time mainly depending on how invested you are in them.
By the end of those steps you will be able to think like a developer. Meaning that whenever an idea pops into your head you will be able to translate it into code or at least be able to clearly express it to developers.
I strongly believe that the way you learn is as, if not more, important as what you are actually learning. It took me a while to figure out the right blueprint to follow in order to optimise my learning process and this is what it looks like.
Ready to learn how to code? Let’s go!
Step 1: FreeCodeCamp
This website didn’t exist when I started learning Web Development and boy am I glad it is available now!
Head to FreeCodeCamp and sign up.
For now you don’t need a code editor, you already have one built into the website and you can also use online code editors (FCC suggests using Codepen).
Here is how it works. The website offers a series of Challenges to complete, ranging from writing a simple code snippet to building algorithms and building a full project. It might sound scary at first but trust me, they know how to make you feel comfy with code!
As you go through those challenges you might get stuck and this is absolutely FINE!
Head to the FCC chat room (directly accessible via the top menu Community > Chat), introduce yourself and ask your questions.
You’d be surprised by how many people are willing to help you with your projects for free. You should always be kind and polite when asking for help and never forget to say Thank you! 🙂
Step 2: Codecademy
Aaaand I could stop there. But here a little bonus tip if you want to dig a bit deeper into the languages you are going to encounter on FCC: Codecademy.
Come on! Another website to sign up for?!
The main difference between Codecademy and FCC is that Codecademy is not practical in the sense that you won’t build anything (unless you pay but I said this would be free). However it will teach you more about a specific language than FCC and it will help you understand better how it works.
I used to solve challenges on FCC until I stumbled upon a new language that I didn’t understand well enough through FCC alone. This is when I would switch to Codecademy, take that particular language’s free course and then switch back to FCC.
At some point you will reach the “Intermediate Front End Development Projects” (in FCC). When you do, take a break and switch over to Watch and Code.
Step 3: Watch and Code
For this one I suggest that you download and install a code editor on your computer (Whichever one you use doesn’t really matter. There are plenty of powerful free editors and I personally use Atom). This will help you to follow along and code as you take each part of the course.
Once you’re done with the course, head back to FCC and nail those Front End Projects!
Step 4: Work on a Project That Matters to You
In my opinion this is by far the best way to learn.
The main highlight in my learning journey was making Boomy Surfcamp‘s website.
Surfing is my main passion and coding is another one, so this was a perfect match! Working on a real life project for a small business that matters to me turned my work into pure pleasure and fun.
In addition, I didn’t have any time pressure but I was so excited about it that I wanted to see the end result as soon as possible.
When the project began, all I had was very basic HTML and CSS knowledge. That’s it.
Then this happened:
- Bought an HTML template on Themeforest.
- Tweaked it to fit the new website’s needs.
- Did some research to learn how to build a shopping cart system with PHP and SQL.
- And voilà! The website is live and ready to go!
There are a couple of things to clarify though.
First, I used PHP back then purely because this is the first language that popped in my mind for this type of work.
And second, the process was not as smooth as it sounds. It took me a few months of trial and error, bugs to get the final version up and running. But I didn’t quit simply because the project deeply mattered to me.
If you don’t build something for yourself, ask people close to you if they need help creating or improving their website. Then you will be accountable to them and it will push you to get it done while learning on the way!
Step 5: Seek Help and Advice
Last but not least, you are not alone in this adventure!
The developers community is brilliant. You will always find people who will gladly help you without asking anything in return and when you can you should try it too! Here are some I recommend:
– FreeCodeCamp’s chat room.
– Meetup groups: FreeCodeCamp’s Facebook group in your city or meetup.com.
– Stack Overflow: This is the biggest online developers community where you can ask questions about specific issues. The community is so active that I usually get solutions to my problems within 5-10 minutes.
A few things to avoid
On my learning journey (which will probably never end), I have tried a few other mediums and tools to practice coding. You will probably hear about stuff like Codewars, Coderbyte, or any other fun coding game.
These are nice but will not really help you get better at building projects or get any substantial thing done. They make coding more fun by gamifying it but I realised that apart from being entertained or being able to brag about solving a “kata” (the name for a “challenge” in codewars) they didn’t help me get better at building websites or mobile apps.
Now enough talking and let’s get your ass moving! What do you want to build? Why do you want to learn coding? What would you like to know more of? Let me know in the comments and go get started!