Главная Каталог курсов Программирование JavaScript-фреймворк React.js
Новогодняя распродажа Скидка 45% действует 0 дней 00:00:00
Курс

JavaScript-фреймворк React.js

Вы изучите React.js — фреймворк языка программирования JavaScript. Научитесь писать приложения, работать с архитектурными подходами Flux, Redux, Mobx. Вырастите как профессионал.

О профессии

На рынке не хватает JavaScript-разработчиков

Курс подходит для

  • JavaScript-разработчиков

    Научитесь взаимодействовать с фреймворком React.js. Узнаете, как разработать клиентскую часть приложения, будете применять протоколы HTML, CSS и Ajax-запросы. Поймёте, как верстать карточки постов, используя для этого ReactPortal, реализовывать механизм click outside, необходимый для скрытия модального окна.

  • Frontend-программистов

    Изучите оптимизацию приложений и сможете заставить фреймворк приносить максимум эффекта. Разберётесь, как подключать CSS-модули, создавать компоненты dropdown. Научитесь применять серверный и статический рендеринг и деплоить приложения с помощью программы Zeit.

Чему вы научитесь

  • Работа с API

    Узнаете, что такое API и для чего они нужны, как применять механизмы OAuth.

  • Работа с архитектурными подходами

    Откроете для себя архитектурные подходы Flux, Redux, Mobx, будете применять их для написания последовательных приложений.

  • Тестирование приложений

    Сможете применять базы данных Jest и Enzyme для проверки работоспособности софта.

  • Создание SPA и RIA приложений

    Разберётесь, как создавать одностраничные приложения и приложения, которые загружаются через интернет.

  • Создание сайдбара

    Узнаете, как создавать сайдбар в SPA и React и работать с асинхронными запросами.

  • React Context

    Научитесь забирать данные пользователей из API.

  • Создание списков

    Поймёте, как создавать «‎бесконечные» списки на примере лены постов.

Как проходит обучение на платформе

  • Иллюстрация этапа обучения
    Регистрация

    Знакомитесь с платформой

    Платформа Skillbox — собственная разработка компании Skillbox, платформа постоянно улучшается. Вас ждут видео, практические задания и общение с кураторами Доступ к материалам откроется сразу после покупки курса

  • Иллюстрация этапа обучения
    Теория

    Получаете знания

    Курсы состоят из тематических видео разной длительности Смотрите их когда и где угодно Доступ бессрочный, чтобы вы всегда могли вернуться и повторить теорию

  • Иллюстрация этапа обучения
    Практика

    Выполняете задания

    В Skillbox уверены, что навыки отрабатываются только через практику. Поэтому после теории вас ждёт практическая работа или тест Все задачи приближены к реальным — их можно с гордостью положить в портфолио

  • Иллюстрация этапа обучения
    Обратная связь

    Работаете с куратором

    Проверкой заданий занимаются кураторы Это эксперты по теме курса Они помогут с трудными задачами и подскажут, как улучшить ваши проекты Общаться с проверяющими кураторами можно прямо на платформе

Содержание курса

