Frontend-разработка

Дополнительный материал к первому блоку

Материалы не являются обязательными и прикладываются в качестве рекомендаций. Вы можете добавить порталы и ссылки в закладки. По мере прохождения курсов мы будем выдавать вам ссылки и порталы, где можно читать дополнительные материалы, искать ответы и следить за новостями отрасли:

• Книга «HTML и CSS. Разработка и дизайн веб-сайтов» Джон Дакетт. Полная версия тут

• Книга «Новая большая книга CSS» Дэвид Макфарланд.

• Основа методологии БЭМ Здесь очень ясно и понятно объясняется: https://www.youtube.com/watch?v=HihYQVuH64U&t=61s

• HTML on MDN.

• HTML и HTML5. Описание тегов по основным разделам.

• Список актуальных знаний для HTML-верстальщика.

Материалы рекомендованные другими участниками программы обучения

• https://learn.freecodecamp.org/ — бесплатный аналог htmlacademy

• http://htmlbook.ru/ — теория и есть несложные задачки на верстку (для практики полезная штука)

• http://htmlbook.ru/html - по html

• http://htmlbook.ru/css - по css

• https://webshake.ru/test-html/start - тест по html, проверь себя

• https://code-basics.ru/languages/javascript - основы JS, интерактивный бесплатный курс

• https://tproger.ru/translations/flex-properties-on-css/ - анимированое руководство по flex

• http://howtocenterincss.com/ - Как отцентрировать все что угодно

• https://fructcode.com/ru/courses/ - интересный сервис, есть как и база HTML/CSS, так и JS + jQuery для следующего этапа

• https://webref.ru/ — хорошие туториалы по основам

• https://htmlreference.io/ — инфа по html тегам

• https://cssreference.io/ — инфа по css свойствам

• https://flexboxfroggy.com/#ru — игра для изучения flex

• https://flukeout.github.io/ - игра для изучения css селекторов

• https://tpverstak.ru/flex-cheatsheet/ — хорошая шпаргалка по flex

• https://frontender.info/centering-css-complete-guide/ — все о центрировании в css (много способов для разных задач)

• https://git-scm.com/book/ru/v2 - настольная книга по git

• https://designpub.ru/long-dash-c0b28fab6fdb - о правилах типографики в вебе

• https://www.youtube.com/watch?v=Rke_Z1-nvUM&list=PL3LQJkGQtzc5rDeb7FjACNb6sOW300yA0 - Git для самых маленьких, наглядно

• https://www.w3schools.com/ -- материал разбит по блокам, можно посмотреть код любого примера, после блоков есть задания на повторение пройденного

• https://habr.com/ru/post/463923/.

• https://flexboxfroggy.com/ Игра, позволяет изучить флексы

• http://howtocenterincss.com/ – how to center in CSS.

• https://www.sololearn.com/ - площадка, на которой есть курсы по различным дисциплинам, плюс есть различные тесты и задания.

• https://checkio.org/ - здесь можно попрактиковаться в решении различных задач с помощью js.

• Glo Academy -- полезный канал на ютубе по html/css/js/git

• Еще есть хороший канал "Фрилансер по жизни". Евгений выкладывает всю информацию бесплатно. На добровольном основе можно задонатить и за это будут крутые плюшки. Не реклама. Сама смотрела его видео и узнала для себя много новогоhttps://www.youtube.com/channel/UCedskVwIKiZJsO8XdJdLKnA

• http://www.itmathrepetitor.ru/zadachi-po-html-i-css/ - задачки по верстке

• https://basicweb.ru/ - Справочные и учебные материалы HTML, CSS, JavaScript, jQuery

• https://learn.javascript.ru/ - современный учебник по JS

• https://github.com/yoksel/common-words – Слова, часто используемые в CSS-классах (если ступор какой класс задать)

• https://javarush.ru/groups/posts/2683-nachalo-rabotih-s-git-podrobnihy-gayd-dlja-novichkov - разжёвывается ГИТ досконально на простом языке

• Бесплатный курс "Системы контроля версий (GIT)" на 6 часов на русском языкеhttps://ru.hexlet.io/courses/intro_to_git

• Просмотрите объемный скринкаст по Git наhttps://www.youtube.com/playlist?list=PLDyvV36pndZFHXjXuwA_NywNrVQO0aQqb

• Попробуйте интересную игру для изучения Git наhttps://learngitbranching.js.org

• Изучите CSS Grid с помощью игры наhttp://cssgridgarden.com/#ru