Возможно ли создать полноценное SPA приложение на React.js?

Question

[titronfan]

Здравствуйте!
Есть большое десктопное приложение. Его нужно переделать на web. Будет очень много UI.
Недавно начал разбираться с React.js т.к. он по сути и предназначен для построения UI.
Насколько я знаю, React.js - это всего лишь View из MVC.

Посоветуйте, можно ли сделать SPA приложение на React.js? Я наслышал о Flux и Redux, но в этом ещё мне нужно разбираться... Если можно подробнее пожалуйста. Совместно в чем лучше использовать React.js? В качестве бэкенда использую Express.

Comments

[copal]

Могу сказать одно, ещё несколько недель назад я ненавидел redux, так как те объяснения которые я слышал были мной поняты не так, ну или так объясняли. В итоге когда я решил чисто из интереса его попробовать, оказалось вполне нормальным решением и теперь я его использую сам, так как чтобы не делал получается примерно так же.

[titronfan]

Да, я только второй-третий день смотрю Реакт, и для меня пока совсем непонятен стек технологий совместно с Реактом которые идут. Клиентские MVC фреймворки - с ними все вроде достаточно ясно. У них есть контроллеры. В каком виде они представлены в Реакте я не совсем понимаю. Или совместно к какими технологиями это реализуется...

[copal]

titronfan: а что за приложение?

[titronfan]

Клиенты, заявки, отчеты и тд )

Answer 1

[Konstantin Tarkus]

React.js это не только V из MVC, это полноценная библиотека для создания UI компонентов, которая прекрасно работает без M и C из MVC архитектуры (т.е. вместо MVC архитектуры, React-разработчики обычно используют Flux архитектуру). В дополнение к React, для больших приложений имеет смысл использовать GraphQL в качестве data API бэкенда и Relay в качестве управления данными на клиенте (Redux в данном случае скорее всего не понадобится). Пример можно посмотреть здесь => https://github.com/kriasoft/react-starter-kit

Comments

[titronfan]

Большое спасибо.

[Анатолий]

"библиотека для создания UI компонентов" эта фраза сама по себе не предполагает логику, лишь структурную целостность. без M и без V и без C можно прекрасно работать, только вот полноценная структура UI и полноценная структура приложения, это далеко не одно и то же.

[Konstantin Tarkus]

Анатолий, в последнее время мало кто использует MVC паттер (см. призентации Flux). Как показывают инженеры из фейсбука, очень сложные UI приложения у них делаются без M и C слоёв, от MVC им пришлось отказаться, т.к. эта архитектура подходит больше для маленьких клиентских приложений.

Answer 2

[Максим]

Конечно можно. React + Redux и дело в шляпе.
Для роутинга - react-router.
Для сборки/минификации/использования es6 и т.д. - webpack+babel
Для тестов - ммм, пожалуй, "мир реакта" просто сказка в вопросах тестирования. Есть много отличных инструментов.

---
В дополнение к предыдущему ответу: выбирать новую технологию для проекта стоит, только если сроки позволяют ( о чем там в принципе и написано). Использовать react для какой-то отдельной страницы/части можно.

Как сказал, Dan, создатель Redux (примерно, по памяти):

"Если у вас нет времени изучать А, то А не требуется на этом проекте"

Comments

[titronfan]

Спасибо за совет и за Ваш учебник по React-у.

Answer 3

[Илья]

https://www.gitbook.com/@maxfarseer
Прошел эти три туториала и смог сам писать первые надуманные проекты, решая возникающие проблемы при помощи гугла. Сейчас уже пишу полноценный фронтенд для одного проекта - идёт хорошо.
Автор, кстати, сидит на тостере и он ответил вам :)

Comments

[titronfan]

Спасибо

Answer 4

[Анатолий]

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

Comments

[titronfan]

Я раньше работал с первым Ангуларом. Но эти директивы в нем - меня они не совсем устраивают. В Реакте все очень красиво делается в плане создания UI. Но меня просто смущает это понятие как "View" в нем и не более. С чем дополнительно используется React - вот с этим сейчас разбираюсь. Жаль, я на данный момент профан в этой теме...

[Анатолий]

titronfan: я бы советовал все таки взять ангуляр + реакт. Основную часть сделаете на ангуляре, а мелкие фичи на реакте, заодно и потренируетесь. К концу проекта, если он действительно большой, вы уже будете более хорошо разбираться в реакте чтоб втихоря делать рефакторинг ангуляра в пользу реакта.

[titronfan]

Да, нужно все попробовать. Спасибо.

[Konstantin Tarkus]

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

[Анатолий]

koistya: реакт просто вью, он не даст четкой архитектуры, за архитектурой нужно обращаться к фреймверкам mvc или mvvm.