Front End Developer Roadmap Куратор сообщества программистов

Что вы узнаете

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

обзор

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)

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)

Как следовать этой дорожной карте?

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.

Обсудить эту дорожную карту:

Задайте вопрос или напишите свой отзыв/обзор этой дорожной карты или расскажите что-нибудь людям, рассматривающим эту дорожную карту.