Guide for starter-kit creation

[Glajik]

Инструкция по созданию проекта на Firebase

Проект уже создан, см. ветку develop/starter-kit. Эту инструкцию решил создать на будущее, хотя к тому моменту все наверняка немного поменяется. Но может кому пригодится.

Note: Кстати документация по Firebase теперь доступна и на русском языке (машинный перевод, иногда корявый)

1. Create new Firebase project

Первым делом нужно зайти в консоль Firebase:

• Перейти по ссылке Firebase console
• Нажать кнопку Add Project и следовать мастеру

Вот инструкция по созданию проекта, с пояснениями - Setting up a Firebase project and registering apps Посмотрите General Best practices Обратите внимание на идентификатор проекта - project_id. Найти project_id в случае чего, можно будет в Project Dashboard, меню Settings -> General -> Project ID

2. Add other collaborators to project

После того как проект будет создан - откроется Project Dashboard.

Чтобы добавить соавторов, нужно:

• Зайти в настройки (шестеренка напротив Project Overview) вверху.
• Выбрать пункт Users and permissions
• Нажать кнопку Add member и добавить Gmail аккаунты. Можно несколько за раз через пробел.
• Выбрать Roles - это права доступа к управлению. Может быть Viewer или Editor. Owner передает права владения, осторожно.

3. Set default GCP resource location

Без этого шага к сожалению при попытке инициализировать проект на PC будет возникать ошибка.

• Там же в Settings -> General зайти и выбрать Default GCP resource location
  • Я выбрал eur3 (europe-west)
  • Сменить позже будет невозможно

4. Create Cloud Firestore Database

Без этого шага тоже не удастся инициализировать проект на PC, если там будет выбрана опция Database

• Зайти в раздел Cloud Firestore, нажать Create database
• В окне выбрать Start in test mode. Он устанавливает очень широкие правила доступа к базе в течении 30 дней. Но в продакшене конечно правила нужно будет строго настроить.

5. Initialize Firebase project on local PC

Подробнее Initialize a Firebase project

Если Firebase CLI был установлен ранее - тогда нужно обновить до последней версии npm install -g firebase-tools

Итак процесс инициализации:

• Установить Firebase CLI на ПК, следуя инструкции Install the Firebase CLI

• Создать папку для проекта, открыть терминал и перейти в нее

• Выполнить и перейти по ссылке для авторизации. Пройдите весь процесс.

  firebase login

• Выполнить

  firebase init

• При помощи стрелочек курсора и пробела выбрать опции, для проекта

  • Я выбрал полный набор, включая эмулятор для тестирования

• Далее выбрать опцию Use an existing project

• Затем нужно выбрать проект из списка, в нашем случае - diet-routine

• Следующие вопросы пропускаем нажатием Enter - мы используем значение по умолчанию

  • What would you like to call your project?
  • What file should be used for Firestore Rules?
  • What file should be used for Firestore indexes?

• Если вы видите ошибку Error fetching Firestore indexes - нужно значит нужно обновить Firebase CLI до последней версии.

• What language would you like to use to write Cloud Functions?

  • Будем использовать JavaScript

• Do you want to use ESLint to catch probable bugs and enforce style?

  • Yes

• Do you want to install dependencies with npm now?

  • Yes

• What do you want to use as your public directory?

  • Используем по умолчанию

• Configure as a single-page app (rewrite all urls to /index.html)?

  • Yes

• What file should be used for Storage Rules?

  • По умолчанию

• Emulators Setup

  • Выбираем Functions, Datastore, Hosting

• Для вопросов используем значение по умолчанию

  • Which port do you want to use for the functions emulator?
  • Which port do you want to use for the database emulator?
  • Which port do you want to use for the hosting emulator?

• Would you like to enable the Emulator UI?

  • Yes

• Which port do you want to use for the Emulator UI

  • Пропускаем, Enter

• Would you like to download the emulators now?

  • Yes

Вы можете быть уже авторизированы, например для другого аккаунта. Тогда нужно выполнить firebase logout

6. Create web client

• Установить утилиту. Если установлена давно, лучше обновить.

  npm install -g create-react-app

• Из корневой папки проекта выполнить

  npx create-react-app web-client --template redux

• Изменяем в файле firebase.json путь к папке build внутри веб клиента

  "hosting": {
  "public": "web-client/build",

• Старая папка public больше не нужна