< Вернуться ко всем дорожным картам

Front End Developer Roadmap

This roadmap will teach you the basics of HTML5, CSS3, JS and a front-end framework, thus enabling you to build beautiful websites.

No pre-requisites for taking this roadmap. A strong desire to learn and interest in understanding the web will help. 

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

  • 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)
Представленный Anandu 6 лет назад 13.2k+ Просмотры 9 Комментарии
Свободно видео
Introduction to HTML | Codecademy (codecademy.com)
Представленный Phil 4 года назад 3.1k+ Просмотры обсуждать
Упражнения / Практика-программа оплаченный

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)
Представленный Piotr 5 лет назад 2.9k+ Просмотры
Свободно

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)
Представленный Gaurav 6 лет назад 30.7k+ Просмотры 12 Комментарии
Свободно Книга

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)
Представленный Gaurav 6 лет назад 37.4k+ Просмотры 6 Комментарии
Свободно Ресурсы
React for Beginners (reactforbeginners.com)
Представленный Phil 4 года назад 9.2k+ Просмотры обсуждать
оплаченный видео

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)
Представленный Gaurav 6 лет назад 5.6k+ Просмотры 1 комментарий
Свободно

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

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

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

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