Моя новая профессия - frontend-разработчик

Базовый курс в HTML academy

1. Курс "Знакомство"

2. Структура HTML-документа

3. Разметка текста с помощью HTML

4. Ссылки и изображения

5. Знакомство с таблицами

6. Знакомство с формами

7. Знакомство с CSS

8. Селекторы

9. Наследование и каскадирование

10. Промежуточные испытания

11. Оформление текста с помощью CSS

12. Блочная модель документа

13. Позиционирование

14. Сетки

15. Фоны

16. Мастерская: создаём меню

17. Мастерская: декоративные элементы

18. Завершающие испытания

Курс JavaScript в geekbrains

Прочитать книгу Д. Вельгошика "Как верстать на HTML5 и CSS3"

1. Сайты и Лего

2. Делаем наш первый сайт

3. Особенности идеального HTML-кода

4. Упражнение: верстаем пост блога

5. Визуальный сайт в CSS3

6. Меню, пожалуйста

7. Понимание селекторов CSS

8. Время для итогов

9. Формы в HTML5

10. Разница между <div> и <span>

11. Дополнения форм

12. Многоколоночный макет

13. Что дальше?

Jquery

Курс HTML5 и CSS3 в Geekbrains

1. 1 занятие HTML5

2. 2 занятие CSS3

3. 3 занятие CSS3, часть 2

4. 4 занятие CSS3, часть 3

5. 5 занятие Современные инструменты веб-разработчика

6. 6 занятие Less и Bootstrap

7. 7 занятие Canvas и Video

8. 8 занятие Новые возможности HTML5

9. Сертификат

PHP

Найти место для стажировки

Пройти курс JS на JavaScript.ru

Найти работу веб-верстальщиком

Основы SEO

Разобраться во Flexbox

Основы дизайна сайтов

MySQL

Cистемы управления версиями (Git, SVN и т.д.);

1. Курс Git. Быстрый старт Инструмент командной разработки в Geekbrains

2. Git How To — интерактивный тур http://githowto.com/ru

Тренировки

1. Сделать несколько кнопок и сохранить их как шаблоны на будущее

2. Потренироваться с формами и сохранить их как шаблоны

3. Тренируем списки с картинками вместо маркера

4. Потренироваться с блоками, пока слабовато

Разные мелочи и непонятки

1. Поразбираться с prefixfree ...например тут http://ruseller.com/lessons.php?rub=29&id=1323

2. normalize.css https://htmlacademy.ru/blog/64

3. трансформации блоков с помощью css масок https://viget.com/inspire/angled-edges-with-css-masks-and-transforms

4. Bootstrap

5. Справочник EMMET сокращений для ускорения верстки

6. LESS, SASS, SCSS видео http://geekbrains.ru/events/121 (основной упор на SASS, LESS вроде как устаревает)

Landing pages

БЭМ

1. Быстрый старт https://ru.bem.info/

2. https://ru.bem.info/method/

3. Видео BEM на практике (Яндекс в гостях у Loftblog)

Продвинутые курсы от html academy

JS

1. learn.javascript.ru/

2. developer.mozilla.org/ru/docs/Web/JavaScript

3. freecodecamp.com/

4. codecademy.com

5. Прочитать книгу "Изучаем программирование JavaScript" Э.Фримен, Э.Робсон

Препроцессоры от html academy

Developer Tools - разобраться со всеми вкладками

Сверстать 5 макетов на несколько страниц

Выложить сайт на хостинг

Git

1. Зарегиться на github.com

2. Установить десктопную версию Github

3. Посмотреть обучающую видюху

4. Почитать хелпы

5. Посмотреть видео-семинар на geekbrains

Прочитать маниакальный учебник http://softwaremaniacs.org/blog/category/primer/

Посмотреть видео Уроки веб-разработки

Курс «Мастерская: создаём меню» в htmlacademy

1. Создаём вертикальное меню

2. Добавляем ссылки

3. Сбрасываем стили списка

4. Оформляем контейнер меню

5. Оформляем пункты, простой вариант

6. Более сложное оформление пунктов

7. Добавляем разделители

8. Оформляем состояния пунктов

9. Испытание: вертикальное меню

10. Многоуровневое вертикальное меню

11. Устраняем проблемы оформления

12. Переносим рамки, задаем отступы подменю

13. Оформляем пункты подменю

14. Тестируем на большой вложенности

15. Испытание: многоуровневое меню

16. Горизонтальное меню

17. Что делать, если пункты не влезают?

18. Усложненное оформление пунктов

19. Завершаем оформление пунктов

20. Испытание: горизонтальное меню

21. Вертикальное меню с выпадающим подменю

22. Позиционируем выпадающее подменю

23. Отображаем подменю при наведении

24. Горизонтальное меню с выпадающим подменю

25. Оформляем выпадающее меню

26. Включаем механизм выпадания

27. Состояние «открытое подменю»

28. Испытание: выпадающее меню

Open Server

1. Установить и настроить Open Server

2. Прочитать мануал