next blog firestore Скачать - next blog firestore Скачать исходный код

next blog firestore

AI Исходный код

1.0.0

Скачать

Следующий блог Firestore

В этом блоге используется Next.js для API SSR & Firebase Firestore для хранения и получения данных. Создайте и отредактируйте свой контент в простой пользовательской системе управления контентом, созданной с помощью REACT, Mobx State Tree и стилизованных компонентов.

Клонируйте это репо и используйте его в качестве отправной точки, чтобы создать свой собственный фантастический блог.

Технологический стек:

Реагировать
Next.js
Firebase Firestore & Auth
Стилидированные компоненты
Mobx-State-Tree
Муравей дизайн
Маркси
Эслинт
Красивее
Webpack
Husky & Lint-Clear

Что ты получаешь:

Сообщения корма
Избранные посты
Сообщения по тегам и категории
Поддержка мульти языка
Поддержка мульти -автора
Отметка с возможностью использовать пользовательские компоненты React
Простая и удобная CMS, вдохновленная призраком
CMS защищена Firebase Auth
Быстрые и удобные для SEO ответы с SSR
Хорошие результаты в маяке

Начиная

Шаг 1. Создать учетную запись Firebase

Шаг 2. Метод установки аутентификации

Нажмите «Настройка метода регистрации» в разделе аутентификации.
Включить только Google поставщика аутентификации.
Добавьте свой домен (если у вас есть) в авторизованные домены .

Шаг 3. Создать базу данных Firestore

Перейдите в раздел базы данных и создайте экземпляр Firestore.

Firestore все еще в бета -версии, но это не делает его менее удивительным.

Шаг 4. Конфигурация базы данных.

Перейдите в раздел «Правила» в вашей базе данных и вставьте конфигурацию из-за.
Публикуйте новые правила.

Шаг 5. Установите секретные ключи Firebase для нашего приложения.

Создать .env в корне проекта. Не совершайте этот файл. Это личные данные, которые не должны быть доступны для всех.
Перейдите в настройки проекта в консоли Firebase (нажмите на значок Gear рядом с обзором проекта ).
Копировать данные с этой страницы на .env в следующем формате:

F_PROJECT_ID= < your Project ID >
F_AUTH_DOMAIN= < your Project ID > .firebaseapp.com
F_API_KEY= < your Web API Key >

Шаг 6. Установите ключ SDK Admin Firebase для импорта/экспорта данных из базы данных.

Чтобы иметь возможность инициализировать базу данных с начальным семенем, мы должны генерировать частную сервисную сервисную службу Firebase Admin.

Перейдите в настройки проекта > Сервисные учетные записи и нажмите «Сгенерировать новую кнопку для приватной клавиши» .
Сохраните загруженный файл в виде firebase-service-key.json в Project Root. ** Не совершайте этот файл. Это добавлено в .gitignore по умолчанию.

Шаг 7. Инициализировать базу данных с начальными данными.

Мы почти закончили. Давайте инициализируем нашу базу данных с начальными данными.

yarn
yarn run seed

Шаг 8. Настройка индексов базы данных.

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

Перейдите в базу данных > индексы и создайте следующий индекс.

Шаг 9. Запустите блог локально.

Мы готовы запустить наш блог на местном уровне.

yarn dev

Блог работает и работает на http: // localhost: 3000.

Шаг 10. Войдите в административную часть.

Подождите .. но что насчет части CMS?

Перейдите на http: // localhost: 3000/admin и нажмите «Нажмите, чтобы начать писать» .
Войдите в свою учетную запись Google во всплывающем окне.
Зайдите в консоль Firebase и добавьте права авторов в учетную запись, с которой вы только что подписали.
- Скопируйте пользовательский UID в разделе аутентификации .
- Создать коллекцию authors в базе данных
- Создайте коллекцию записи в authors , где documentId является UID пользователя, а name является id пользователя в файле config.js .