After wasting one year I created my 3 month self learning front-end road map(help me to improve my learning)

Note> I am really sorry for my bad English (this is my first article ever and i’m also working on my english).

Hey am Noman and am first year of college student (am older than what you thinking) here in Bangladesh. i spend the last year (let’s say 13 month) trying to learn front end web-development during that entire year I thought am not learning because I had a day job, I didn’t have a work space and other things going on in my life.

But I know that if I spend 10 years like this I wouldn’t be able do nothing as a web developer . that’s why last month I decided to quit everything and just study web development. In my mind it was like 3 month that I will study. So last month 29 June I left my town where I was living and came here in another city. And today is 16th days of my that 3 month in this 16 days I listen 3 audio book study English 2 hours and I didn’t do anything.

i’m a big procrastinator

This is not like I don’t know what I need to do but I knew what I need to do instead I was just procrastinating. Also for the last 2 or 3 days I was trying to get rid of my procrastination and I watch a ted video where Tim Urban talks about two types of work in our life one that have deadline and second that don’t have any deadline in first types of work in our mind we have something that fired up and stop procrastinating right before deadline end and for second types work because there is no deadline procrastinators never start working. And end of that video he share a picture he called “A life calendar” one box for one week for a 90 year life. After that I was thinking that I need a deadline it’s the only way that I can stop procrastinating and start working.

My study plan

Then I made 12 box because I have only 3 month that one box for one week and I already wasted 2 box and I have only 10 box left. And I proximately divided what am going to study into those 10 weeks that I have. In these weeks there is no weekend no movie or TV just 7 day study week.

Learning resources

Because I was learning on my own i tired learning by watching lot of YouTube videos and tutorials from sites like Lynda,Udemy,treehous,pluralsight,tutsplus and others like this.

Then after some times I saw learning paths and guids things like that where senior developers make a study guid for new developers to learn.

  • Roadmap to becoming a web developer in 2019 by kamran ahmed
  • React developer road map by adnan gloab
  • Roadmap to become a Vue.js developer in 2019 - Flavio Copes
  • front-end Masters Front-end Developer Handbook
  • Web Development In 2019 - A Practical Guide By traversy media

I tried to match them to me they are almost same so I decided to go for frontend-masters front-end web-developers handbook.

My 10 weeks what am going to learn in this weeks.

Week 01.
English grammar and reading because am having a problem to understand programming concepts from books like Kyle Simpson’s you don’t know js and other JavaScript and programming related books. So I will study some grammar and read 100 books from Penguin Readers Level 0-6 and these books are small and level 1-3 are not that much hard for me so I think I can handle this in one week.

Week 02.
css I spend some times with this things so am almost confident with css so I will focus on things like flex-box,grid,mediaquaries and will complete css section from hand book also make 10 complete projects like home pages and use skills that I will learn like sass,bem,smacs and others.

Week 03.
The javascript section frome handbook. Agin I have some familiarities with javascript and basics of programming in general.

Week 04.
Dom and web animation section frome hand book

Week 05.
react and node I will complete these 2 topics from the recourses that are mentioned in the hand book. Guys I know I won’t be a expert or guru in this 1 week but I just wanted to learn enough that I can start creating projects and I can practice.

Week 06.
computer science (there is a section in the hand book called Learn Computer Science via JS I think on that section 5 courses and 1-2 books ) and multi device development(responsive design) .

Week 07.
check full learning section of the hand book. I skipped lot of topics so decided that in this hool week I will randomly study the learning section the hand has 3 big sections 1. Front-end Development Overview 2.Learning Front-end Development 3.Front-end Dev Tools specially I will learn things like commandline,git,some ui/ux and some other topics that are missed.

Week 08.
Front-end Dev Tools section from hand book

Week 09.
Make a portfolio,create some projects for portfolio we’ll se when I got there and I will try some job hunting and freelancing.

Week 1.
in this last week I will learn some English speaking and writing.

Learning techniques

Feynman Technique for learning the theory and spaced repetition for memorizing if need to memorize something and finally deliberate practice for practicing .

At last if you have any suggestion or if there any improvement that I can make to my learning please let me know I would really appreciate that.


You can make responsive front-end tool so to track everything you do , it will help you alot…
Glad you are on track and learning each day .
Happy Learning and Coding
All the best

1 Like

thanks for your suggestion and wishing. it’s a great idea. i will definitely try to make something like that.