Вас ждут 2 месяца теории и практики, которые добавят вам реальных знаний в разработке на JavaScript.

  • 2 месяца обучения
  • 16 тематических модулей

  1. Введение в React

      1. Что такое React. Основные преимущества.
      2. Основы декларативного подхода.
      3. Возможности React, компоненты, состояние, применения.
      4. Экосистема React, основные библиотеки, из чего обычно состоит React-стек.

  2. Создание проекта

      1. Конфигурация webpack на клиенте.
      2. Конфигурация webpack на сервере.
      3. Подключение к проекту HMR и SSR.
      4. Подключение TypeScript.
      5. Подключение CSS modules, Jest, Enzyme.

  3. Typescript

      1. Основы TypeScript. Типы.
      2. Работа с массивами.
      3. Работа с объектами и интерфейсами.
      4. Типизация функций и типы TS.
      5. Generics.
      6. Классы.
      7. Infer, typeof, keyof, Mapped Types.

  4. Компоненты на примере новостной карточки Reddit

      1. Компоненты в React.
      2. Состояния в Class Components.
      3. Состояния в Functional Components.
      4. Создание Layout приложения. Часть 1.
      5. Создание Layout приложения. Часть 2.
      6. Создание компонента новостной карточки.
      7. Жизненный цикл компонента.

  5. Hooks и функциональное программирование

      1. Каррирование и функции высшего порядка.
      2. Hooks в React.
      3. Map и Reduce в React.
      4. Создание компонента dropdown c использованием hooks.
      5. Compose, Pipe и их применение в React.

  6. Компоненты - продвинутые темы. Введение в тестирование компонентов

      1. Адаптивные и неадаптивные компоненты. Mobile first и desktop first подходы.
      2. Создание Dropdown-меню с использованием state.
      3. Введение в unit-тесты и Jest.
      4. Написание тестов для React компонента. Enzyme vs Snapshots.
      5. Вспомогательные компоненты.

  7. Работа с публичным API на примере Reddit

      1. Как работать с API.
      2. Регистрируем аккаунт разработчика на Reddit.
      3. OAuth 2.0.
      4. Страница авторизации пользователя.
      5. Как структурировать API-запросы в приложении.

  8. React Context

      1. Забираем из API данные пользователя.
      2. Отображаем данные пользователя в компоненте через prop.
      3. Используем React Context для работы с данными.
      4. Обновляем данные через контекст.

  9. Портал и форма

      1. Верстаем карточку поста, используя ReactPortal.
      2. Ref и useRef React hook. Реализуем механизм click outside для скрытия модального окна.
      3. Controlled и uncontrolled компоненты на примере поля комментария.
      4. Сохраняем состояние формы, используя контекст.

  10. Введение в Redux на примере поля для ввода комментария

      1. Введение в Redux.
      2. Устанавливаем Redux, подключаем его к приложению.
      3. Action + reducer.
      4. Presentation Components/Container Components.

  11. Использование Redux-Thunk на примере загрузки профиля пользователя

      1. Работа с асинхронными запросами в Redux.
      2. Пишем простой logger middleware.
      3. Подключаем thunk к приложению. Пишем свой первый асинхронный action.
      4. Работа с асинхронным состоянием.
      5. Пишем простой loader.

  12. Формы на примере комментариев и карточки поста

      1. Экскурс в формы. Проблематика форм React.
      2. Состояние полей. Различные подходы.
      3. Какие можно использовать библиотеки и почему они могут мешать.
      4. Сохраняем состояние формы, валидируем поля и выводим ошибки.
      5. Доступности, нативные элементы и возможности работать с формой через табуляцию.

  13. «Бесконечные» списки на примере ленты постов

      1. Работа с запросами к API.
      2. Делаем загрузку ленты постов.
      3. Виды бесконечных скроллов и пагинаций.
      4. Делаем подгрузку ленты постов.
      5. Эффективный рендеринг больших списков.

  14. Роутинг

      1. Роутинг в SPA и в React.
      2. Подключаем React Router.
      3. Подключаем новостную ленту к роутеру.
      4. Дополнительный функционал роутинга.

  15. Deploy

      1. Что такое деплой.
      2. SaaS vs PaaS vs IaaS.
      3. Деплой приложения на Heroku.
      4. Готовим проект к продакшну.

  16. Бонус-модуль: Mobx, effector и другие альтернативы redux

      1. Общий обзор и сравнение.
      2. MobX.
      3. Effector.

Спикеры

  • Фотография Александр Кузнецов Александр Кузнецов

    Frontend-разработчик в ТАСС

  • Фотография Ольга Климонова Ольга Климонова

    Ведущий разработчик ТАСС

  • Фотография Алексей Авдеев Алексей Авдеев

    CTO в дизайн-лаборатории Mish. 10 лет в веб-разработке

