Nuxt.js статический сайт с динамическим одностраничным приложением, использующим Vue.js ?

#javascript #vue.js #nuxt.js #static-site

#javascript #vue.js #nuxt.js #статический сайт

Вопрос:

Я читаю о генераторах статических сайтов для клиентского проекта и наткнулся Vue.js и Nuxt.js что выглядит многообещающе. Поскольку у меня есть выбор между Vue.js и Реагируйте, я бы пока повторил.

Веб-сайт клиента — это около 120 страниц с предопределенным контентом, который не будет часто меняться. Так что это кажется идеальным кандидатом для статического сайта — тем более, что его текущий сайт WordPress только что получил удар от Google за ужасное время загрузки страницы…

«Проблема» или вопрос заключается в том, что помимо этих 120 страниц должна быть одна страница, которая в основном представляет собой одностраничное приложение, которое динамически извлекает данные из серверной части через API. Для кодирования этой динамической страницы было бы идеально, если бы я мог использовать Vue.js как хорошо.

Я нашел много информации о Nuxt.js что касается статических страниц или страниц, сгенерированных сервером. Но моим вариантом использования было бы много статических страниц плюс одна статическая страница, которая взаимодействует с API, и эта статическая страница должна быть создана с Vue.js также (включая заголовок сайта, меню, нижний колонтитул и т.д.)

Возможно ли это, и кто-нибудь делал что-то подобное? Спасибо за каждый указатель!

Ответ №1:

Да, вполне выполнимо. Я рекомендую использовать что-то вроде strapi.io или довольный, чтобы создавать свои страницы с содержимым для каждого компонента.

Вы бы создали каждый раздел сайта как компонент под nuxtjs и cms самостоятельно, см. Пример ниже.

https://strapi.io/blog/creating-strapi-dynamic-zone-in-nuxtjs-app

Под страницами вы создаете «_.vue», который подберет любой «slug», и именно так вы получаете контент для своей страницы, используя slug.

Другой пример — https://raoulkramer.de/nuxt-js-static-page-generator-with-dynamic-pages /

Надеюсь, вышесказанное даст вам лучшую идею.