/roadmap-for-frontend-developer

We listed out steps to become a frontend developer from fresher. [Never stop Learning]

FRONTEND DEVELOPER's RoadMap: [Never stop Learning]

1. know what you going to develop and how they developing [Basics OF SDLC in realtime projects]
2. basics of linux https://www.tutorialspoint.com/unix/index.html

3. fundamental of websites.

   [web site's end to end working methodology](https://www.superwebpros.com/blog/how-does-a-website-work/)
   extra => know the details about public ip, private ip and virtual ports(http, https is must) usages.

4. HTML, CSS, JS uses.

    1. structure of the webpage, 
    2. importance of block tags, inline tags, quatations tags, semantic tags, 
    3. style rendering pipiline & css Trigggers (https://web.dev/rendering-performance/, https://csstriggers.com/)
    4. how to start web design with css and html [css style periority, positions, alignments, flexbox, layers, look out the all design page, plan for common usage like plan all heading with h2 tag]
    5. responsive design elements like (plan layout then start  relative (%, vh, vw,  rem, em) & fixed (px) units, viewports, media query)
    6. Start Js with hello world and complete based on w3schools. (complete all the topics wiht practically)
    7. complete CRUD Ops with js like TODO list task, use array as internal storage and localstorage for persistent.
    8. practice ajax and fetch with jsonplaceholder [REST API providers]
  1. Importantance of Flowcharts (must for freshers) and manual iterations. [start your program with it for complex logic]

6. typescript (now a days most frameworks comes with it. so, must for frontend developer)

           let,const, 
           getter, setter, 
           OOPs class, inheritance, intefaces, abstract, generics.

7. debugging

    learn chrome devtool [https://www.youtube.com/watch?v=aeCxJzriXWo] (it will help you to fix when you stucked in something)
  1. learn basics devops knowledge like source code management with GIT, deployment with git up pages or heroku and deploy your project
  2. Start with any framework like ReactJs, VueJs, Angular. (velocity of learning will be same if you completed all above, if you dont know TS then crate-react-app)

10. Tips &tricks.

     1. coding standard (write a code to understand for everyone and international standards) [PLAN FIRST BEFORE YOU START]
        1. Solid pattern, 
        2. clean code,
        3. design pattern, 
        4. BEM (css coding standard, Google web dev recomended)
        5. being practice with DSA and problem solving with hackerrank or leetcode, it will help you to make confident in programming

Stll want to learn more

  1. SEO
  2. UX tool Figma, XD
  3. Start MEAN or MERN Stack