Cloud FireStore – это пылающая база данных NoSQL без серверов, идеально подходит для питания в Интернете и мобильные приложения любого размера. Возьмите полное руководство по обучению FireStore Создан, чтобы показать вам, как использовать FireStore в качестве двигателя для ваших собственных удивительных проектов спереди назад.
Оглавление
Начало работы с Firestore
- Что такое пожарное? Почему вы должны использовать это?
- Настройка FireStore в проекте JavaScript
- Огнестные документы и коллекции
- Управление нашей базой данных с консолью Firebase
Получение данных с firestore
- Получение данных из коллекции с помощью .get ()
- Подписаться на коллекцию с .onsnapshot ()
- Разница между .get () и .onsnapshot ()
- Отписаться от коллекции
- Получать индивидуальные документы
Изменение данных с FireStore
- Добавление документа в коллекцию с .add ()
- Добавление документа в коллекцию с .et ()
- Обновление существующих данных
- Удаление данных
Основные шаблоны
- Работа с подколлями
- Полезные методы firestore полей
- Запрос с. Где ()
- Заказ и ограничение данных
Примечание. Вы можете скачать PDF версию этого руководства, чтобы вы могли прочитать его в автономном режиме.
Что такое пожарное? Почему вы должны использовать это?
Firestore – это очень гибкий, простой в использовании база данных для мобильных, веб-разработки веб-серверов. Если вы знакомы с базой данных Realtime Firebase, имеет много сходств, но с другим (возможно более декларативным) API.
Вот некоторые функции, которые огнестные приносят к таблице:
⚡️Asily Получить данные в реальном времени
Как и база данных Realtime FireBase, FireStore предоставляет полезные методы, такие как .onsnapshot (), которые делают его Breze для прослушивания обновлений для ваших данных в режиме реального времени. Он делает FireStore идеальным выбором для проектов, которые размещают премию на отображение и использование самых последних данных (например, приложений чата).
Гибкость как база данных NoSQL
FireStore – очень гибкий вариант для бэкэнда, потому что это база данных NoSQL. NoSQL означает, что данные не хранятся в таблицах и столбцах как стандартная база данных SQL. Он структурирован как магазин клавиш, как будто это был один большой объект JavaScript.
Другими словами, нет схемы или не нужно описать, какие данные наша база данных будет хранить. Пока мы предоставляем действительные ключи и ценности, FireStore будет хранить его.
↕️ без усилий масштабируемый
Одним из величайших преимуществ выбора Firestore для вашей базы данных является самая мощная инфраструктура, которая она основана на том, что позволяет вам очень легко масштабировать ваше приложение. Как вертикально, так и горизонтально. Независимо от того, есть ли у вас сотни или миллионы пользователей. Серверы Google смогут обрабатывать любую нагрузку на него.
Короче говоря, Firestore – отличный вариант для приложений как маленьких, так и крупных. Для небольших приложений это мощно, потому что мы можем многое сделать без особых установок и очень быстро создавать проекты с ними. Firestore хорошо подходит для крупных проектов благодаря масштабируемости.
Настройка FireStore в проекте JavaScript
Начните с огнестойкой, мы отправимся на консоль Firebase. Вы можете посетить, что собираясь firebase.google.com. . Вам нужно будет иметь учетную запись Google для входа.
Как только мы подписали, мы создадим новый проект и дайте ему имя.
Как только наш проект создан, мы выберем его. После этого на нашем проекте приборной панели мы выберем кнопку кода.
Это даст нам код, который нам нужно интегрировать FireStore с нашим проектом JavaScript.
Обычно, если вы устанавливаете это в любом виде приложения JavaScript, вы захотите поставить это в выделенный файл под названием Firebase.js. Если вы используете любую библиотеку JavaScript, в которой есть файл Package.json, вы захотите установить зависимость Firebase с NPM или пряжей.
// with npm npm i firebase // with yarn yarn add firebase
Firestore можно использовать либо на клиенте, либо на сервере. Если вы используете FireStore с узлом, вам нужно использовать синтаксис Commonjs с требуемым. В противном случае, если вы используете JavaScript в клиенте, вы импортируете Firebase с помощью модулей ES.
// with Commonjs syntax (if using Node)
const firebase = require("firebase/app");
require("firebase/firestore");
// with ES Modules (if using client-side JS, like React)
import firebase from 'firebase/app';
import 'firebase/firestore';
var firebaseConfig = {
apiKey: "AIzaSyDpLmM79mUqbMDBexFtOQOkSl0glxCW_ds",
authDomain: "lfasdfkjkjlkjl.firebaseapp.com",
databaseURL: "https://lfasdlkjkjlkjl.firebaseio.com",
projectId: "lfasdlkjkjlkjl",
storageBucket: "lfasdlkjkjlkjl.appspot.com",
messagingSenderId: "616270824980",
appId: "1:616270824990:web:40c8b177c6b9729cb5110f",
};
// Initialize Firebase
firebase.initializeApp(firebaseConfig);Коллекции и документы Firestore
Есть два ключевых термина, которые необходимы для понимания того, как работать с FireStore: Документы и Коллекции Отказ
Документы являются индивидуальными деталями данных в нашей базе данных. Вы можете подумать о документах, чтобы быть очень похожим на простые объекты JavaScript. Они состоят из парных пар, которые мы называем поля . Значения этих полей могут быть строки, числа, логические значения, объекты, массивы и даже двоичные данные.
document -> { key: value } Наборы этих документов этих документов известны как коллекции. Коллекции очень похожи на массивы объектов. В коллекции каждый документ связан с данным идентификатором (ID).
collection -> [{ id: doc }, { id: doc }]Управление нашей базой данных с консолью FireStore
Прежде чем мы сможем начать работать с нашей базой данных, нам нужно его создать.
В пределах нашей консоли Firebase перейдите на вкладку «База данных» и создайте базу данных FireStore.
Как только вы сделали это, мы начнем в тестовом режиме и включить все чтения и записи в нашу базу данных. Другими словами, у нас будет открытый доступ для получения и изменения данных в нашей базе данных. Если бы мы могли добавить аутентификацию Firebase, мы могли бы ограничить доступ только к аутентифицированным пользователям.
После этого мы будем доставлены в саму нашу базу данных, где мы можем начать создавать коллекции и документы. Корень нашей базы данных будет серией коллекций, поэтому давайте сделаем нашу первую коллекцию.
Мы можем выбрать «Начать коллекцию» и дать ему удостоверение личности. Каждая коллекция будет иметь идентификатор или имя. Для нашего проекта мы собираемся отслеживать любимые книги наших пользователей. Мы дадим нашу первую коллекцию ID «книги».
Далее мы добавим наш первый документ с нашими новые созданные «книги».
Каждый документ также будет иметь удостоверение личности, связывая его с коллекцией, в которой она существует.
В большинстве случаев мы будем использовать опцию, чтобы дать ему автоматически сгенерированный идентификатор. Таким образом, мы можем нажать кнопку «AUTO ID», чтобы сделать это, после чего нам нужно предоставить поле, дайте ему тип, а также значение.
Для нашей первой книги мы сделаем «название» типа «строки», со значением «Великого Гэтсби» и нажмите «Сохранить».
После этого мы должны увидеть наш первый товар в нашей базе данных.
Получать данные из коллекции с .get ()
Чтобы получить доступ Firestore, используйте все методы, которые он обеспечивает, мы используем firebase.firestore () Отказ Этот метод необходимо выполнить каждый раз, когда мы хотим взаимодействовать с нашей базой данных Firestore.
Я бы порекомендовал создать выделенную переменную для хранения единой ссылки на FireStore. Это помогает сократить количество кода, которое вы пишете через ваше приложение.
const db = firebase.firestore();
Для ссылки на коллекцию мы используем .Collection () Способ и предоставить идентификатор коллекции в качестве аргумента. Чтобы получить ссылку на коллекцию книг, которые мы создали, просто перейдите в строковые «книги».
const booksRef = firebase.firestore().collection('books');Чтобы получить все данные документа из коллекции, мы можем цепи на .получать () метод.
.получать () Возвращает обещание, что означает, что мы можем решить его либо использовать .тогда () Обратный вызов или мы можем использовать синтаксис Async-enquit, если мы выполняем наш код в пределах ASYNC.
Как только наши обещания будут решаться так или иначе, мы вернемся тем, что известно как снимка .
Для запроса сбора этого снимок состоит из ряда отдельных документов. Мы можем получить доступ к ним, говоря Snapshot.docs Отказ
Из каждого документа мы можем получить идентификатор как отдельное свойство, а остальные данные, используя .данные () метод.
Вот как выглядит весь весь запрос:
const booksRef = firebase
.firestore()
.collection("books");
booksRef
.get()
.then((snapshot) => {
const data = snapshot.docs.map((doc) => ({
id: doc.id,
...doc.data(),
}));
console.log("All data in 'books' collection", data);
// [ { id: 'glMeZvPpTN1Ah31sKcnj', title: 'The Great Gatsby' } ]
});Подписаться на коллекцию с .onsnapshot ()
.получать () Метод просто возвращает все данные в нашей коллекции.
Чтобы использовать некоторые возможности реального времени Firestore, мы можем подписаться на коллекцию, которая дает нам текущую стоимость документов в этой коллекции, когда они обновляются.
Вместо использования .получать () Метод, который для запроса одного времени мы используем .onsnapshot. () метод.
firebase
.firestore()
.collection("books")
.onSnapshot((snapshot) => {
const data = snapshot.docs.map((doc) => ({
id: doc.id,
...doc.data(),
}));
console.log("All data in 'books' collection", data);
});В указанном выше коде мы используем то, что известен как в цепочке метода вместо создания отдельной переменной для ссылки на коллекцию.
Что значительно использовать Firestore, заключается в том, что мы можем цепить кучу методов один за другим, что делает для более декларативного читаемого кода.
В рамках обратного вызова OnSnapshot мы получаем прямой доступ к снижению нашей коллекции, как сейчас, и всякий раз, когда он обновляется в будущем. Попробуйте вручную обновлять наш один документ, и вы увидите, что .onsnapshot. () слушает любые изменения в этой коллекции.
Разница между .get () и .onsnapshot ()
Разница между методами Get и Snapshot заключается в том, что возвращает обещание, которое необходимо решить, и только тогда мы получаем данные снимка.
.onsnapshot. Однако использует синхронную функцию обратного вызова, которая дает нам прямой доступ к снижению.
Это важно иметь в виду, когда дело доходит до этих разных методов – мы должны знать, какие из них возвращают обещание, и которые синхронно.
Отписаться от коллекции с отписаться ()
Дополнительно обратите внимание, что .onsnapshot. () Возвращает функцию, которую мы можем использовать для отказа от подписки и прекратить прослушивание в заданной коллекции.
Это важно в тех случаях, когда пользователь, например, уходит от заданной страницы, где мы отображаем данные коллекции. Вот пример, используя реакцию библиотеки, мы называем отписаться в подписку в крючке использования.
Когда мы делаем это, это будет убедиться, что когда наш компонент не отключен (больше не отображается в контексте нашего приложения), что мы больше не прослушиваем данные сбора, которые мы используем в этом компоненте.
function App() {
const [books, setBooks] = React.useState([]);
React.useEffect(() => {
const unsubscribe = firebase
.firestore()
.collection("books")
.onSnapshot((snapshot) => {
const data = snapshot.docs.map((doc) => ({
id: doc.id,
...doc.data(),
}));
setBooks(data);
});
}, []);
return books.map(book => )
}Получение индивидуальных документов с .doc ()
Когда дело доходит до получения документа в коллекции. Процесс точно такой же, как получить целую коллекцию: нам нужно сначала создать ссылку на этот документ, а затем использовать метод Get, чтобы захватить его.
После этого, однако, мы используем .doc. () Способ присоединен к методу сбора. Чтобы создать ссылку, нам нужно сформировать этот идентификатор из базы данных, если она создана автоматически. После этого мы можем цепи на .получать () и разрешить обещание.
const bookRef = firebase
.firestore()
.collection("books")
.doc("glMeZvPpTN1Ah31sKcnj");
bookRef.get().then((doc) => {
if (!doc.exists) return;
console.log("Document data:", doc.data());
// Document data: { title: 'The Great Gatsby' }
});Обратите внимание на условное Если (! doc.exists) возвращается; в коде выше.
Как только мы вернем документ, важно проверить, существует ли он.
Если мы этого не сделаем, произойдет ошибка в получении наших данных документа. Способ проверки и посмотреть, существует ли наш документ, говоря, если doc.exists , который возвращает истинное или ложное значение.
Если это выражение возвращает false, мы хотим вернуться из функции или, возможно, бросить ошибку. Если doc.exists верно, мы можем получить данные из doc.data Отказ
Добавление документа в коллекцию с .add ()
Далее давайте перейдем к изменению данных. Самый простой способ добавить новый документ в коллекцию с .Добавить () метод.
Все, что вам нужно сделать, это выбрать ссылку на сбор (с .Collection () ) и цепочка на .Добавить () .
Возвращаясь к нашему определению документов как как объекты JavaScript, нам нужно пройти объект к .Добавить () Способ и укажите все поля, которые мы хотим быть в документе.
Допустим, мы хотим добавить другую книгу «Мышей и мужчин»:
firebase
.firestore()
.collection("books")
.add({
title: "Of Mice and Men",
})
.then((ref) => {
console.log("Added doc with ID: ", ref.id);
// Added doc with ID: ZzhIgLqELaoE3eSsOazu
}); .add Метод возвращает обещание и от этого разрешенного обещания, мы возвращаем ссылку на созданный документ, который дает нам информацию, такую как созданный идентификатор.
.Добавить () Метод AUTO генерирует удостоверение личности для нас. Обратите внимание, что мы не можем использовать это Ref непосредственно для получения данных. Однако мы можем пройти метод ref в документ для создания другого запроса.
Добавление документа в коллекцию с .et ()
Другой способ добавить документ в коллекцию с .установленный () метод.
Где набор отличается от добавления, заключается в необходимости указать наш собственный идентификатор при добавлении данных.
Это требует цепочки на .doc. () Способ с идентификатором, который вы хотите использовать. Кроме того, обратите внимание, как, когда обещание разрешено от .установленный () , мы не получаем ссылку на созданный документ:
firebase
.firestore()
.collection("books")
.doc("another book")
.set({
title: "War and Peace",
})
.then(() => {
console.log("Document created");
});Кроме того, когда мы используем .установленный () С существующим документом он будет по умолчанию перезаписать этот документ.
Если мы хотим объединиться, старый документ с новым документом вместо того, чтобы перезаписать его, нам нужно пройти дополнительный аргумент для .установленный () и предоставить имущество слияние установить правду.
// use .set() to merge data with existing document, not overwrite
const bookRef = firebase
.firestore()
.collection("books")
.doc("another book");
bookRef
.set({
author: "Lev Nikolaevich Tolstoy"
}, { merge: true })
.then(() => {
console.log("Document merged");
bookRef
.get()
.then(doc => {
console.log("Merged document: ", doc.data());
// Merged document: { title: 'War and Peace', author: 'Lev Nikolaevich Tolstoy' }
});
});Обновление существующих данных с .update ()
Когда дело доходит до обновления данных, мы используем метод обновления, например .Добавить () и .установленный () Это возвращает обещание.
Что полезно для использования .Обновить () Это, в отличие от .установленный () , он не перезаписывает весь документ. Также нравится .установленный () Нам нужно ссылаться на отдельный документ.
Когда вы используете .Обновить () , важно использовать некоторую обработку ошибок, например .catch () Обратный вызов В случае, если документ не существует.
const bookRef = firebase.firestore().collection("books").doc("another book");
bookRef
.update({
year: 1869,
})
.then(() => {
console.log("Document updated"); // Document updated
})
.catch((error) => {
console.error("Error updating doc", error);
}); Удаление данных с .delete ()
Мы можем удалить данную коллекцию документов, ссылаясь на его ID и выполнение .елет () Метод, простой как это. Это также возвращает обещание.
Вот основной пример удаления книги с идентификатором «Еще одной книгой»:
firebase
.firestore()
.collection("books")
.doc("another book")
.delete()
.then(() => console.log("Document deleted")) // Document deleted
.catch((error) => console.error("Error deleting document", error));Работа с подколлями
Допустим, мы сделали ошибку в создании нашего приложения, а вместо того, чтобы просто добавлять книги, которые мы также хотим подключить их к пользователям, которые сделали их. T
Способ того, что мы хотим реструктурировать данные, заключается в том, чтобы собрать собрание под названием «пользователи» в корневой базе данных нашей базы данных, и у «книг» – подколлекция «пользователей». Это позволит пользователям иметь свои собственные коллекции книг. Как мы устанавливаем это?
Ссылки на подколлекцию «Книги» должны выглядеть что-то подобное:
const userBooksRef = firebase
.firestore()
.collection('users')
.doc('user-id')
.collection('books');Дополнительно обратите внимание, что мы можем написать все это в течение одного .коллекция () Позвоните, используя пересылки скольжения.
Приведенный выше код эквивалентен следующим, где ссылка на сбору должна быть нечетное количество сегментов. Если нет, firestore бросит ошибку.
const userBooksRef = firebase
.firestore()
.collection('users/user-id/books');Чтобы создать саму подколлекцию, с одним документом (другой роман Steinbeck, «East of Eden») выполняет следующее.
firebase.firestore().collection("users/user-1/books").add({
title: "East of Eden",
});Затем, получение этой вновь созданной подколлекции будет выглядеть следующее на основе идентификатора пользователя.
firebase
.firestore()
.collection("users/user-1/books")
.get()
.then((snapshot) => {
const data = snapshot.docs.map((doc) => ({
id: doc.id,
...doc.data(),
}));
console.log(data);
// [ { id: 'UO07aqpw13xvlMAfAvTF', title: 'East of Eden' } ]
});Полезные методы firestore полей
Есть несколько полезных инструментов, которые мы можем схватить от FireStore, который позволяет нам работать с нашими значениями поля немного проще.
Например, мы можем генерировать временную метку, когда данный документ создается или обновляется со следующим помощником из FieldValue имущество.
Конечно, мы можем создать наши собственные значения даты, используя JavaScript, но использование сервера Timestamp позволяет нам точно знать, когда данные изменяются или созданы из самого FireStore.
firebase
.firestore()
.collection("users")
.doc("user-2")
.set({
created: firebase.firestore.FieldValue.serverTimestamp(),
})
.then(() => {
console.log("Added user"); // Added user
});Кроме того, скажем, у нас есть поле на документе, который отслеживает определенное количество, скажем, количество книг, которые пользователь создал. Всякий раз, когда пользователь создает новую книгу, которую мы хотим увеличить это на одну.
Простой способ сделать это, вместо того, чтобы сначала сделать .получать () Запрос, состоит в том, чтобы использовать другое значение для полевых значений под названием .Кремента () :
const userRef = firebase.firestore().collection("users").doc("user-2");
userRef
.set({
count: firebase.firestore.FieldValue.increment(1),
})
.then(() => {
console.log("Updated user");
userRef.get().then((doc) => {
console.log("Updated user data: ", doc.data());
});
});
Запрос с. Где ()
Что, если мы хотим получить данные из наших коллекций на основе определенных условий? Например, скажем, мы хотим получить все пользователи, которые представили одну или несколько книг?
Мы можем написать такой запрос с помощью .куда () метод. Сначала мы ссылаемся на коллекцию, а затем цепь на .куда () .
Метод, где требует три аргумента – во-первых, Поле, которое мы ищем на операторе, оператору, а затем значение, на котором мы хотим отфильтровать нашу коллекцию.
Мы можем использовать любой из следующих операторов, а поля, которые мы используем, могут быть примитивными значениями, а также массивами.
< , <= , == , > , > = , Массив - содержит , в или массив любой
Чтобы получить всех пользователей, которые отправили более одной книги, мы можем использовать следующий запрос.
После . Где () Нам нужно цепи на .получать () . После разрешения нашего обещания мы вернемся, что известно как Querysnapshot Отказ
Так же, как получить коллекцию, мы можем произойти через Querysnapshot с .карта () Чтобы получить каждый идентификатор документов и данные (поля):
firebase
.firestore()
.collection("users")
.where("count", ">=", 1)
.get()
.then((querySnapshot) => {
const data = querySnapshot.docs.map((doc) => ({
id: doc.id,
...doc.data(),
}));
console.log("Users with > 1 book: ", data);
// Users with > 1 book: [ { id: 'user-1', count: 1 } ]
});Ограничение и упорядочение запросов
Другой способ для эффективного запроса наших коллекций – ограничить их. Скажем, мы хотим ограничить данный запрос на определенное количество документов.
Если мы хотим вернуть только несколько предметов из нашего запроса, нам просто нужно добавить на .ЛИМИТ () Метод, после данной ссылки.
Если мы хотели сделать это через наш запрос для получения пользователей, которые отправили хотя бы одну книгу, она будет выглядеть следующим образом.
const usersRef = firebase
.firestore()
.collection("users")
.where("count", ">=", 1);
usersRef.limit(3)Другая мощная особенность – заказать наши запрашиваемые данные в соответствии с полями документов, используя .Сортировать по () .
Если мы хотим заказать наших созданных пользователей, когда они были впервые сделаны, мы можем использовать Ортерски Способ с «созданным» полем как первым аргументом. Для второго аргумента мы указываем, должно ли оно должно быть в порядке возрастания или убывания.
Чтобы все пользователи заказали, когда они были созданы из новейших до старейших, мы можем выполнить следующий запрос:
const usersRef = firebase
.firestore()
.collection("users")
.where("count", ">=", 1);
usersRef.orderBy("created", "desc").limit(3);Мы можем цепи .Сортировать по () с .ЛИМИТ () Отказ Для этого будет работать правильно, .ЛИМИТ () следует называться последним, а не до .Сортировать по () .
Хотите вашу собственную копию?
Если вы хотели бы иметь это руководство для будущего ссылки, Скачать Chechsheet всего пособия здесь Отказ
Оригинал: “https://www.freecodecamp.org/news/the-firestore-tutorial-for-2020-learn-by-example/”