Firebase 9  — «Что нового?

и как начать работу в течение нескольких минут.

Недавно была выпущена версия Firebase 9, и способ, который мы использовали для импорта и использования ее функции, теперь изменен. Это связано с реализацией функции встряхивания дерева. Сотрясение дерева в соответствии с документацией MDN означает удаление мертвого кода из вашего связанного файла JavaScript.

Чтобы использовать Firebase 9, убедитесь, что вы уже настроили сборщик модулей в своем приложении. Если вы создаете свое приложение с помощью инструментов cli, таких как

create react app OR vue-create

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

Прежде чем начать, вот ссылка на весь код, который может быть вам полезен. Это скелет, который вы можете скопировать и вставить в свой следующий проект и напрямую начать использовать firebase 9 в течение нескольких минут. Просто добавьте конфигурацию firebase в файл .env, и все будет работать нормально.

Теперь давайте начнем с настройки Firebase 9.

Теперь я уже предполагаю, что вы использовали Firebase в прошлом, и именно поэтому вас привлекает Firebase 9. Поэтому я постараюсь быстро приступить к работе и использовать функции firebase.

Шаг 1. Настройте файл конфигурации Firebase.

Файл конфигурации не является обязательным файлом, который вам нужен, но он делает структуру вашего кода элегантной и простой в использовании. Итак, я создам файл конфигурации, в котором сначала будет инициализировано приложение firebase.

Теперь это очень важный файл, потому что все ваши инициализированные объекты, которые экспортируются, имеют решающее значение для работы вашего приложения Firebase. Ранее (до Firebase 9) мы применяли функции непосредственно к инициализированному приложению firebase, например

const app = initializeApp(firebaseConfig);
const auth = app.auth().createUserWith.......
const firestore = app.firestore() ..
and so on.

Но теперь с Firebase 9 мы просто инициализируем приложение один раз и используем этот объект в разных функциях firebase. Объекты db (firestore), storgae (облачное хранилище), auth (сервисы аутентификации) будут использоваться в других отдельных файлах.

Службы аутентификации

С firebase 9 такие функции, как

createUserWithEmailAndPassword 
signInWithEmailAndPassword
onAuthStateChanged
updatePassword 
sendPasswordResetEmail
signOut

используются как отдельные функции, в которые мы можем передавать пользовательские параметры.

В firebase 8 создание новых пользователей будет выглядеть так:

firebase.auth().createUserWithEmailAndPassword(email, password)
  .then((userCredential) => { 
    return userCredential.user; 
  })
  .catch((error) => { 
    return error;
  });

где firebase.auth — это инициализированный объект приложения.

Теперь в Firebase 9 вам нужно сделать

createUserWithEmailAndPassword(auth, email, password)
  .then((userCredential) => {
    return userCredential.user;
  })
  .catch((error) => {
    return error;
  });

где auth — это инициализированный объект приложения.

Эта же модульность была применена ко всем существующим функциям firebase. Это включает в себя функции из firestore, хранилища и аутентификации.

Другие примеры сервисов аутентификации в стиле firebase-9:

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

Служба пожарной безопасности

Служба хранения

В firebase доступно множество функций. Выше приведены наиболее распространенные, и я надеюсь, что смогу помочь вам, когда вы начнете свой новый проект Firebase. Также выше доступен репозиторий, если вы хотите клонировать, который время от времени я могу обновлять новыми функциями. Я также поделюсь кодом, который может вам понадобиться для выполнения некоторых сложных запросов при использовании службы firestore, и добавлю его в тот же репозиторий.