Как стать классным фронтенд-разработчиком

Всем привет! Меня зовут Кирилл Жаров и я постараюсь сформулировать как стать классным фронтенд-разработчиком! Постараюсь на Ваших глазах прокачиваться и по-ходу делиться своими мыслями, опытом и знаниями.

Во-первых, необходимо определиться со сферой, я хочу сделать упор на такие инструменты как: React, ES6, Node.js, Redux, Webpack, которые весьма актуальны в данный момент. Тем более для фронтенд-разработчиков сейчас наступает удивительное время. Как сказал Eric Elliott: 
 

«Software is eating the world, the web is eating software, and JavaScript rules the web»

 

Во-вторых, необходимо составить начальный план для обучения. То что необходимо в первую очередь:

1) Первое и основное это желание и четкое намерение, без первого пункта надеяться на что-то дельное не стоит.

2) Дисциплина, необходимо учиться и закрывать задачи, даже если ты устал и тебе не хочется этого делать.

2) JavaScript, это без обсуждений.

3) Английский, как минимум на уровне чтения технической документации, а лучше разговорный, это важный момент.

4) Умение классно верстать, html5, сss3, bootstrap, pixel perfect, БЭМ-методология, responsive, Mobile First.

5) Умение работать с git, аккаунт на github.com и умение работать с консолью.

6) Будет плюсом умение работать в команде.

7) Ментор, желательно опытный разработчик, это пункт крайний в списке, но далеко не последний по значению.

Итак начнем увлекательное путешествие в мир фронтенд-разработки!

Старт 1 января 2016!
 

Список материалов для изучения:

1) Основы JavaScript learn.javascript.ru, очень полезный ресурс (Спасибо Илье Кантору).

2) Классный сервис, который сейчас использую для обучения это freecodecamp.com, своеобразный лагерь разработчиков, которые разбросаны по всему миру, на нем кроме теории и практики по JavaScript, есть масса всего полезного, первые курсы по html/css/bootstrap, также есть общий чат, где Вы можете задать вопрос, если не получается решить какую-то задачу. Альтернатива codecademy.com, но freecodecamp.com мне нравится больше.

3) «Выразительный Javascript» Автор: Marijn Haverbeke, можно читать онлайн на русском языке karmazzin.gitbooks.io/eloquentjavascript_ru/content (За это спасибо Антону Кармазину), готовые решения задач из книги eloquentjavascript.net/code.

4) Хорошая база: «JavaScript. Подробное руководство» Автор: Дэвид Флэнаган, лучше купить бумажную версию. Примеры кода из книги по ссылке examples.oreilly.com/9780596805531.

5) Для укрепления знаний: «JavaScript. Сильные стороны» Автор: Дуглас Крокфорд, лучше приобрести бумажный вариант.

6) Скринкаст по Node.js learn.javascript.ru/nodejs-screencast.

7) Скринкаст по Webpack learn.javascript.ru/webpack-screencast.

8) Материалы по ES6 learn.javascript.ru/es-modern.

9) Документация по React facebook.github.io/react.

10) Материалы по React github.com/enaqx/awesome-react и react.zeef.com/nick.raienko.

11) Документация по Webpack webpack.github.io.

12) Книга по Webpack и React «SurviveJS — Webpack and React From apprentice to master» survivejs.com.

13) Основы по архитектурe Flux facebook.github.io/flux.

14) Документация по Redux redux.js.org.

15) Redux на русском github.com/rajdee/redux-in-
russian
.

16) Материалы по Redux github.com/xgrommx/awesome-redux.

17) Документация по JSX facebook.github.io/jsx.

18) Замечательный русскоязычный сервис с курсами по React и JavaScript hexlet.io.

19) Замечательный сервис egghead.io с курсами по React и Redux (Спасибо Дане Абрамову).

20) Cписок статей / книг для чтения от Eric Elliott по порядку github.com/ericelliott/essential-javascript-links.

21) Гайд по коду html и css mdo.github.io/code-guide.

22) Основы БЭМ-методологии frontender.info/MindBEMding, БЭМ-методология Яндекса ru.bem.info.

23) Основы по html и css htmlbook.ru, как вариант htmlacademy.ru.

24) Основы отзывчивого веб-дизайна developers.google.com/web/fundamentals/design-and-ui/responsive/fundamentals.

25) Настройка node.js на Windows serverpals.com/blog/building-using-node-gyp-with-visual-studio-express-2015-on-windows-10-pro-x64.

26) Огромное количество материалов по теме: github.com/sindresorhus/awesome.

27) Open source воркшопы nodeschool.io/ru.

28) Изучение JavaScript в игровой форме codecombat.com.

29) Курс по JavaScript codeschool.com.

30) Курс по JavaScript от Sorax youtube.com.

31) Школа вебмастеров Яндекса academy.yandex.ru.

32) Рекомендации по стилю JavaScript от Airbnb github.com/airbnb/javascript.

33) Большой сборник ресурсов по JavaScript superherojs.com.

34) Много материалов по фронтенд github.com/dypsilon/frontend-dev-bookmarks.

35) Документация по JavaScript developer.mozilla.org.

36) Документация по LESS lesscss.org.

37) Список материалов по UX github.com/edx/ux-pattern-library.

Буду рад Вашим комментариям, если есть полезное ссылки для изучения — поделитесь, список будет пополняться, спасибо за внимание!