Хватит делить на контейнеры и компоненты

+

Хватит делить на контейнеры и компоненты

Мне привычней. Многим работодателям тоже.

Хватит делить на контейнеры и компоненты

а как надо?

А данные из ls напрямую в стейт редакса нормально добавлять таким вот способом? const initialState = localData && localData.client ? {...localData.client} : {};

Ну я немного по-другому делаю, но принцип тот же const emptyState = { username: null, roles: [] } const initialState = { ...emptyState, ...getSavedUserDataFromLS() }

Ну я немного по-другому делаю, но принцип тот же const emptyState = { username: null, roles: [] } const initialState = { ...emptyState, ...getSavedUserDataFromLS() }

Спасибо, а то где не читаю, все пытаются по флагу в редаксе всю авторизацию сделать

emptyState нужен к примеру когда надо сбросить стейт к изначальному состоянию, в данном случае initialState это скорее persisted состояние, а не пустое изначальное

Спасибо, а то где не читаю, все пытаются по флагу в редаксе всю авторизацию сделать

Ну так и надо, у меня там еще флаг isAuthorized, это удобно в использовании

Ну так и надо, у меня там еще флаг isAuthorized, это удобно в использовании

А он от чего зависит?

А он от чего зависит?

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

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

А, ты его в ls кладёшь

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

Флаг isAuth в лс держишь?🤔

Даже если такой флаг не добавлять, его все равно надо выводить через селектор например

А смысл от флага тогда в ls?

Можно в зависимости от наличие юзера выставлять🤔

Можно в зависимости от наличие юзера выставлять🤔

Зачем? Так более очевидно

Всем привет, подскажите по єтому плагину в вебшторме http://i.imgur.com/rlf0ZIH.png

Можно задействовать этот флаг, что бы делать редиректы при logIn, logout, в компоненте брать через useSelector и если флаг поменялся, делать редирект

Зачем? Так более очевидно

При разлогине чистить больше, и если вдруг сессия/токен/что-то еще не валидное, обнулять не забывать надо же 🤔

Зачем? Так более очевидно

Я правильно понял, твоё назначение флага?

Я конечно знаю что есть люди, которые вместо isAuthorized юзают что-нибудь вроде !!user, но я не из таких, я за более очевидное поведение)

нет такого четкого виделения типа как в ВСкоде почему так вот скрин как у меня сейчас( http://i.imgur.com/HKdwoNB.png

А так ток токен/что-то там удалил.

Я конечно знаю что есть люди, которые вместо isAuthorized юзают что-нибудь вроде !!user, но я не из таких, я за более очевидное поведение)

Я так делаю 😂

При разлогине чистить больше, и если вдруг сессия/токен/что-то еще не валидное, обнулять не забывать надо же 🤔

Так в ls он хранится вместе с остальными данными юзера, в виде жсон

Здравствуйте Можно как-то в react-router отловить нажатие кнопки reload и в этом случае открывать домашнюю страницу?

Так в ls он хранится вместе с остальными данными юзера, в виде жсон

А, ну норм 🤔

Так в ls он хранится вместе с остальными данными юзера, в виде жсон

Там прямо собранные данные для подстановки в редакс, очень удобно

Там прямо собранные данные для подстановки в редакс, очень удобно

удобно, но небезопасно

удобно, но небезопасно

В каком плане?

В каком плане?

localStorage доступен любому js на сайте, какой-нибудь зловредный счетчик или xss могут его угнать

localStorage доступен любому js на сайте, какой-нибудь зловредный счетчик или xss могут его угнать

Как я уже говорил, там базовые публичные данные, которые например нужны для отображения статуса авторизации (айдишник, юзернейм, ссылка на аватарку)

А почему бы при открытие страницы первым запросом не получить авторизованного пользователя 🤔

А почему бы при открытие страницы первым запросом не получить авторизованного пользователя 🤔

У юзера на милисекунду мелькнет страница без его данных профиля

