DEV Community

Discussion on: What I need to be front end developer

Collapse
 
codyseibert profile image
Cody Seibert

Get a solid foundation on Html, css, and JavaScript. Spend a lot of time on JavaScript. Learn how to debug JavaScript using the debugger. Get a good understanding of Map, filter, reduce and other useful JavaScript array, string, object methods. Understand how to hook your html into your JavaScript using events.

Then try to build clone websites (Facebook clone, instagram clone, Twitter clone) without watching tutorials. Just try to clone one page. If you can’t do it by yourself and looking up code snippets, go back to html, css, and JavaScript fundamentals. Rinse and repeat until you can clone any website just by looking at it.

Then learn about responsive design. Learn how to scale the width of your browser and still have it looks nice on mobile or tablet views. Again, you can try to clone existing sites for the experience.

Now learn a css framework like bootstrap which will take care of all of this responsive design stuff using helper css classes along with a bunch of pre made components you can use on your website. Start learning to stop reinventing the wheel and reuse existing code already out there on the open source community.

Next, learn to connect your website to apis to and dynamically generate dom elements and add them to the page. Also learn how to dynamically remove and modify existing dom elements on the page.

If you feel you understand all that pretty well, you should be able to build a multiple page website that displays data from a rest api. I think there are a lot of free apis out there you could play around with.

Now, learn a reactive framework, such as react, basically takes care of all of the stuff you just learned about dom manipulation. It makes everything much easier (but can be confusing to learn at first if your
JavaScript fundamentals are lacking). Learn to build a single page application using a router (react-router). Learn to manage state using useState hooks and contest and prop drilling. I’d avoid learning redux until you’ve successfully built a larger scale SPA.

If you’ve made it this far you should be able to land a job. Now start learning about higher level topics such as the pros and cons of single page applications and why a lot of people are using next.js for server side rendered applications. How to make web applications more performant. How to reduce bundle sizes. How to make your site accessible and work with a screen reader, pass contrast rules, etc. learn how to deploy your UI somewhere (GitHub pages, vercel, netlify). Learn how to test your application using unit tests (jest), e2e tests, pa11y tests.

I’m sure I missed a lot, but if you follow that you should at least be a pretty solid front end engineer.