Фронтенд разработка (DOM + React + Redux)

Самый популярный стек для современной разработки. Огромное количество практики. Погружение в MVC и архитектуру толстых клиентов.

Курс

JS: DOM API

PRO

DOM является основой фронтенд разработки. Работа с любыми фреймворками и библиотеками начинается с понимания этой темы. Основные темы, которые будут рассмотрены в данном курсе: * Манипуляции DOM деревом * BOM * Полифиллы * Инструменты разработчика в браузерах * AJAX * Jquery

Курс

JS: Архитектура фронтенда

PRO

Несмотря на обилие различных фреймворков и способов разработки фронтенд приложений, существуют фундаментальные принципы, которые используются повсеместно и практически не меняются. Они касаются разбиения приложения на слои (например, MVC), выделения состояния и его организации, работы с текстами, контроля данных форм. Этот курс рассказывает о том, как строить архитектуру приложения без привязки к конкретным решениям и их особенностям.

Курс

JS: React

PRO

React — библиотека, которая перевернула наши представления о том, как разрабатывать фронтенд. В этом курсе мы затронем все аспекты его работы и шаг за шагом, начиная с простых компонентов, дойдем до взаимодействия с бэкендом и интеграции с кодом, написанном без его использования (на jQuery).

Курс

JS: Redux (React)

PRO

Redux — это официальный способ управлять состоянием в нетривиальных React приложениях. Несмотря на свою простоту и элегантность, он требует время на вникание. Кроме того, вокруг Redux огромная экосистема библиотек, автоматизирующих разные задачи. Этот курс посвящен в том числе самым популярным библиотекам.

Испытания

JS: DOM API
Модальное окно
application.js Реализуйте и экспортируйте по умолчанию...
JS: DOM API
Пятнашки
Модификация игры в пятнашки, в которой управление осуще...
JS: DOM API
Прогресс
src/application.js Реализуйте и экспортируйте по умолч...
JS: React
Не трогай меня
Buttons.jsx Реализуйте и экспортируйте по умолчанию ком...
JS: React
Модальные окна
App.jsx Реализуйте и экспортируйте по умолчанию компоне...

Впечатления

Задачка просто огонь!) Решил меньше, чем за час и почти как учителя. Правда, код учителя лучше в "технологическом плане". Про обновление координат пустой клетки что то не подумал. В моем коде пустая клетка ищется при каждом клике.

Не придумал как по-простому определять, что цель события находится рядом с пустой ячейкой. Пришлось городить огород. В решении учителя определение соседней ячейки просто космос.

Хорошее задание, встряхнул мозги наконец-то! У меня слишком подробная декомпозиция получилась, но я получил удовлетворение. )) https://ru.hexlet.io/code_reviews/48670

Пару часов и готово! Решение учителя великолепное! У меня 16 строк кода у учителя 4! 0 :1 в пользу учителя! :))

Спасибо за такие задачи! Очень сильно заставляет поработать с знаниями из всего курса, что очень важно при обучении.