ДАТА:
16.01.24 — 04.06.24
ДЛИТЕЛЬНОСТЬ:
41 занятие
[каждый вторник и каждый четверг]
Frontend Developer – профессия, сочетающая дизайн и программирование. Разработчики внешних интерфейсов пишут код и воплощают аспекты UI/UX, чтобы сайты и приложения были функциональными и эстетически привлекательными.
![](/ckeditor/landings/frontend-razrobka-r/5ros.png)
-
Курс учитывает современные потребности рынка и скилы, которые повышают шанс на получение оффера — от верстки интерфейсов на HTML/CSS до написания кода на JavaScript и повышения производительности с помощью ReactJS и Next.js.
ЛЕКТОР:
![](https://robot-site-static.fra1.digitaloceanspaces.com/cc/ckeditor/landings/frontend-razrobka-r/opt/picture9761-15-min-min.jpg)
АНДРЕЙ
РЫМАРУК
- Senior JavaScript Frontend Developer в Welltech, ех-JavaScript Software Engineer в Ciklum
- Начинал свой путь в IT как Freelance Web Designer и дошел до позиции Senior Frontend Developer в Welltech — компании, создавшей приложение из 200+ миллионов загрузок
- Занимался разработкой B2B-систем в сегментах Auto Motive и Air Transportation
- Успешно сдал сертификационный экзамен CIW JavaScript Specialist и подтвердил уровень Senior
- В качестве профессионального хобби занимается изучением AWS, Google Cloud, Python и Go
ПРОГРАММА
-
01
1 занятие Запись
Frontend/HTML/CSS/JS/GIT
- Сможете понимать роль и функции Frontend-разработчика
- Рассмотрите технологии и языки — HTML / CSS / JavaScript
- Ознакомитесь с инструментами разработки — IDE, DevTools
- Узнаете, что такое система контроля версий Git
-
02
2 занятие 1,5 часа
Введение. Основы Web-разработки
- Узнаете основные принципы работы веб-браузеров
- Поймете значение кроссбраузерности и основные отличия в интерпретации ими
- Будете различать задачи веб-разработчика, связанные с работой в клиентской части веб-приложений
- Сможете понимать принцип работы с системой контроля версий Git
- Создадите актуальный аккаунт на GitHub и репозиторий для работы с курсом
-
03
3–4 занятия 3 часа
Язык разметки HTML
- Создадите структуру HTML документа, включая заголовок, тело, разделы, абзацы, списки и формы
- Используете семантическую разметку
- Используйте различные теги и атрибуты для форматирования текста, создания ссылок, вставки изображений и других элементов
-
04
5–6 занятия 3 часа
Основы разработки JavaScript
- Изучите основы JS, научитесь работать с function, callbacks, prototype, а также с глобальными объектами document, window, navigator
- Узнаете, что такое HTML5 API и доступные его разновидности
- Научитесь применять каждый из предложенных API
-
05
7–9 занятия 4,5 часа
Работа с CSS
- Знаете разные типы отображения, методов позиционирования
- Работаете с текстом, цветом, фоном и технологией Flexbox
-
06
10–11 занятия 4,5 часа
Анатомия веб-приложений. Основы принципов UI/UX
- Создаете макеты со статической или адаптивной сеткой (layout anatomy)
- Ориентируетесь в принципах UI/UX-дизайна
- Проектируете удобную для восприятия разметку веб-приложения (сайта)
-
07
12–13 занятия 3 часа
Работа с SASS (SCSS) препроцессором
- Используете пакетный менеджер yarn для установки пакетных зависимостей, дополнительных библиотек, модулей
- Подключаете SASS-препроцессор к проекту, используете переменные, миксины, циклы и другие функциональности SCSS
-
08
14–15 занятия 3 часа
Введение в разработку на JavaScript
- Используете структуру кода, переменные, типы данных
- Осуществляете логические сравнения и принимаете решения на основе результатов этих сравнений
- Выполняете операции или обработку данных на основе определенных условий
- Имеете знания по созданию функции, а также функции, которые могут быть приостановлены и восстановлены во время выполнения
- Знаете, как использовать обработчики событий (event handlers)
-
09
16 занятие 1,5 часа
Углубление в разработку JavaScript: структуры данных
- Работаете с разными типами структур данных, такими как массивы (Array), объекты (Object)
- Создаете многоуровневые структуры данных, например, массивы объектов или объекты, содержащие другие объекты
- Используете объекты Set, Map и Object для сохранения и обработки данных
- Манипулируете с массивами, используя методы, такие как push, pop, shift, unshift, splice
- Используете объект Reflect для выполнения различных операций, таких как создание новых объектов, вызов методов, получение и установка свойств
-
10
17 занятие 1,5 часа
Углубление в разработку JavaScript: работа с сетью
- Разрабатываете базовое RESTful API, используя различные HTTP методы, такие как GET, POST, PUT, DELETE
- Знаете, какие URL-шаблоны используются для маршрутизации запросов
- Используете Fetch API для отправки HTTP запросов с клиентской стороны веб-приложения
- Работаете с Promise для управления асинхронным кодом
- Используете async-await для удобного написания асинхронного кода
- Отлаживаете сетевые запросы с помощью DevTools
-
11
18 занятие 1,5 часа
ООП программирование
- Понимаете основные концепции ООП, таких как классы, объекты, наследования, полиморфизм, инкапсуляция
- Используете каждую концепцию на практике
-
12
19 занятие 1,5 часа
Паттерны проектирования
- Знаете основные паттерны проектирования, которые помогают разрабатывать эффективный и поддерживаемый код
- Понимаете значение паттернов в проектировании веб-приложений
-
13
20 занятие 1,5 часа
Принципы программирования
- Ознакомитесь с принципами программирования
- Имеете достаточно знаний, чтобы писать чистый и понятный код
- Знаете, как не допустить повторений в своем коде, чтобы сэкономить время и ресурсы на разработку
-
14
21 занятие 1,5 часа
Методы генерации веб-страниц
- Различаете типы веб-рендеринга
- Знаете, в каких случаях лучше применять тот или иной тип
-
15
22 занятие 1,5 часа
Основы разработки на ReactJS
- Понимаете структуру React-приложения и его основных компонентов
- Работаете с JSX (расширение синтаксиса JavaScript) для описания пользовательского интерфейса
-
16
23–24 занятия 3 часа
Углубление в разработку на ReactJS
- Понимаете работу с хуками, четко различаете их типы по назначению
- Имеете навыки в создании Custom Hooks
- Умеете работать с React Router
-
17
25 занятие 1,5 часа
Разработка на ReactJS. Знакомство с библиотекой Redux
- Понимаете глобальный и локальный контекст в ReactJS
- Имеете знания о библиотеке Redux и ее использовании для управления состоянием приложения
-
18
26–27 занятия 3 часа
UI/UX фреймворки
- Работаете с Bootstrap и Tailwind CSS, используете их в разработке веб-интерфейсов
-
19
28–30 занятия 4,5 часа
Разработка JavaScript: создание веб-приложения
- Имеете практические навыки и рекомендации по разработке SPA-приложения на уровне реального веб-приложения с использованием ReactJS
- Применяете SCSS и фреймворк Tailwind (или Bootstrap)
- Используете CSR (Client-Side Rendering)
- Разработаете полноценный single-page application с управлением состояния и использованием CSS Framework
-
20
31–32 занятия 3 часа
Обзор JavaScript Server-Side. Знакомство с фреймворком Next.js
- Понимаете принципы серверного рендеринга и возможностей Next.js для построения универсальных веб-приложений
- Отличаете особенности Data Fetching: getServerSideProps, getStaticProps, getStaticPaths. Знаете, для чего и когда использовать каждый из них
- Знаете роутинг Next.js
- Описываете внутреннее API для возврата JSON-данных с сервера
- Имеете навыки в оптимизированном использовании картинок на уровне SSR с Next.js
- Умеете работать с Lazy Loading, кэшированием
-
21
33–35 занятия 4,5 часа
JavaScript Server-Side. Практика на Next.js
- Работаете с server-side application с использованием Next.js
- Подключаете фреймворки для стилизации по типу Tailwind, а также проводите настройки кастомных тем
- Разберетесь с маршрутизатором на практике, а также кэшированием на уровне фреймворка
- Имеете практические навыки использования SSR, CSR
-
22
36 занятие 1,5 часа
Vercel. Публикация готового проекта
- Создадите git-репозиторий с подключением к системе деплоймента
- Настроите деплоймент репозитория с веб-приложением на уровне Vercel
- Получите навыки применения изменений через Pull Request в GitHub
-
23
37 занятие 1,5 часа
Подведение итогов / Часто задаваемые вопросы на техническом собеседовании
Регистрация