Materials of the talk "Lets Kill Lifecycle"
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
public
src
.gitignore
README.md
package.json
yarn.lock

README.md

Репозиторий с материалами доклада "LET'S KILL LIFECYCLE"

Материалы

OdessaJS 2018

Слайды

Video

FrontTalks 2018

Слайды

Video

#ITsubbotnik: technological mix 2018 Moscow

Слайды

Video с is coming soon...

#ITsubbotnik: technological mix 2018 Izhevsk

Тут я про hook'и чуть-чуть зацепил

Слайды

Video с is coming soon...

🔥JSNN #11🔥

Слайды

Video

Что в репозитории

С помощью Redux Form реализована простая формочка с 5-ю полями. Дополнительные требования:

  1. Email должен заполняться автоматически по имени. Но при условии, что пользователь сам его не вводил.
  2. При переключении типа пользователя (сотрудник или нет) мы должны поменять тип телефона. Но введённый до этого телефон должен где запомниться, а поле очиститься. При переключении обратно, мы должны восстановить ранее введенный телефон.
  3. Должно проверяться по фамилии, не является ли клиент VIP. Обычно для этого ходят на сервер. Но для примера, просто происходит асинхронная проверка, что количество букв в фамилии делиться на 3.

Это сделано несколькими способами:

  1. React Lifecycle. Ветка lifecycle. Просто посмотрите, как там все плохо.
  2. Redux-Saga. Ветка saga.
  3. redux-observable. Ветка redux-observable.
  4. react-redux-rxjs. Ветка react-redux-rxjs. Не очень популярная, но очень классная библиотека.
  5. HOCs. Ветка hocs. Решение, которое мы используем в проде.
  6. Hooks. Ветка hooks. Свежее (на ноябрь 2018) решение от команды React.

Ссылки

  • Tver.IO - Сообщество Тверских айтишников. You are welcome :)
  • Пост об изменении lifecycle в React 17.
  • Пост об неправильном использовании getDerivedStateFromProps.
  • Видео с Talk from React Amsterdam Conference 2017 и статья на Hackernoon от Michel Weststrate (создателя MobX), о разделении представления и логики.
  • Redux Middleware.
  • RxJS 6.
  • Развернутый ответ на stackoverflow, в чем отличие redux-observable и redux-saga.
  • HOC - паттерн Higher Order Component.
  • Выступление Тимофея Ткаченко "componentDidMount не нужен". Еще один способ избавиться от lifecycle