Доброго времени суток, уважаемые!
Немного умею в js по фронтовой части и возникла необходимость по работе соорудить одну поделку: пользователь взаимодействует с тачскрин монитором, выбирает из списка модель устройства, выбирает требуемый расходный материал, указывает свою учетную запись из списка (кто оформил заказ) и жмякает кнопку заказать, заказ уходит в базу данных, затем на почту ответственного за расходные материалы должен прийти этот заказ. Подскажите, пожалуйста, какой стек технологий выбрать для реализации такого проекта? Мне точно будет нужна база данных на сервере и CMS с возможностью вносить в нее правки и администрировать после релиза и больше не лезть в код. Заранее благодарю!
Python/Django, PHP/Laravel
Mike
Anonymous
А какой стек технологий посоветуете? Для экосистемы реакта
hpplck
Python/Django, PHP/Laravel
Спасибо за ответ, а JS сюда можно приплести акромя фронтовой части?
Mike
А какой стек технологий посоветуете? Для экосистемы реакта
искать на гитхабе, где побольше звезд и брать все
Mike
Спасибо за ответ, а JS сюда можно приплести акромя фронтовой части?
Если это реакт то работать с беком как рест, если обычная статика - там есть темплейты
Anonymous
Что-то похожее на юдеми + тестирование по окончании курса. Выдача сертификата Бесплатный доступ.
Mike
Что-то похожее на юдеми + тестирование по окончании курса. Выдача сертификата Бесплатный доступ.
если мы тут сделаем фриланс, модераторы не очень обрадуются. Напишите в личку
Rou
Ребят, не могу найти норм статью про актуальные жизненные циклы для react 16.12.0 и как использовать жизненные циклы в функциональных компонентах без recompose, я так понимаю что можно через хуки, но не могу понять как
Roman
Привет.
Кто знает, как лучше организовать передачу JWT токена в axios инстанс?
Roman
JWT сохр. в Session Storage
Я его оттуда достаю, и явно указываю в header:
getToken().then((token) => {
if (token) {
instance.defaults.headers.common.authorization = `JWT ${token};`
}
});
Roman
Выглядит очень не хорошо и "не пластично" : )
Maxim
Ребят, не могу найти норм статью про актуальные жизненные циклы для react 16.12.0 и как использовать жизненные циклы в функциональных компонентах без recompose, я так понимаю что можно через хуки, но не могу понять как
Прочитайте раздел про хуки в документации: https://ru.reactjs.org/docs/hooks-intro.html
Ivan
Ребят, не могу найти норм статью про актуальные жизненные циклы для react 16.12.0 и как использовать жизненные циклы в функциональных компонентах без recompose, я так понимаю что можно через хуки, но не могу понять как
После документации почитайте вот эту статью.
https://overreacted.io/a-complete-guide-to-useeffect/
В функциональных компонентах нет жизненного цикла, его нельзя реализовать на хуках. Там другая терминология и другой подход. Всё, что можно реализовать на жизненном цикле, можно реализовать и на хуках. Кроме componentDidCatch.
Rou
После документации почитайте вот эту статью.
https://overreacted.io/a-complete-guide-to-useeffect/
В функциональных компонентах нет жизненного цикла, его нельзя реализовать на хуках. Там другая терминология и другой подход. Всё, что можно реализовать на жизненном цикле, можно реализовать и на хуках. Кроме componentDidCatch.
Через useEffect, я правильно понимаю?
Rou
arts
Продублирую из JS канала, может здесь получу тоже отклик.
За дублирование во все чаты можно получить бан
Bogdan
как реакт роутер понимает, что 404 показать нужно? например вместо роута если показать undefined, он 404 не кинет же?
Artyom
как реакт роутер понимает, что 404 показать нужно? например вместо роута если показать undefined, он 404 не кинет же?
Пишется HOC, который делает редирект
Андрей
как реакт роутер понимает, что 404 показать нужно? например вместо роута если показать undefined, он 404 не кинет же?
Нет доступных роутов в текущем рендере.
Bogdan
ну вот я пытался, есть массив, если к примеру у елемента false , вместо роута - Undefined, но он так 404 не даст
Bogdan
Bogdan
const Check = ({ children, guards, ...props }) => (
<GuardContext.Consumer>
{({ context }) => {
return guards
? guards.every(item => item(context))
? children(props)
: undefined
: children(props);
}}
</GuardContext.Consumer>
);
будет как раз undefined, но 404 с какого перепугу он выдаст
Dmitriy
Имелась ввиду наверное добавление/удаление canvas из DOM, с последующей потерей контекста отрисовки.
https://codesandbox.io/s/hungry-thompson-ec39t
хм ну да выходит бред написал
Китикет
Александр
https://codesandbox.io/s/hungry-thompson-ec39t
хм ну да выходит бред написал
Эм? Не совсем понял к чему это?
Александр
при всем ЖЦ до анмаунта контекст не теряется
Разумеется, наверное мы в чём-то не допоняли друг друга
Dmitriy
Разумеется, наверное мы в чём-то не допоняли друг друга
ну почему то для меня было неочевидно
Александр
ну почему то для меня было неочевидно
Ну элемент же canvas один и тот же от маунта до анмаунта, он просто «не чувствует» ререндеры.
Dmitriy
Ну элемент же canvas один и тот же от маунта до анмаунта, он просто «не чувствует» ререндеры.
а глянь в демку. Почему на сайз так реагирует?
Александр
а глянь в демку. Почему на сайз так реагирует?
Я с телефона, завтра гляну на работе, а можете пока словами что там происходит и что вас настораживает?
Китикет
Так это не массив, а обьект
Dmitriy
Я с телефона, завтра гляну на работе, а можете пока словами что там происходит и что вас настораживает?
пропадает содежримое канваса. Ну хотя это может его особенность. Если менять размер самой канвы то все затирается это ж растр с координатами
Anonymous
Тимофей 🛴
Китикет
Автобиндинг в классах))
Dmitry
Ребят, привет, а я могу в одном кастомном хуки использовать useState и useCallback
Андрей
Ребят, привет, а я могу в одном кастомном хуки использовать useState и useCallback
Попробуй. Получишь ответ на свой вопрос.
Dmitry
Попробуй. Получишь ответ на свой вопрос.
я уже попробол, и ловлю странные баги, никакой инфы я вроде не нашел, но есть у меня подозрение, что хуки неправильно кешируют useCallback
Андрей
Андрей
Андрей
Dmitry
нет, это я уже стал шатать в разные стороны, одинакого работате
Андрей
нет, это я уже стал шатать в разные стороны, одинакого работате
setFavorites(favorites) не сработает как ты ожидаешь, так как ты мутируешь данные. Я об этом.
Dmitry
setFavorites(favorites) не сработает как ты ожидаешь, так как ты мутируешь данные. Я об этом.
проблема вот в чем, хук работает, как нужно, во всем, кроме того момента, где нужно сохранить в localStorage
Андрей
проблема вот в чем, хук работает, как нужно, во всем, кроме того момента, где нужно сохранить в localStorage
А что происходит в момент сохранения?
Roman
Не майся фигней, сделай обертку над инстансом
Спасибо за ответ.
Реально так будет лучше всего!
Dmitry
А что происходит в момент сохранения?
получал предыдущий снепшот, в итоге вынес на уровень выше, к родителю и все заработало
Александр
Dmitry
А зачем первый вызов setFavorites? И зачем мутирует favorites
Александр
Кстати можно без лишнего спреда, просто {...favorites, [id]: favorite}, 18 строка
Александр
Dmitry
Ну вроде выглядит все верно, не совсем понял честно что не работает и как проявляется ?
презервился предыдущий стейт localstorage, но это происходило судя по всему из-за кастомного memo родителя
Александр
Я бы ещё вынес логику синхронизации с хранилищем в отдельный хук, наверняка ещё где-то захотите реюзать, но это уже к вопросу не относится.
Леша
Нужен ли вообще Redux? Хуки useReducer и useDispatch не заменяют его?
Daniil
Нужен ли вообще Redux? Хуки useReducer и useDispatch не заменяют его?
Ты можешь просто в поиск по чату вбить Redux useReducer 🙃
Andrey
ah shit, here we go again
Roman
Andrey
Нужно просто найти источник.
мне кажется, люди триггерятся на то, что редьюсер в редаксе и в хуке похожи и по названию, и по назначению (кто бы мог подумать, да)
вот и думают, что есть уникальное решение
Андрей
Нужен ли вообще Redux? Хуки useReducer и useDispatch не заменяют его?
useDispatch - часть редакса.
Tim
Всем привет! Подскажите пожалуйста, в useState сейчас лежат 2 обьекта в массиве на рандер 2х инпутов, эмайла и пароля, отрисовываются через .map(), сам компонент инпута берется из другого компонента с заполнением этих данных в виде пропсов, не получается изменить значение второго обьекта стейта для инпута ("type", для того что бы показывать пароль по клику), что то не пойму, правильно ли делаю
Tim
import React, {Fragment, useState} from 'react'
import styled from 'styled-components'
import AuthBg from './AuthBg'
import Logo from '../../components/Logo/Logo'
import Input from '../../components/Input/Input'
import ButtonPrimary from '../../components/ButtonPrimary/ButtonPrimary'
import ButtonOutline from '../../components/ButtonOutline/ButtonOutline'
import ShowPassword from "../../components/ShowPassword/ShowPassword";
const Auth = () => {
const AuthWrap = styled.main`
background: rgba(255, 255, 255, .9);
width: 100%;
height: 100vh;
display: flex;
flex-grow: 1;
margin: 0 auto;
flex-direction: column;
`
const AuthForm = styled.form`
width: 90%;
height: 210px;
margin: 100px auto 0;
display: flex;
flex-direction: column;
justify-content: space-around;
position: relative;
`
const [inputs, setType] = useState([
{
placeholder: 'E-Mail',
type: 'text',
autocomplete: 'off'
},
{
placeholder: 'Пароль',
type: 'password',
autocomplete: 'current-password'
}
])
const showPasswordHandler = () => {
inputs.map(input => {
console.log(input.type)
// setType({input.type: 'text'})
})
}
const formPreventHandler = e => {
e.preventDefault()
}
return (
<Fragment>
<AuthBg />
<AuthWrap>
<Logo
width={'200px'}
height={'50px'}
/>
<AuthForm onSubmit={formPreventHandler} >
{inputs.map((input, idx) =>
<Input
key={idx}
placeholder={input.placeholder}
type={input.type}
autocomplete={input.autocomplete}
/>)
}
<ShowPassword showPass={showPasswordHandler} />
<ButtonPrimary
title={'Войти'}
/>
<ButtonOutline
title={'Зарегистрироваться'}
/>
</AuthForm>
</AuthWrap>
</Fragment>
)
}
таков код
Tim
useState для примитивов. Для структур используйте useReducer
понял сейчас посмотрю, еще есть какие то предложения ?
Igor
useState для примитивов. Для структур используйте useReducer
можно ссылку на хороший гайд по useReducer? (в доке не понял(()
Tim
Redux?)
смысл редакса в таком примитивном примере, без хука, чрез старый добрый setState вопрос решался гораздо проще
Ivan
хук. само его понимание
Ну это же тот же самый store с reducer’ом и функцией dispatch. Возьмите хороший гайд по основам redux, вот вам гайд по useReducer. Внутри он работает так же, как useState, плюс-минус.
Igor
смысл редакса в таком примитивном примере, без хука, чрез старый добрый setState вопрос решался гораздо проще
у меня даже не так. я прекрасно понимаю, как работает редакс. как работает setState и useState, useEffect. Но вот useReducer не понял (
Ivan
смысл редакса в таком примитивном примере, без хука, чрез старый добрый setState вопрос решался гораздо проще
Я отвечал не про ваш пример, а про гайд по useReducer.
Ivan
у меня даже не так. я прекрасно понимаю, как работает редакс. как работает setState и useState, useEffect. Но вот useReducer не понял (
Передаёшь редьюсер, получаешь стор и диспатч, точно такие же, как в редаксе. Всё.
Tim
так я не понял, useState получается не в состоянии обработать по нормальному более 1го обьекта ?