Скажите пожалуйста. области видимости Ref? Виден ли он parent and child component-ам

component, no

Подскажите плз, можно ли в редаксовском контейнере возвращать компонент

Вполне нормально

Редакс- это данные, а не их отображение. Как факт- можно, но не стоит

Компонент (чистый) — это элемент, который не имеет логики, завзанной на redux данные, контейнер вполне может в зависимости от данных возвращать те или иные компоненты, просто чтобы инкапсулировать в себе такую логику

Компонент (чистый) — это элемент, который не имеет логики, завзанной на redux данные, контейнер вполне может в зависимости от данных возвращать те или иные компоненты, просто чтобы инкапсулировать в себе такую логику

Компонент — это компонент, не путай людей :-)

Я не путаю, я говорю как есть)

Элемент — это другое, я про это

Элемент по сути просто объект с полем type (где указывается класс/функция/строка тега), props и еще всякой служебной мутью

Компонент (чистый) — это элемент, который не имеет логики, завзанной на redux данные, контейнер вполне может в зависимости от данных возвращать те или иные компоненты, просто чтобы инкапсулировать в себе такую логику

Мне кажется не стоит мешать данные с представлением. В данном случае проще и понятней сделать композицию compose( connect(...), withProps({ Form: props => ({ signup: <SignupForm />, login: <LoginForm /> }[props.changedTab]) })(Tabs)

Ну в принципе это то же самое решение, только в другой записи)

То, что проще и понятнее — факт, но результат всё равно называется термином контейнер)

Камрады, реализация материалуи http://www.material-ui.com/ норм или есть поинтереснее?

Камрады, реализация материалуи http://www.material-ui.com/ норм или есть поинтереснее?

интереснее и лучше нет

окай, спс

вот пилим на styled-components с коллегами свой велик хз на сколько лучше получится

не

разве?

Firefox начнёт помечать страницы, передающие пароли по HTTP, как небезопасные, ещё есть время для перехода на HTTPS https://blog.mozilla.org/security/2017/01/20/communicating-the-dangers-of-non-secure-http/

есть тонна минусов у такого подхода (css in style prop)

Firefox начнёт помечать страницы, передающие пароли по HTTP, как небезопасные, ещё есть время для перехода на HTTPS https://blog.mozilla.org/security/2017/01/20/communicating-the-dangers-of-non-secure-http/

хром тож обещал

есть тонна минусов у такого подхода (css in style prop)

есть

но насколько я помню, у них не только inline css

но они ещё и style tag кладут часть стилей

Камрады, реализация материалуи http://www.material-ui.com/ норм или есть поинтереснее?

они хотят уйти от этого подхода, я пока так юзаю

но они ещё и style tag кладут часть стилей

малую часть

они хотят уйти от этого подхода, я пока так юзаю

в какой хотят подход?

Интересно, тут Styletron не лучше будет?

в какой хотят подход?

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

Вроде как раз такой кейс

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

вроде как на jss

вроде как на jss

насколько я понял у них пока глубокая альфа и толком не понятно во что это выльется в результате

вроде как на jss

ну хоть так

Интересно, тут Styletron не лучше будет?

styletron и styled-components очень близки я вижу

В плане?

оба создают компоненты уже стилизованные, а не прокидывают проп с классами

оба умеют внутри стилей пропы

У styletron важен только virtual CSSOM

у styled-components разве нет?

но в стайлед компонентс можно легко использовать неглубокий каскад

Посоветуйте либу, предоставляющую HOC для асинхронной загрузки данных для компоненты. Сейчас используем redux-connect, но нас не устраивает, что он работает только для компонент, указанных в роутере. Нужна возможность, чтобы любой компонент мог запросить асинхронно что-то перед рендером себя

react-komposer понравился. абсолютно агностичен насчет всего )

recompose же

Посоветуйте либу, предоставляющую HOC для асинхронной загрузки данных для компоненты. Сейчас используем redux-connect, но нас не устраивает, что он работает только для компонент, указанных в роутере. Нужна возможность, чтобы любой компонент мог запросить асинхронно что-то перед рендером себя

> что он работает только для компонент, указанных в роутере а откуда такое ограничение?

закодили его :) https://github.com/makeomatic/redux-connect/issues/45#issuecomment-230349501

а, "redux-connect".... ок, я естессн прочитал "react-redux"

Ребят, как заставить прогнать конфиг вебпака на ноде при изоморфном рендеринге, чтобы все лоадеры подключились?

Ребят, как заставить прогнать конфиг вебпака на ноде при изоморфном рендеринге, чтобы все лоадеры подключились?

ты бэкенд вебпаком собираешь?

Я пытаюсь create-react-app сделать изоморфным, вроде как сделал, но он ругается на подключаемые scss файлы

Там целая история, как приложение современное изоморфным делать

Нигде нет человеческой документации, как это дело нормально сделать

Есть первый вариант - немного костыльный вариант, который хакает нодовскую require() и если там какой нибудь scss файл, то из json подгружает данные: https://github.com/halt-hammerzeit/webpack-isomorphic-tools

