Front End Developer Roadmap comisariada por la comunidad de programación

Lo que aprenderás

Basics of HTML5, CSS3 and Javascript.
Basics of UI/UX Design
Boostrap3/4
React 16
Git

visión general

With the rise in the development of web-based products, front-end Developers are in very high demand. Also with the invention of many cutting-edge frameworks in Javascript front-end has become really complicated and demands very high skills. Gone are the days when back-end development was the tougher part and front-end was considered just writing styles in CSS and handlings clicks with jQuery. It is so much more than that today.

In this roadmap, you will learn about all the essentials of the front-end that will get you up and running in your journey.

HTML5 and CSS3 Basics

Learn and understand the basics of HTML5 and CSS3, which are also known as the structure and skin of the web respectively. The tutorials mentioned above are enough to give you a good grasp of HTML and CSS.

30 Days To Learn HTML + CSS Course (youtube.com)

Introduction to HTML | Codecademy (codecademy.com)

Learn to use Bootstrap

Bootstrap is a toolkit consisting of ready-made styles that can be used in any web project to get started quickly. It is really easy to use and gives a very decent looking website even in the default styles. Also, it is really easy to configure.

Unapproved

Bootstrap 4 tutorial (mdbootstrap.com)

Project

Make a Landing Page in Bootstrap

Learn Javascript

Javascript is the language of the web. It is used to handle user interaction on the browser, hence every website uses it. It's impossible to create a website without using Javascript. Eloquent Javascript is one of the best books on Javascript. It is considered a must-read for every Web Developer.

Eloquent JavaScript (eloquentjavascript.net)

Project

Make a to-do list app in Javascript

ReactJS

If you choose ReactJS, these tutorials will be very beneficial in clearing out your basics. If you don't mind paying, go for 'React For Beginners', otherwise, we suggest 'Awesome React'.

Awesome React (github.com)

React for Beginners (reactforbeginners.com)

Project

Learn React by Building Cool Projects

Git Basics

Git is a version control system commonly used by organizations to maintain their software. This guide by Atlassian should be enough to get you started.

Git Guru Guide by Atlassian (atlassian.com)

¿Cómo seguir esta hoja de ruta?

You should start by exploring HTML5 and CSS3.
Once you are comfortable with them, you can move on to Bootstrap 4 and build something. Try to copy the design of any famous website you like and see if you can re-create it on your own.
Next, you should learn Javascript and how to handle user interaction.
Once you have spent enough time perfecting your Javascript, then you can move on to learn a front-end framework of your choice. We recommend React.

Lastly, make sure you keep building something at every step of your learning. Remember, Practice is the key to perfection.

Comenta esta hoja de ruta:

Haga una pregunta o escriba sus comentarios / reseñas de esta hoja de ruta o diga cualquier cosa a las personas que estén considerando esta hoja de ruta.