Introduction

In this post, I'll describe the plan I used while learning Frontend in the past (10+ YOE right now, working as a Senior, and building SaaS in my free time). LinkedIn profile.

Plan:

10% = ~max. 1 hour per day

• 10% - code challenges
• 10% - read articles
• 30% - courses, videos, books
• 50% - build projects

^ It's flexible, can be less or much more dedicated time per day 😅. IMO, it's important to mix often so your brain won't get bored or you won't feel the burnout.

It's always best to learn by hands-on coding and building projects. Additionally, the forestapp is amazing for productivity.

Practice Coding Challenges

It’s good to practice algorithms and solve problems as a Developer. Logical thinking is a crucial ability to succeed and grow in the IT field. Focusing on only one project can lead to quicker burnout, hence switching context can help to keep the right balance.

Don’t overload yourself with coding challenges, try to do at least one per day.

Please, find the recommended websites to practice coding below.

• BigDevSoon Practice Problems
• Codewars
• CodinGame
• Project Euler
• Codeacademy
• HackerRank - recruiters might use it as preliminary tasks
• LeetCode

Note: Try to not spend more than a few hours per day on this, otherwise, your brain might 🤯.

Stay Up-To-Date By Reading

Frontend evolves at a lightning-fast pace. You have to keep that tempo. One article per day, per week, just make sure to be systematic.

There is this amazing browser extension to help you read only what’s loved by other developers.

daily.dev - It will fulfill your browser landing page with articles.

If you still have time to read a bit more, I recommend the following websites.

• Smashing Magazine
• Codeburst
• Medium
• Reddit
• Hacker News
• CSS-TRICKS
• DEV
• JAVASCRIPT.INFO

Note: I highly recommend implementing what you’ve learned, as just reading won’t keep the knowledge with you. Decrease the number of articles you read, don’t aim for super complex things such as Machine Learning, or AI for starting. Read about React, Flexbox, Grid System, and topics you're already working on, and want to expand your skills even further there.

Projects To Build

It’s best to build what drives you the most, or even better if you can build for a friend or family. That will boost your motivation even further 🚀. Try to think about something you really want to have, a portfolio, a website related to your hobbies, or an application you always thought of. If it’s a complex idea, try to simplify, make sure there is at least a piece of it you will be capable of building, and see your dream project live running on a deployed website.
If there is nothing from the above you can think of, that's ok. I’ll share some links for references below.
Below you can find the list of websites with project ideas.

• BigDevSoon - our own little SaaS (20+ real-world projects with Figma designs) ❤️
• freeCodeCamp
• Frontend Mentor
• The Odin Project
• Code Unicorn

Note: Just remember to focus on one project at a time. If it grows and you feel that you won’t make it - decrease the scope, break into smaller pieces, don't be too ambitious, and don't overdo it.

Courses, Videos, Books

I’m a fan of practicing by building but courses, videos, books are a nice addition to your knowledge pack. Take a break from the project you're working on and watch a related course, or video, or read a book.

Having a collection of courses, videos, and books related to Frontend Development is great just avoid "from cover to cover" and have it as a reference. Search for the problem you're trying to solve, follow the instructions, move one step closer, rinse, and repeat.

The below list includes some of the platforms I’ve been learning on.

• Frontend Masters
• Egghead
• Pluralsight
• Udemy
• Safari Books Online - a lot of books after a paid subscription

Additionally, these free books are great for improving JavaScript and to have a good grasp of Frontend Development:

• Eloquent JavaScript
• You Don't Know JS
• FrontendMasters Handbook

Summary

1 hour of Frontend challenge per day, if it's too hard, just try a simpler one, or move it to the next day. Read, but not all the time, try to stick to the topics you're learning, and implement freshly absorbed knowledge. It will click faster. Practice building projects.

Read, watch, and search for a particular problem you're trying to solve. Hands-on the code as fast as you can. Mix often, and your brain won't be bored.

Try different approaches, connect them, and shape up your unique learning process to skyrocket in Frontend Development. 🚀

Closing Notes

Remember, learning to code is hard. You'll fail non-stop, want to quit, and throw it away. Survive and one day everything will "click" together and out of nowhere, you'll start enjoying it to the max. It's worth it.

Don't forget to check out BigDevSoon where we make it simple for you to start building cool stuff from Day 1 and escape that Tutorial Hell Infinity Loop.

Go BIG!