Посоветуйте либу, предоставляющую HOC для асинхронной загрузки данных для компоненты. Сейчас используем redux-connect, но нас не устраивает, что он работает только для компонент, указанных в роутере. Нужна возможность, чтобы любой компонент мог запросить асинхронно что-то перед рендером себя

recompose же есть

Там целая история, как приложение современное изоморфным делать

у меня есть готовый бойлерплейт но я тесты не делал

не сильно сложно изоморфность врубить...

Есть второй путь - как выше написали, делай отдельную сборку для сервера, тебе надо будет в дев режиме постоянно два вебпака держать

Можешь скинуть?

бегло пробежался, не нашел там декоратора для асинхронной загрузки с поддержкой redux

у многих есть бойлерплейты :) я могу еще посоветовать хот-юниверсал

https://github.com/erikras/react-redux-universal-hot-example

бегло пробежался, не нашел там декоратора для асинхронной загрузки с поддержкой redux

да блин Всё хочешь быстро. что ты будешь рендерить пока данные не приши? пустоту?

Можешь скинуть?

https://github.com/lestad/rurarar

Хот-юниверсал слишком сложный, чтобы выпилить из него все ненужное)

https://github.com/lestad/rurarar

спасибо)

Да выпиливать всегда проще :) но вообще согласен, да, он довольно большой

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

да блин Всё хочешь быстро. что ты будешь рендерить пока данные не приши? пустоту?

хотя бы пустоту, но лучше прелоудер

ERROR: S client not available

ну так заюзай любой лоадер данных вызови в willMount lifecycle загрузку данных и прокидывай вниз пропс с данными ниже смотри есть ли данные и рендери что нужно вот это всё оборачиваешь в один хок и юзаешь профит? - твой код - гибко - рекомпоз принесет профит твоему проекту, а либа которая делает только подгрузку асинхронную — нет

а зачем тогда рекомпоз, если я пишу декоратор самостоятельно?

/stat@combot

combot.org/chat/-1001032883247

а зачем тогда рекомпоз, если я пишу декоратор самостоятельно?

рекомпоз огранизовывает работу с пропами

Я пытаюсь create-react-app сделать изоморфным, вроде как сделал, но он ругается на подключаемые scss файлы

Я это так решал, в компоненте вместо import styles from './Button.styl' писал import styles from './buildCssMap' , и при помощи gulp рядом со всеми файлами .styl делал файл buildCssMap.js, в котором что-то вроде export default { title: 'Button__title', wrapper: 'Button__wrapper' } Мне самому такое решение не очень нравится, но хотя бы все понятно как работает и нет всякой магии вроде подхачивания нодовского require

не надо так делать

Я пытаюсь create-react-app сделать изоморфным, вроде как сделал, но он ругается на подключаемые scss файлы

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

почему не надо?

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

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

на сервере тебе нужен пакет ignore-styles

Почему никто не может сделать простой и понятный бойлерплейт? Со всей лабудой, чтобы люди могли разобраться

Почему никто не может сделать простой и понятный бойлерплейт? Со всей лабудой, чтобы люди могли разобраться

ну давай

ты можешь быть 1ым)

попробуй

ответ: это сложно

Почему никто не может сделать простой и понятный бойлерплейт? Со всей лабудой, чтобы люди могли разобраться

возьми create-react-app он простой

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

попробуй rship

разве create-react-app не был создан просто для демонстрации компонентов? А не для реальной разработки

разве create-react-app не был создан просто для демонстрации компонентов? А не для реальной разработки

он нормально подходит для простых spa

для старта новичкам вообще в самый раз

со стилями вообще беда, куча разных препроцессоров, postCss, css модули, styled components, jss, styletron, и у всех свой взгляд на все это и на то, как надо делать а как не надо делать и как это надо собирать и т.д. Например тут https://github.com/LestaD/rurarar styled components, а кто-то считает их наркоманством

У всех разные взгляды, у всех по-разному сделано И нет ни одного нормального howto или гида по тому, как надо

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

Так потому что конечного решения "как надо" так и нет :) Тебе норм решение, держать второй вебпак для сервера?

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

кстати, советую еще почитать доки https://github.com/halt-hammerzeit/universal-webpack (это автор того же webpack-isomorphic-tools), он более-менее все раскладывает по поводу того, что творится с универсальными приложениями на текущий момент

со стилями вообще беда, куча разных препроцессоров, postCss, css модули, styled components, jss, styletron, и у всех свой взгляд на все это и на то, как надо делать а как не надо делать и как это надо собирать и т.д. Например тут https://github.com/LestaD/rurarar styled components, а кто-то считает их наркоманством

Если ты не знаешь что выбрать выбирай самое понятное

Я для себя выбрал stylus + css модули

Я это так решал, в компоненте вместо import styles from './Button.styl' писал import styles from './buildCssMap' , и при помощи gulp рядом со всеми файлами .styl делал файл buildCssMap.js, в котором что-то вроде export default { title: 'Button__title', wrapper: 'Button__wrapper' } Мне самому такое решение не очень нравится, но хотя бы все понятно как работает и нет всякой магии вроде подхачивания нодовского require

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

Я выбрал css-in-js из-за своих требований к цсс и интерфейсу