Пятая часть еженедельной серии, в которой рассказывается о моем опыте в Lambda School.
Я хочу извиниться за то, что так поздно написал этот отчет о моей неделе. В Лямбда-школе и за ее пределами происходило много интересного.
Давайте углубимся в то, что моя когорта узнала на этой неделе. Звездой этой недели стал Redux. Помните, на неделе 4 мы узнали о компонентах React и о том, как компоненты класса обрабатывают состояние. Если каждый компонент отслеживает применимые изменения состояния, это может сойти с ума! Хотя это выполнимо, чем больше ваше веб-приложение, тем больше состояний компонентов вам нужно управлять.
Что такое Redux?
Самое простое определение Redux - это то, что он поддерживает состояние всего приложения. Хотя Redux тесно связан с React, его можно использовать с любой интерфейсной структурой. Как сказано в документации, Redux построен на трех принципах.
3 основных принципа Redux
- Единый источник истины: состояние всего вашего приложения хранится в дереве объектов в едином хранилище.
- Состояние доступно только для чтения: единственный способ изменить состояние - вызвать действие, объект, описывающий, что произошло.
- Изменения вносятся с помощью чистых функций: чтобы указать, как дерево состояний преобразуется действиями, вы пишете чистые редукторы.
Изучите Redux:
Redux позволяет безболезненно отслеживать состояние различных компонентов. Если вы только начинаете знакомиться с Redux, вы не ошибетесь, ознакомившись со следующими ресурсами:
- Redux Docs: официальная документация Redux.
- Начало работы с Redux: отличный видеоурок, созданный автором Redux.
- Создание приложений React с идиоматическим Redux: продолжение видео, созданное автором Redux Дэном Абрамовым.
- Redux · Введение: отличный пост, написанный Алексом Бачуком.
- Объяснение React-redux connect: отличный пост, объясняющий React-Redux от Soham Kamani.
Что вы узнали на этой неделе?
На этой неделе был почти полностью посвящен Redux и тому, как интегрировать его с React. Вот разбивка нашей недели:
Redux в том числе:
- React-Redux
- штат
- редукторы
- контейнеры / интеллектуальные компоненты
- соединять
- действия
- создатели действий
- localStorage
- mapStateToProps
- mapDispatchToProps
- функциональный дизайн приложения
Вопросы и Ответы
На этой неделе основные вопросы, связанные с повседневной жизнью в Lambda School.
Какие задания вы выполняете в Lambda?
На этой неделе мы повторно рассмотрели тип проекта, с которым многие из вас знакомы:
Приложение Todo: к нашему приложению предъявлялись следующие требования:
- Должен включать Redux
- В вашем приложении должно быть поле ввода, кнопка отправки и список элементов, представляющий ваш список дел.
- В дереве состояний вашего приложения должно быть одно свойство, называемое todos.
ДОПОЛНИТЕЛЬНЫЙ КРЕДИТ:
- Реализовать возможность удаления элементов списка дел. Вы можете создать кнопку рядом с каждым элементом списка задач, и когда она будет нажата, она вызовет создателя действия, который отправит действие, которое удаляет указанный элемент списка задач из массива задач.
- Используйте localStorage, чтобы данные сохранялись.
Обычно приложения Todo - это второе, чем занимается разработчик после Hello World. У меня отношения любви / ненависти к приложениям Todo. Они быстро надоедают, но позволяют создать что-то простое, внедряя фреймворк или библиотеку, которую вы изучаете.
Надеюсь, вам понравился мой пост, и я хочу поблагодарить вас за то, что поделились моим путешествием. Далее я перейду на 6-ю неделю и изучу HTTP, маршрутизацию SPA и NODE / Express! Не могу дождаться, чтобы рассказать вам все об этом!
Если у вас есть какие-либо вопросы о Lambda School, моем опыте там или любой из тем, которые я освещаю, пожалуйста, свяжитесь со мной. Я люблю помогать.