Курс «Создание сайтов Front-end разработка»

Школа: HELLO WORLD
Направление
Программирование для начинающих
Формат
Прямые эфиры
Вебинар
Упражнения на платформе
Домашние задания
Есть
Итоговый экзамен
Нет
Количество уроков
50
Документ об обучении
Нет
Обратная связь
Есть
Доступ
Сразу после покупки
Последнее обновление 22.05.2022

О курсе

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

Что я получу от курса?
сможешь создавать сайты, их мобильные версии, а также браузерные игры;
научишься работать с программами, которые программисты используют в работе;
наставник поможет расти быстрее и не забросить обучение;
возможность пройти стажировку в IT-компании.

Поговорим о базовых понятиях в Интернете и его архитектуре. Узнаем, что такое домен, хостинг, клиент-серверная архитектура. Настроим рабочее окружение и поговорим о трех китах Front-end разработки — HTML, CSS и JavaScript.

Программа курса

  1. Создадим первые HTML-страницы, рассмотрим примеры простых и сложных веб-страниц. Разберемся, какие блоки должны быть в нашей странице. Заставим наши страницы ссылаться друг на друга, узнаем чем текст отличается от гипертекста и что такое теги и атрибуты.
  2. Узнаем как правильно работать с текстом в HTML: разбивать его на абзацы, указывать заголовки и подзаголовки. Научимся делать нумерованные и маркированные списки и процитируем классиков.
  3. Подробнее познакомимся со ссылками, а также научимся вставлять картинки и использовать их в качестве ссылок.
  4. Создадим свою первую таблицу и узнаем из каких тегов она состоит. Научимся объединять ячейки, менять количество строк, столбцов, выравнивать текст и многое другое. Также узнаем основные советы от дизайнера, как сделать вашу таблицу красивой.
  5. Сверстаем свою первую форму, научимся работать с полями ввода, выпадающими списками, чекбоксами и, конечно же, кнопками. Изучим прочие элементы форм, которые пригодятся нам в дальнейшем.
  6. Вспомним, что такое CSS и как его использовать. Узнаем как используют CSS при работе с HTML-страницами. Изучим синтаксис CSS и что такое селекторы, наследование, с каким приоритетом наши стили применяются к HTML-документу.
  7. Более подробно изучим селекторы. Узнаем как обращаться к одному или нескольким элементам, в чем отличие класса от псевдокласса и элемента от псевдоэлемента. Посмотрим на рекомендации по работе с CSS и узнаем, что любят спрашивать на собеседовании о CSS.
  8. Узнаем, что каскадирование и каскадеры - это не из одной области. Поймем по каким принципам CSS-стили применяются к HTML элементам.
  9. Вернемся к тому, с чего начинали - к тексту. Узнаем как делать наш текст красивым и удобным для пользователя, используя CSS-свойства: жирность, курсив, размер, цвет, фон и прочие.
  10. Изучим теги div и span, а также как задавать размеры элементов, отступы и рамки. Поймем как формируется блочная модель документа и какими возможностями по позиционированию элементов мы обладаем.
  11. Познакомимся с третьим китом Front-end разработки - JavaScript. Узнаем что такое переменные, типы данных и зачем они нужны. И конечно же напишем свою первую программу.
  12. Вспомним о логике, логических операциях и их комбинациях. Да прибудет с нами сила и контроль над ней.
  13. Узнаем как делать много, а писать при этом мало кода. Поймем что цикл в цикле - это просто, но нужно быть внимательным.
  14. Бывают массивы льда, леса и бывают массивы в программировании. Что между ними общего, а чем они отличаются - мы изучим в этом уроке. Подсказка - нам очень помогут циклы из предыдущего урока.
  15. Если переменные и правильно выбранное имя для них - это азбука программирования, то умение работать с функциями и выбирать им подходящие имена - это уже пропись. Как разбивать программу на логические блоки и почему это важно - мы узнаем в этом уроке.
  16. Мы познакомимся с понятием объектов, методов и начнем знакомится с принципами ООП.
  17. JavaScript был бы бесполезен, если бы он не мог взаимодействовать с HTML документом. Мы узнаем, что такое DOM (Document Object Model), но что более важно, мы научимся через JavaScript работать с HTML и CSS.
  18. А теперь мы перейдем на новый уровень и узнаем, как реагировать и взаимодействовать с пользователем при помощи JavaScript. Также мы узнаем, почему события в JavaScript могут всплывать и тонуть.
  19. Узнаем какие изменения произошли в HTML5 и почему. Изучим новые элементы и разберем кейсы их правильного использования.
  20. Разберемся с новыми способами структурирования страниц и позиционирования элементов на них.
  21. Познаем темную сторону силы и попрактикуемся с новыми формами в HTML5, а также с изменениями в старых. Поработаем с новыми типами полей для ввода дат, цветов, чисел и как подсказывать пользователю, чтобы сделать его жизнь чуточку легче.
  22. В этом уроке вы диджей, а также монтажер. Собственный Youtube за этот урок мы сделать не успеем, а вот сверстать прототип с базовой функциональностью очень постараемся.
  23. Узнаем какие есть возможности и рекомендацию по оформлению текста в последней версии стандарта.
  24. Узнаем как создавать анимацию и различные эффекты при помощи CSS3. Ознакомимся с подводными камнями при создании таких эффектов.
  25. Узнаем для чего нужно верстать адаптивно, а когда это излишне и может навредить. Разберем основной синтаксис и, конечно, попрактикуемся в адаптивной верстке.
  26. Узнаем о современных подходах к блочной верстке, а также какие есть сложности с их использованием.
  27. Хотите использовать переменные в CSS? Легко! Узнаете, что можно сделать интересного использовании CSS препроцессоров.
  28. Что такое современный JavaScript, "строгий режим" и как жить со всем этим.
  29. Изучим как устроены классы в современном JavaScript и зачем они используются, если можно сделать все на функциях. Как устроено наследование и какие еще способы создания классов существуют в JS.
  30. Узнаем что такое Function Declaration и Function Expression, узнаем как вызвать функцию без имени. Разберемся с таким словосочетанием как "привязка контекста".
  31. Выведем себя на новый уровень как разработчиков, научимся делать HTTP запросы, и узнаем как сервер и клиент могут общаться друг с другом и не ссориться.
  32. "Если у вас есть проблема, и вы собираетесь её решать с помощью регулярных выражений, тогда у вас будет уже две проблемы". Узнаем, как не выстрелить себе в ногу при помощи регулярных выражений.
  33. Bower, npm, gulp, Grunt, webpack и ко. В этом нет ничего сложного, но нужно будет разобраться.
  34. Там где есть код, всегда есть ошибки. Вы узнаете как минимизировать их количество и какие практики и инструменты в этом нам помогут.
  35. Узнаем как писать код так, чтобы потом процессору и браузеру не было мучительно больно при запуске вашей программы.
  36. Познакомимся с ReactJS, научимся писать простые компоненты и сравним его с другими популярными фреймворками. Знакомимся с концепцией Virtual DOM.
  37. Узнаем какие действия нам нужно произвести, чтобы не просто писать на React, но и делать это максимально эффективно и удобно.
  38. Более подробно знакомимся с JSX, ReactComponent, ReactDOM.render, Render function. Настраиваем и запускаем первое приложение, устанавливаем взаимосвязи между компонентами и обрабатываем события.
  39. Что такое роутинг; Знакомимся с ReactRouter и его функциональностью; организуем роутинг в нашем приложении.

Другие курсы по этой теме

Помогите нам улучшить наш сервис, поделитесь своим опытом, пройдя небольшой опрос. Он займет у вас не больше 5 минут.
Пройти опрос