Если вы знакомы с нашим блогом, вы, должно быть, видели, что мы выпустили серию руководств о том, как создавать блоги с помощью Strapi с множеством интерфейсных фреймворков: Gatsby Old, Gatsby new, React, Next.js, Vue, Nuxt или Angular.

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

Мы уже выпустили React Starter, Gatsby Starter, Vue Starter и Next Starter, и мы продолжаем двигаться с Nuxt Starter.

Почему мы сделали эти закуски?

Стартовые программы позволяют быстро визуализировать результат связи между Strapi и вашим фреймворком.

Легче и быстрее копаться в существующем приложении, чтобы получить представление о продукте, чем создавать приложение с нуля.

Поскольку мы сделали учебники о том, как создать блог с тем или иным фреймворком, для сообщества Strapi показалось полезным использовать полученное приложение для создания стартеров.

Итак, чтобы начать работу со стартером, у вас есть два варианта:

  • Вы можете начать с установки стартера, а затем, следуя руководству, воспроизвести его и учиться в пути.
  • Или вы можете запустить стартер, чтобы напрямую протестировать приложение.

Итак, давайте посмотрим, как его запустить!

Начиная

Клонировать репозиторий и установить зависимости

git clone https://github.com/strapi/strapi-starter-nuxt-blog.git  
cd strapi-starter-nuxt-blog
# Using yarn
yarn setup:yarn
# Using npm
npm run setup:npm

Создайте свой проект

Эта команда запустит ваш внутренний и внешний сервер и выполнит миграцию данных на вашем внутреннем сервере.

# Using yarn
yarn build:yarn  
yarn develop:yarn
# Using npm
npm run build:npm  
npm run develop:npm

В качестве альтернативы вы все равно можете запускать свои серверы отдельно:

Запустить внутренний сервер

cd backend
# Using yarn
yarn build  
yarn develop
# Using npm
npm run build  
npm run develop

Запустите интерфейсный сервер

cd frontend
# Using yarn
yarn develop
# Using npm
npm run develop

Здесь работает сервер Nuxt = › http: // localhost: 3000
Здесь работает сервер Strapi =› http: // localhost: 1337

Функции

  • 2 типа контента: статья, категория
  • Разрешения установлены на true для статьи и категории
  • 2 Созданные статьи
  • 3 Созданные категории
  • Адаптивный дизайн с использованием UIkit

Страницы

  • «/» Отображать все статьи
  • «/ Article /: id» отображает одну статью
  • «/ Category /: id» отображать статьи в зависимости от категории

Если вам понравилось, было бы здорово поделиться этим словом 📣 И дайте мне знать, что вы думаете об этом, в комментариях ниже.

Наслаждайтесь этим стартером!