Лоадер хд

У юзера на милисекунду мелькнет страница без его данных профиля

Лично я ни на одном сайте без сср не замечал такого, так что сделал вывод что все так делают

Лоадер хд

Можно представить ситуацию, что в правой стороне навбара никнейм, аватарка и кнопка выйти например Ну и лоадер там это как-то))

У юзера на милисекунду мелькнет страница без его данных профиля

та нах сср для профилей?)

Можно представить ситуацию, что в правой стороне навбара никнейм, аватарка и кнопка выйти например Ну и лоадер там это как-то))

Ну, скелетоны) Ну или если вдруг у юзера сессия/токен протух его разлогинет же От кейса зависит 🤔

Плюс когда роли подтянутся, у юзера страница перестроится

Можно представить ситуацию, что в правой стороне навбара никнейм, аватарка и кнопка выйти например Ну и лоадер там это как-то))

я делаю рендер только после того, как данные юзера получены запросом https://github.com/today-/actorsmovies/blob/master/src/index.tsx#L21

я делаю рендер только после того, как данные юзера получены запросом https://github.com/today-/actorsmovies/blob/master/src/index.tsx#L21

Белая страчка, классика)))

Белая страчка, классика)))

она не белая, там статический лоадер прямо в хтмл

она не белая, там статический лоадер прямо в хтмл

Ну лоадер особо не меняет ничего, я короче против такого Какой-то лоадер вместо хотя бы страницы с теми же скелетонами

Просто как бы нет ничего опасного в том, что там юзернейм и аватарка в ls лежат (и роли например), чтобы юзеру было приятно и он не ждал даже 100 мс лишних

А когда новый юзер открывает страницу? Что там?🤔 Белая страница?)

А проверку авторизации, подтягивание остальных данных, можно уже в фоне делать и это будет не видно

Ну в целом норм тема 👍

А когда новый юзер открывает страницу? Что там?🤔 Белая страница?)

Подозреваю что там у него бек возвращает что нет авторизации просто, да и все Лоадер скрывается и юзер видит страницу где он не авторизован

Вот кстати небольшой минус ситуации, когда токен в хттп онли куки, а у тебя нулевая инфа в лс об прошлой авторизации, немного неприятно

В моем случае можно и токен в хттп онли держать, и при этом загрузки лишней не будет потому что хоть малейшая инфа есть

Вот кстати небольшой минус ситуации, когда токен в хттп онли куки, а у тебя нулевая инфа в лс об прошлой авторизации, немного неприятно

Ну получаешь первым запросом юзера и сохраняешь в лс так же)

Привет!Подскажите решение, у меня ничего не получается установить через npm и выбивает ошибки

Стрим живой, готов отвечать на самые провакационные вопросы 🙂

Сегодня в 19:00 на нашем YouTube-канале Артём Арутюнян расскажет, как выполнить миграцию эталонного приложения на Redux, React и хуках на Reatom. Разберём, как сделать это постепенно, и какие преимущества даст эта операция. youtube.com/watch?v=HOnU6tEtW3U

сейчас скину ошибки

сейчас скину ошибки

https://codesandbox.io/s/redux-form-synchronous-validation-d6466?fontsize=14&hidenavigation=1&theme=dark Ребят напишите если кто-то сталкивался с таким на redux-form и получилось поправить. Тест-кейс: ставим фокус на поле username после кликаем на желтую кнопку 'жми' Ожидаем: ошибка валидации + alert('click') По факту: только ошибка валидации

Привет!Подскажите решение, у меня ничего не получается установить через npm и выбивает ошибки

Привет!Подскажите решение, у меня ничего не получается установить через npm и выбивает ошибки

установился же

Привет!Подскажите решение, у меня ничего не получается установить через npm и выбивает ошибки

это нормально для нпм

установился же

но не все пакеты, и всегда так

это нормально для нпм

хорошо, спасибо

