МЕНТОРСТВО
REACT 2021
REACT 2021
Изучи библиотеку ReactJS в течение месяца
без сложных терминов и запутанных объяснений.
без сложных терминов и запутанных объяснений.
- Более 75 уроков и тестов по ReactJS
- Проверка домашних работ
- 5 проектов в портфолио
- Доступ к закрытому чату с наставниками
- Уникальный личный кабинет
Программа занятий
8 модулей и на каждый выделяется
по 10-15 уроков, которые ты будешь проходить поэтапно, сдавая тесты и домашние задания
по 10-15 уроков, которые ты будешь проходить поэтапно, сдавая тесты и домашние задания
1. Базовая информация
О чем блок:
В этом блоке я тебе расскажу только самое главное, чтобы ты быстрей понял ReactJS без кучи сложных тем
Уроки:
В этом блоке я тебе расскажу только самое главное, чтобы ты быстрей понял ReactJS без кучи сложных тем
Уроки:
- Что такое ReactJS и для чего его используют?
- Что такое компоненты и зачем они нужны?
- Что такое JSX и чем отличается от HTML?
- Как передавать данные в компонент?
- Стилизация элементов
- Разница между функциональным и классовым компонентом
- Что такое children?
- Создаем первое приложение на ReactJS
- Создать классовый и функциональный компонент
- Как определить клик по кнопке или изменение инпута
- Создать форму авторизации
- Превращаем массив объектов в React-компоненты
- Что такое state? Чем state отличается от props? let
- Что за VirtualDOM?
2. Хранение данных, списки, хуки
О чем блок:
Разберёмся с тем, что такое хуки, как рендерить список React-элементов, контекст и что такое "жизнненный цикл" в ReactJS
Уроки:
Разберёмся с тем, что такое хуки, как рендерить список React-элементов, контекст и что такое "жизнненный цикл" в ReactJS
Уроки:
- Что такое хуки и зачем они нужны?
- Условный рендеринг
- Контролируемый и неконтролируемый компонент / useState
- Создать счетчик
- Подъем состояния
- Зачем нужен key при рендере списка и почему он важен?
- Создать приложение генерации случайных чисел
- Жизненный цикл компонента (lifecycle) / useEffect
- Что такое контекст и какую задачу он решает?
- Избавляемся от "props drilling" использую контекст
3. Стилизация
О чем блок:
В этом блоке расскажу, как стилизировать компоненты с помощью CSS, Inliny styles, SCSS. Расскажу про подход CSS Modules и как стилизировать приложение с помощью Material UI
Уроки:
В этом блоке расскажу, как стилизировать компоненты с помощью CSS, Inliny styles, SCSS. Расскажу про подход CSS Modules и как стилизировать приложение с помощью Material UI
Уроки:
- Используем обычный CSS для стилизации
- Подключаем SCSS препроцессор
- Используем подход CSS Modules
- Какие есть UI-библиотеки для ReactJS?
- Изучите библиотеку компонентов Material UI и создайте простую форму
- Бонус: стилизация с помощью styled-components
4. Навигация
О чем блок:
Изучим библиотеку React Router для разработки навигации на сайте. Создадим защищённую страницу. Изучим хуки React Router
Уроки:
Изучим библиотеку React Router для разработки навигации на сайте. Создадим защищённую страницу. Изучим хуки React Router
Уроки:
- Создаем страницы для личного сайта
- Сделать вывод полной записи по отдельному пути
- Создаём компонент Route для вывода компонентов по условию
- Узнаем про React Router и подключаем в проект
- Выводим страницу "Ничего не найдено"
- Хуки React Router (useHistory, useParams, useLocation, useRouteMatch)
- Создаем защищённую страницу
5. Работа с формами
О чем блок:
Изучим библиотеку React Hook Form и Yup для разработки форм с валидацией
Уроки:
Изучим библиотеку React Hook Form и Yup для разработки форм с валидацией
Уроки:
- Создаем форму регистрации с помощью Material UI
- Валидируем данные формы вручную
- Вывести ошибки в самой форме под полями
- Узнаем про React Hook Form и подключаем в проект
- Реализовать очистку формы
- Делаем более гибкую валидацию с помощью библиотеки yup
- Разбиваем форму регистрации на несколько шагов
- Используем контекст формы с помощью хука useFormContext
6. Взаимодействие с сервером
О чем блок:
Научимся отправлять и получать данные с сервера. Изучим библиотеку Axios. Поймём как обрабатывать серверные ошибки.
Уроки:
Научимся отправлять и получать данные с сервера. Изучим библиотеку Axios. Поймём как обрабатывать серверные ошибки.
Уроки:
- Вытаскиваем данные с сервера и отображаем в приложении
- Переписать getUsers на async/await
- Отправляем данные из приложения на сервер
- Что такое Axios и чем он лучше fetch?
- Отправляем файл на сервер с помощью Axios
- Обработка ошибок
7. Redux
О чем блок:
Создадим блог используя Redux и хуки React Router. Подключим библиотеку redux-thunk для асинхронных действий в Redux.
Уроки:
Создадим блог используя Redux и хуки React Router. Подключим библиотеку redux-thunk для асинхронных действий в Redux.
Уроки:
- Что предстоит изучить?
- Что такое Redux? Когда он нужен и не нужен?
- Изучим хук useReducer
- Подготавливаем страницы (список статей, просмотр статьи, создание статьи, профиль)
- Подключаем Redux к проекту
- Разрабатываем структуру
- Что такое action, dispatch, reducer, middleware?
- Используем хуки useSelector и useDispatch
- Запрашиваем список статей с сервера
- Делаем регистрацию и авторизацию
- Подключаем библиотеку redux-thunk
- Делаем страницу создания статьи
- Вывод комментариев
- Добавление комментариев
- Удаление и редактирование комментариев
- Итоговая часть + тест
- Деплой проекта
8. Паттерны, лучшие практики
О чем блок:
Создадим блог используя Redux и хуки React Router. Подключим библиотеку redux-thunk для асинхронных действий в Redux.
Уроки:
Создадим блог используя Redux и хуки React Router. Подключим библиотеку redux-thunk для асинхронных действий в Redux.
Уроки:
- Зачем нужны паттерны проектирования и можно ли без них разрабатывать проект?
- Какие бывают паттерны в ReactJS?
- Stateless Component
- Proxy Component
- Style Component
- HOC (High Order Component)
- Container Component
- Layout Component
- Как грамотно разрабатывать архитектуру приложения?
- Кастомный хук
9. Дипломная работа
Какие проекты будут на занятии?
Все эти проекты будут разрабатываться в процессе обучения и выполняться, как домашние задания
Чему я тебя научу?
1
Основам работы с ReactJS
Ты поймёшь как работает самая популярная библиотека для разработки веб-приложений и научишься понимать написанный код на ReactJS
2
Писать грамотный и красивый код на JS и ReactJS
Недостаточно просто уметь писать код, его ещё нужно научиться писать так, чтобы не было стыдно показать другим. На этих занятиях я тебе буду давать подсказки и показывать примеры плохого и хорошего кода.
3
Построение архитектуры и структуры проекта
Очень важный момент при разработке приложений - уметь правильно разработать архитектурную часть приложения и уметь правильно структурировать компоненты, страницы и остальные файлы проекта.
4
Уметь работать с React-хуками и контекстом
Одна из самых мощных функций ReactJS - хуки. Я тебе покажу на реальных примерах, зачем они нужны и как правильно их использовать вместе с React-контекстом.
5
Работать с серверной частью
Я тебе расскажу о том, как отправлять и получать данные с серверной части и отображать в приложении
6
Работать с данными, обрабатывать формы и делать многостраничное приложение
Любое современное приложение должно уметь правильно хранить данные и обрабатывать формы. На этих занятиях ты научишься работать с Redux, React Router и React Hook Form.
7
Работать с доп. инструментами
Кроме написания кода, нужно ешё уметь работать с дополнительными инструментами, как React DevTools и Redux DevTools, которые помогут дебажить твое приложение
8
И это не всё...
Кто преподаватель?
Меня зовут Арчаков Дэннис, я фуллстэк-разработчик со стажем более 6 лет коммерческого опыта.
На данный момент работаю как тимлид в дубайском стартапе, где руковожу командой из 5 человек (фронтенд, бэкенд). Наш проект успешно запущен с нуля в продакшн и уже приносит доход.
Ранее работал фронтенд-разработчиком над главным сайтом Эльдорадо.
Веду личный YouTube-канал с аудиторией более 40.000+ человек, где обучаю людей фронтенду и бэкенду, некоторые из которых благодаря моим бесплатным курсам смогли успешно найти работу фронтенд-разработчиком.
Программированием увлекаюсь с 7 класса. Работал как разработчиком ПО для десктопа и мобильных устройств, так и веб-сайтов на ReactJS и Angular.
На данный момент работаю как тимлид в дубайском стартапе, где руковожу командой из 5 человек (фронтенд, бэкенд). Наш проект успешно запущен с нуля в продакшн и уже приносит доход.
Ранее работал фронтенд-разработчиком над главным сайтом Эльдорадо.
Веду личный YouTube-канал с аудиторией более 40.000+ человек, где обучаю людей фронтенду и бэкенду, некоторые из которых благодаря моим бесплатным курсам смогли успешно найти работу фронтенд-разработчиком.
Программированием увлекаюсь с 7 класса. Работал как разработчиком ПО для десктопа и мобильных устройств, так и веб-сайтов на ReactJS и Angular.
Арчаков Дэннис
Преподаватель
Что необходимо знать для обучения?
Без этих знаний на изучать ReactJS будет сложно
1
Из JavaScript нужно уметь/понимать:
- Работать с массивами и их методами
- Что такое объекты, как обращаться через ключи к значениям
- Что такое анонимные функции, стрелочные и именованные
- Работу с DOM-элементами
- Работать с событиями в JS: onclick, onkeyup, onchange и т.п.
- Знать разницу между const/let/var
- Знать условия: тернарный оператор, if else, &&
- Что такое класс в JavaScript
2
HTML/CSS:
Уметь верстать на самом базовом уровне. Достаточно даже поверхностное знание HTML и CSS
3
Уметь работать с Git
Отзывы на канале YouTube
Большое спасибо вам, Арчаков. Благодаря вашим бесплатным курсам, я набрался большого опыта в сфере React. Вы отлично объясняете курс, понятным для новичков языком. Огромное вам спасибо!
Маки Макиев
подписчик, ссылка
Выражаю большую благодарность. Я смог сделать реакт пиццу, и одновременно с этим изучал все библиотеки которые там были. Это дало сильный толчок моим навыкам и я смог устроится на работу ) Спасибо за то, что ты делаешь!
Юрий Криминский
подписчик, ссылка
Спасибо за уроки. Самому лень изучать доки, вот и смотрю твои уроки. Покупал платные уроки по Несту, но среди всех видеоуроков у тебя самые понятные и разжеванные уроки для новичков
Бектур Муратов
подписчик, ссылка
От души благодарю за твои видосы. Только благодаря этому туториалу я тестовое задание в сроки написал. С первой же зарплаты подпишусь на патреон.
Антон Третьяков
подписчик, ссылка
И ещё несколько отзывов от учеников и подписчиков,
вместо тысячу слов
вместо тысячу слов
Научу составлять продаваемое резюме
Антон Редин
Фронтенд-разработчик, ReactJS
Frontend:
- ReactJS
- Redux
- React Hook Form
- React Router
- Axios
- Prettier
- SCSS / CSS Modules / styled-components
- Material UI, Semantic UI, Ant Design, React Bootstrap
Другие скиллы:
- Git
- GitHub
- Create React App
- Yarn, NPM
- MockAPI
Как будет проходить обучение?
1
Оплата занятий
После того, как ты произведёшь оплату, тебе предоставляется доступ к личному кабинету
2
Доступ к кабинету
У тебя будет свой личный кабинет со статистикой пройденных уроков, тестов и выполненных домашних работ
3
Поэтапное обучение
В каждом блоке есть по 10-15 уроков.
Доступ к урокам открывается поэтапно по мере прохождения информации.
Доступ к урокам открывается поэтапно по мере прохождения информации.
4
Видео и текстовая информация
Практически в каждом уроке будет содержаться видео урок и подробное текстовое описание, где будут приложены все необходимые материалы для изучения урока
5
Не понятно?
Задавай вопросы
Задавай вопросы
У каждой группы есть свой закрытый чат
со мной (преподавателем) и наставниками, где ты в удобное для нас время сможешь задавать вопросы по нашим занятиям.
со мной (преподавателем) и наставниками, где ты в удобное для нас время сможешь задавать вопросы по нашим занятиям.
6
Домашние задания и тесты
В конце каждого урока есть тест, который тебе будет необходимо пройти для подтверждения изученной информации. После каждого 3-4 урока будет даваться домашнее задание.
7
Дипломная работа
После того, как ты пройдёшь все уроки, выдается дипломная работа. Выполним её ты сможешь подтвердить,
что ты успешно освоил всю информацию,
которую я для тебя подготовил
что ты успешно освоил всю информацию,
которую я для тебя подготовил
Чего нет в этом курсе? ❌
Если ты будешь записываться ко мне на занятия, то тебе стоит заранее знать следующую информацию
Трудоустройства
Я не занимаюсь дальнейшим трудоустройством и помощью в поиске работы. Я даю тебе фундаментальные знания библиотеки ReactJS и некоторых других технологий.
Сертификатов
Я не даю никаких сертификатов и считаю это полным "дном". Ни один работодатель не интересуется тем, окончил ты курс в каком-нибудь GeekBrains или нет.
Оценивают твои знания, которые ты получишь на занятиях. К сожалению, сертификаты никак тебя не спасут на собеседованииях
Оценивают твои знания, которые ты получишь на занятиях. К сожалению, сертификаты никак тебя не спасут на собеседованииях
Бесконечная поддержка
После завершения курса, я не занимаюсь дальнейшей платной или бесплатной поддержкой или индивидуальным менторством. Целый месяц я буду помогать тебе изучать ReactJS в ЛС или в общем чате.
После полного прохождения курса и успешного выполнения дипломной работы (по желанию), наше обучение и моё менторство завершается.
Однако, доступ к чату у тебя остается навсегда.
После полного прохождения курса и успешного выполнения дипломной работы (по желанию), наше обучение и моё менторство завершается.
Однако, доступ к чату у тебя остается навсегда.
Мгновенного ответа
Я не смогу ответить мгновенно, как только ты задашь вопрос или присылаешь домашнее задание.
Свободней всего я бываю ближе к вечеру. Если я не смогу ответить, в чате будет присутствовать наставник, которому ты тоже сможешь задавать вопросы.
Примерно с 10:00 — 17:00 я чаще всего занят работой и не всегда смогу дать ответ сразу же.
Ты можешь написать мне в любое время, в рабочее время или даже в 3 ночи. Отвечу я тебе в этот же день гарантированно, но только тогда, когда буду свободен.
Без ответа ты точно не останешься :)
Свободней всего я бываю ближе к вечеру. Если я не смогу ответить, в чате будет присутствовать наставник, которому ты тоже сможешь задавать вопросы.
Примерно с 10:00 — 17:00 я чаще всего занят работой и не всегда смогу дать ответ сразу же.
Ты можешь написать мне в любое время, в рабочее время или даже в 3 ночи. Отвечу я тебе в этот же день гарантированно, но только тогда, когда буду свободен.
Без ответа ты точно не останешься :)
Тарифы
Большая часть материалов уже доступна для изучения, в том числе и домашние работы.
Курс находится на стадии доработки, но уже сейчас вы можете проходить 90% всех материалов!
Самостоятельный
Оптимальный
Стандартный
Максимальный
(недоступно)
(недоступно)
Доступ к уникальному личному кабинету
Доступ ко всем текстовым и видео урокам в HD
+70 уроков и тестов по ReactJS
Купить в рассрочку
Количество проектов
5 проекта
(без код-ревью)
(без код-ревью)
5 проекта
5 проектов
7 проектов
Общий чат со всеми участниками
Проверка домашних работ
Доступ к закрытому чату с преподавателем и наставниками
Дипломная работа
Бонусный блок "Резюме"
Еженедельные мастер-классы по разработке уникальных React-проектов
Бонусный блок "TypeScript" + "Продвинутый React"
Проведение собеседования по окончанию курса
Личный созвон с преподавателем
(за все время обучения)
(за все время обучения)
3 часа
Безгранично
Доступ к занятиями
2 месяца
5 месяца
1 год
Навсегда
Цена
(возможность рассрочки)
(возможность рассрочки)
8 900 руб.
13 900 руб.
22 000 руб.
65 000 руб.
