#node.js #reactjs #server-side-rendering #react-static
#node.js #reactjs #рендеринг на стороне сервера #реакция-статическая
Вопрос:
Возможно ли сгенерировать статическую HTML-страницу из кода react и REST API в качестве триггера? Я приведу пример использования, чтобы описать мою проблему.
Предполагая, что я создаю простое приложение notes SPA react с помощью creat-react-app. Пользовательский интерфейс позволяет пользователю просматривать список всех заметок, добавлять, редактировать и удалять заметки. Нажатие на заметку приведет к ссылке на страницу заметки, на которой отображается дополнительная информация. Операции CRUD выполняются с помощью REST API, размещенного на сервере node js, который использует MongoDB в качестве базы данных.
Этот веб-сайт notes используется классом — один учитель имеет привилегию для операций CRUD, в то время как все учащиеся полностью пассивны и могут просто просматривать (читать) данные. С этой точки зрения очевидно, что веб-сайт, который используют студенты, может быть совершенно другим проектом react, и, в частности, один статический веб-сайт для списка заметок и один для каждой заметки, поскольку он извлекает данные только с помощью REST API и отображает их в компонентах a <NoteListItem />
и <NotePage />
react, которые одинаковы для каждогопримечание.
Статическая страница, на которой отображается весь список, может содержать div, который извлекает список динамически, но при нажатии на заметку будет отображаться статический веб-сайт этой заметки. Когда учитель добавляет новую заметку, вызов API будет выполнен в my-host / api / addNote, и в конце этого контроллера я хочу добавить функцию generateStaticPage(noteId)
, которая будет генерировать статическую страницу заметки.
Это основная идея, которая подразумевает использование некоторых известных концепций в SSR / react-static, где вы можете определить динамическую область видимости, статику, шаблон и т.д.
Возможным решением является библиотека, подобная react-static, но как я могу создать страницу сразу после добавления заметки? Есть ли какая-либо библиотека, которая может помочь мне достичь этого?
Комментарии:
1. конечно, вы можете использовать SSR для этого. хотя почему? почему бы просто не загрузить заметки через
fetch
на клиенте?2. Это, конечно, был очень простой пример. Я думаю, что SSR будет моим решением, но мне любопытно, возможно ли создать фактическую статическую страницу по требованию
3. это действительно возможно. та же функция, которая используется для создания статических страниц в чем-то вроде react-static или gatsby, может быть вызвана по требованию. для меня это не похоже на отличное решение. более традиционное
JSON -> database -> data -> ssr
решение кажется более подходящим для динамически создаваемого контента. знаете, как в основном работают все сайты блогов4. В этом случае я хотел бы задать еще один вопрос: как уже упоминалось, учащийся может просматривать только данные, в то время как у преподавателя больше возможностей. Предположим, что
<NoteListItem />
компонент отображается со значком пера, если для state.user установлено значение admin, и без него, когда для state.user установлено значение visitor. При использовании SSR должен ли я разрабатывать приложение таким же образом, чтобы каждый компонент предоставлял больше функциональности на основе состояния этого типа пользователя, или лучше сделать admin и visitor 2 разными приложениями — admin — это обычное приложение для создания приложений, реагирующих на запросы, а приложение для посетителей поддерживает SSR?5. На этот вопрос нет правильного ответа, это зависит от требований вашего приложения. Из того, что вы сказали до сих пор, я по-прежнему не вижу вариантов использования SSR или статических страниц для начала