@Vakzinator

Какой верный подход при создании многостраничного react приложения?

Доброго времени суток, разработчики!

Появилась потребность в изучении react.js. До этого уверенно использовал только jQuery. Сейчас начал вникать в материал по реакту. Но некоторые моменты не до конца понимаю. Мне предстоит сверстать каталог именно на react.js, это будет многостраничный сайт. Как правильно будет сверстать такое многостраничное приложение?

1. Делается ли так, что react приложением будет лишь сам каталог, а header и footer, всякие окна - это обычной версткой? Или же это не правильный подход?
2. Логично предположить, что если используется react, то подключать другие библиотеки, к примеру, jQuery (для каруселей, окон, ajax) будет в корне не верно?
3. Как организовано многостраничное приложение? Это будут просто разные страницы, на которых будут вызываться нужные компоненты (каталог, подкатегория, детальная страница) или тут другая логика?
4. Чисто любопытно: если на странице будет только один блок #app, к примеру, а все остальное подгружается через js, как обстоят дела с СЕО?

Хочется разобраться с этими вопросами, чтобы дальше продолжать штудировать react, понимая картину в целом.
  • Вопрос задан
  • 86 просмотров
Пригласить эксперта
Ответы на вопрос 2
rockon404
@rockon404
Frontend Developer
1. В вашем случае нет, вам же, насколько я понимаю, нужна навигация без перезагрузки страницы.
2. Забудьте на время разработки что такое JQuery и подходы которые с ним принято использовать. По поводу библиотек, экосистема react содержит множество библиотек. Так же есть смыл подключить библиотеку для ajax запросов axios/superagent/etc. Вообще, перед тем как подключать какую-либо библиотеку лучше 3 раза подумать, так как многие из них существенно увеличивают размер бандла, например, тот же moment. Для того чтобы быть в курсе того, что и сколько в вашем бандле занимает места можно подключить в prod сборку webpack-bundle-analyzer.
3. Почитайте про роутинг на стороне клиента. Для React разработки стандарт react-router.
4. SSR.
Ответ написан
@dimoff66
Кратко о себе: Я есть
1. Если header и footer не имеют кнопок или других элементов, меняющих состояние компонентов, то можно обычной версткой, а внутрь поместить блок, в котором будет работать главный компонент приложения
2. Да, так и есть.
3. Почитайте про React Router, вкратце: страницы помещаются внутрь компонента Switch и у каждого в пропсах прописывается путь, при котором оно будет отбражено. И есть компоненты Link, которые меняют location компонента.
4. В интернете много материалов, как подружить React Router с SEO
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через TM ID
Похожие вопросы
Ultimate Guitar Калининград
от 1 000 до 5 000 usd.
Enapter Санкт-Петербург
от 160 001 руб.
Spar-online Нижний Новгород
от 150 000 до 170 000 руб.
16 янв. 2019, в 14:53
20000 руб./за проект
16 янв. 2019, в 14:52
3000 руб./за проект
16 янв. 2019, в 14:26
50 руб./за 1000 зн.