Отзывы участников

  • Отзывы студентов Иван Медведев, г. Ивантеевка Курс «Профессия Инженер по тестированию»
    Если какой-то материал тяжело даётся, есть вопрос по ДЗ, достаточно написать преподавателю, который поможет разобраться с информацией и подскажет, как решить задачу.
    По итогу 9-месячной учёбы стал по-другому смотреть на сайты. Замечаю баги, разбираюсь в вёрстке, веду репорты. Узнал, как работать со специфическим ПО.
    Уже сейчас нисколько не жалею, что выбрал Skillbox. Спасибо!!!
  • Александр Моль Курс «Профессия Frontend-разработчик PRO»
    Понравилось, что все необходимые знания собраны в грамотном для изучения порядке. Спикеры в видео всё хорошо объясняют на примерах. Есть возможность учиться сразу на практике. К тому же, никто не заставляет проходить курс. Мой прогресс — это моя ответственность и моё желание. Для меня это плюс.

    Жаль, что доступ к курсам даётся на определённый срок. По крайней мере, когда я брал профессию Frontend-разработчика, доступ, по-моему, давался на три года. Для меня это недостаточный срок, чтобы качественно изучить весь материал. Хотя, может быть, проблема во мне.
  • Отзывы студентов Валентина Нарушевич, г. Санкт-Петербург Курс «Графический дизайнер с нуля до PRO»
    Благодаря курсу я научилась создавать классные постеры и векторные изображения. Также мой список новых скилов пополнили ретушь и обтравка изображений — одни из главных навыков профессионального графического дизайнера.
    Ну, и умение верстать журналы! Теперь я, как самый настоящий графический дизайнер, с лёгкостью могу создать разворот какого-нибудь модного журнала.
  • Отзывы студентов Яна Щербицкая, г. Санкт-Петербург Курс «Photoshop с нуля до PRO»
    Курс очень круто структурирован, там есть все знания, которые мне нужны, чтобы освоить программу. Сама бы я точно что-нибудь пропустила.
    Преподаватели всё спокойно и терпеливо объясняют. Если ты что-то не понял, снимут дополнительный видеоролик и покажут ещё раз.
    Самое крутое в курсах Skillbox — постоянная связь с теми, кто подскажет, как правильно.
  • Отзывы студентов Алла Комиссаренко Курс «UX-дизайнер с нуля до PRO»
    Работать дизайнером мне очень нравится, от UX я вообще в восторге, тяга к аналитике у меня была всегда. После долгих поисков работы в новой сфере подруга помогла мне получить заказ на редизайн сайта большой компании.
    Отдельно хочу сказать спасибо куратору Александру Свободе, он очень подробно расписывал все недочёты и ошибки решений в дизайне.
  • Отзывы студентов Елена Кальво, г. Ницца, Франция Курс «Копирайтинг от А до Я 2.0»
    «Почему бы не сделать из хобби источник заработка?» — однажды подумала я.
    Недолго размышляя, записалась на курс в Skillbox и встала в ряд претендентов на гордое звание копирайтера.
    Работа с текстом помогла мне вернуть свою жизнь, вдохновила. Я начала снова ухаживать за собой, читать. Увидела, что я не только мать, но и писатель.

  • Отзывы студентов Ирина Семёнова, г. Бельцы, Молдова Курс «Профессия SMM-специалист»
    Я узнала, что такое охваты, KPI и прочие слова, которые раньше пугали. Поняла, что чем проще и понятнее, тем лучше. Разобралась в сложной иерархии рекламного кабинета и научилась настраивать аудиторию и рекламу.

    Я уже в теме и не боюсь назвать своих более опытных друзей коллегами.
  • Старт курса: 5 декабря
  • Осталось: 7 мест

Стоимость курса

Скидка действует 0 дня 00:00:00

  • 36 706 ₸/мес
  • -45%
20 188 ₸/мес
  • В рассрочку на 6 месяцев
  • 0%∙0₸∙24
  • Бонусный курс
  • Год английского бесплатно

Записаться на курс или получить бесплатную консультацию

Похоже, произошла ошибка. Попробуйте отправить снова или перезагрузите страницу.
Спасибо!

Ваша заявка успешно отправлена

Часто задаваемые вопросы

  • Могу ли я записаться на курс, если только приступил к изучению JS?
    Чтобы пройти этот курс, нужно уметь писать на JavaScript. Чтобы научиться этому, обратите внимание на программу Java-разработчик. Получив базовые знания о языке, вы сможете приступить к изучению React.js.
  • Я смогу совмещать курс с работой? Сколько часов надо уделять занятиям?
    Да, совмещать учебу и работу получится, потому что вы решаете, когда смотреть уроки. В среднем пользователи Skillbox уделяют учебе от трёх до пяти часов в неделю.
  • Пользователям, закончившим курс, помогают с трудоустройством?
    Да, этим занимаются специалисты Центра развития карьеры. Профессионалы подберут подходящие вакансии, помогут написать резюме и оформить портфолио, подскажут, как вести себя на собеседованиях.
  • Как я буду общаться с куратором?
    Куратор будет проверять и комментировать практические работы, давать советы, а на вопросы ответит ментор в Telegram-чате.
  • Не могу оплатить курс сразу. Есть альтернативы?
    Да: рассрочка. Сумму разделят на ежемесячные платежи.
  • Если курс не подойдёт, что делать?
    Вам вернут 50% от уплаченной суммы, при условии, если вы обратитесь за возвратом денежных средств в течение 30 дней с даты предоставления доступа к курсу. По истечении 30 дней с даты предоставления доступа к курсу возврат денежных средств не осуществляется.