Все установилось. Просто есть такое понятие как peer-dependencies. Их автоматом не ставит НПМ. Пир депендеси это когда пакет ожидает что в твоём хост приложении будет эта зависимость установлена. Но это не всегда обязательно.

Все установилось. Просто есть такое понятие как peer-dependencies. Их автоматом не ставит НПМ. Пир депендеси это когда пакет ожидает что в твоём хост приложении будет эта зависимость установлена. Но это не всегда обязательно.

спасибо

добрый вечер. использую хук useState const [attachments, setAttachments] = useState([]); function handleAttachments(event) { let attachmentsList = []; for (let i in event.target.files) { if (event.target.files[i] instanceof File) { attachmentsList.push(URL.createObjectURL(event.target.files[i])); } } setAttachments(attachmentsList); } тут при добавлении файлов в инпут должны заполнятся превью изображений в attachments. но нифига - attachments пустой и не меняется. что я делаю не так? попробовал через useReducer https://pastebin.com/5MiFDdZh attachments обновляются, но компонент не ререндерится. я ничего не понимаю, хочу просто блин заполнять массив превью изображений из файлового инпута и выводить их

разбираюсь в react native. Тут реакт, но мне кажется, то, о чем я хочу спросить, будет в react таким же. Объясните пожалуйте, как работает выражение: const Header =({title}) =>{ } Как я понимаю, создается объект, в который передается анонимная функция, с параметром title, в этой функции происходят какие-то действия. Но мне не понятно, каким образом эта функция связана с объектом Header. Что происходит с этим объектом? Он сам превращается в функцию, с параметром title? И так-же не понятна конструкция <Header title={'Hello'}/> Здесь title это атрибут? Но как это всё устроено? Как параметр функции, объекта Header, становится атрибутом? Объясните пожалуйста.

отвечая на первое — "Header" это не объект, а переменная. Которой присвоили функцию Отвечая на второе — прочитай, что такое JSX и во что он в реальности превращается (jsx "превращается" в валидный js-код)

Сегодня в 19:00 на нашем YouTube-канале Артём Арутюнян расскажет, как выполнить миграцию эталонного приложения на Redux, React и хуках на Reatom. Разберём, как сделать это постепенно, и какие преимущества даст эта операция. youtube.com/watch?v=HOnU6tEtW3U

почему я слышу про эффектор разговоры? Если у тебя конкретная цель показать переезд на твой СТМ?

Чо за хуйня начинается

Народ, объясните почему реакт считает, что getFetchUrl в данном коде меняется постоянно, каждый рендер?

Народ, объясните почему реакт считает, что getFetchUrl в данном коде меняется постоянно, каждый рендер?

Потому что ты его создаешь каждый рендер

Потому что ты его создаешь каждый рендер

Так то да

Народ, объясните почему реакт считает, что getFetchUrl в данном коде меняется постоянно, каждый рендер?

Используй useMemo для того что бы получать url

Используй useMemo для того что бы получать url

или обернуть всю функцию в useCallback, как пишет абрамов

или обернуть всю функцию в useCallback, как пишет абрамов

+1 именно для того этот хук и предназначен - прям прямое его предназначение :)

или обернуть всю функцию в useCallback, как пишет абрамов

У тебя все таки url вычисляемое значение, useMemo подходит больше

если квери не из пропсов зачем вообще в рендере создавать

То есть реакт при каждом ререндере вызывает функцию компонента, которая объявляет новую функцию в новой области памяти и поэтому при сравнении с функцией прошлого рендера они разные?

на самом деле если ты никуда не передаешь урл, то смысла нету оборачивать, ничего не выиграешь и хуже не будет скореевсего

У тебя все таки url вычисляемое значение, useMemo подходит больше

в таком случае вычесление надо переносить из эффекта в декларацию

Как стайлед с флой юзать ? StyledComponent<Props, Theme, *> так в последствии на инпуте ничего не выводится из типов (onChange и тд)