What I need to be front end developer

Comments

[Víctor Torres]

First you need to learn the basics html/css, after that learn Javascript and finally learn a framework such as react or angular and, congrats! you are a front end developer now.
(Explanation super simplified)

[Ramzy]

I started learning html and css but I always find a problem to remember things so I was asking if there are something to learn before html and css

[peerreynders]

For practising there are sites like Frontend Mentor that have free challenges; specifically Free, Newbie (level: 1), HTML & CSS;

Examples:

Order Summary Component; Newbie(1)

Space tourism multi-page website; Intermediate(3)

Other recommendations:

MDN has a fundamental layout comprehension assessment.

I don't know what resources you've used to learn HTML/CSS but some people like Learn to Code HTML & CSS for the very basics. CSS has added a lot recently so Learn CSS should probably be the next stop (they recommend MDN's Introduction to HTML for HTML).

Essentially it's hard to remember things you don't use, so it's important to use them as soon as you learn them (and keep using them). It can also help to put together your own cheat sheets to remind your future self in your own words what you have learned (having to describe it will likely reinforce it or expose gaps in understanding that still need to be filled).

[Tina Huynh]

The more you practice with html/css, the easier it becomes to remember what to use where

[CuriousDev]

You could also start with JS and only learn the necessary parts of HTML/CSS.

[Thomas Hansen]

I agree, but afterwards scatter knowledge with some basic HTTP and REST know how ...

[Ahmed Nagi]

Learn how the browser works, especially the DOM model that will set you far ahead than anything else.

[Ramzy]

ممكن مصادر للتعلم أو كتب؟

[Ahmed Nagi]

عليك وعلى اليوتيوب :)

[Tina Huynh]

A couple of the tools I adore using is:
The front-end checklist
Checklist Design
unminify
and w3cub

[CuriousDev]

First it depends on what we are actually discussing about, is it for Web Development or is it different, second it would be good to know, what you care more about regarding Web Development, HTML with CSS or programming with JavaScript and other languages.
Because HTML with CSS would be specifically for frontend development for browsers and learning programming with JavaScript etc. would be also helpful, if you decide to change to backend development for example or learning a different language.

[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.

[Mudit Mishra]

This might help👇

dev.to/muditwt/how-to-learn-and-ge...