Introduction to Firebase
Firebase is a cloud service platform launched by Google. It is also an application development platform that can help you build and expand applications and games that users love. Firebase is powered by Google and trusted by millions of businesses around the world. Developers can use it to create high-quality applications faster and easier. The platform has numerous tools and services, including real-time databases, cloud functions, authentication and more. In recent years, Firebase has introduced a series of updates and new features, including concurrency properties. In this article, I will first introduce you to the features of this product and how to use it to develop a very simple application. Finally, we will explore the new concurrency options in Cloud Functions for Firebase and how it affects application development. At the 2023 Google Developer Conference, Firebase brought the latest feature updates, with the theme of creating a faster and more economical serverless API for Firebase applications . This article will lead everyone to experience the latest features. In order to accommodate those who have not used Firebase before, I will explain the use of Firebase at the beginning of this article.
Firebase features
Firebase has products and solutions for every stage of the app development journey. These include construction , release and monitoring , and interaction . When building, you can use many back-end architectures in Google to speed up application development. For example, you can use a series of applications such as Cloud Firestore, Extensions, App Check, Cloud Function, and Cloud Storage in FireBase. During the release and monitoring phase, you can use Crashlytics, TestLab, Performance Monitoring, etc. All in all, when developing in FireBase, you can use all possible applications. For example,
when you want to authenticate a new user in Firebase, using JavaScript you can write like this
Auth.auth().addStateDidChangeListener {
(auth, user) in
if let user = user {
let email = user.email
// ...
}
}
Auth.auth().signIn(withEmail: userEmail, password: password) {
(user, error) in
if let user = user {
// ...
}
}
If you are using Flutter to develop a cross-end application, you can verify new users like this.
FirebaseAuth.instance.authStateChanges().listen((User? user) {
if (user != null) {
// user is signed in
var email = user.email;
} else {
// user is not signed in
// …
}
});
await FirebaseAuth.instance.signInWithEmailAndPassword(
email: emailAddress,
password: password
);
In addition, real-time reading and writing of data is also very simple. The following code uses js to read and write data in real time.
var database = firebase.database();
// write
database.ref('users/' + userId).set(user);
// read / listen
database.child("users").on('value', function(snapshot) {
// ...
});
The above is a demonstration of some features of Firebase. Below we use a specific case to explain how to use Firebase.
Build a web application using Firebase
We use this front-end project for demonstration
https://stackblitz.com/edit/firebase-gtk-web-start
. The directory and files of the project are very simple, as follows:
On the preview page of the project, we can see a page like this
This is a static page. Below we use Firebase to implement some dynamic content, which includes:
- Authentication, login
- Data storage, save structured data to the cloud
- Protect your database with Firebase security rules
To implement these functions, we need to first create a Firebase project, log in to the console, create the project, and select some services that we want to integrate.
We need to enable these services
- Enable email login for Firebase Authentication
- Set up Cloud Firestore
Integrate Firebase into the project
In order for the front-end application to use Firebase, we need to add the Firebase library to the application. There are several ways to do this. You can add libraries from Google's CDN, or you can use npm to install them locally and package them into your application.
Add Firebase Web App to Firebase Project
We have created a Firebase project earlier, but it has not been bound to our front-end application.
Next we need to register an application in the project to bind our application.
First, in the Firebase console, enter the project overview page and click the Web icon Web application icon to create a new Firebase Web application.
Then give the application a nickname, and then generate the application configuration information,
as shown below
Find the commented line in your project Add Firebase project configuration object hereand paste the configuration snippet below below the comment.
// Import the functions you need from the SDKs you need
import {
initializeApp } from "firebase/app";
import {
getAnalytics } from "firebase/analytics";
// TODO: Add SDKs for Firebase products that you want to use
// https://firebase.google.com/docs/web/setup#available-libraries
// Your web app's Firebase configuration
// For Firebase JS SDK v7.20.0 and later, measurementId is optional
const firebaseConfig = {
apiKey: "AIzaSyAKeAjUWvpesfvHUexusvNHqJyQKB7obFs",
authDomain: "hello-world-120a5.firebaseapp.com",
projectId: "hello-world-120a5",
storageBucket: "hello-world-120a5.appspot.com",
messagingSenderId: "489836806454",
appId: "1:489836806454:web:805ea53de978c6e8a73397",
measurementId: "G-7PVT8J04NT"
};
// Initialize Firebase
const app = initializeApp(firebaseConfig);
const analytics = getAnalytics(app);
After configuring the Firebase configuration of the application, we need to implement the specific functionality and set up an RSVP button to register people using Firebase Authentication.
Add an RSVP button to the page,
<section id="event-details-container">
<!-- ... -->
<!-- ADD THE RSVP BUTTON HERE -->
<button id="startRsvp">RSVP</button>
</section>
Modify as follows in index.js
import {
getAuth, EmailAuthProvider } from 'firebase/auth';
// ...
auth = getAuth();
At the bottom of the main() function of index.js, add the FirebaseUI initialization statement as shown below
async function main() {
// ...
// Listen to RSVP button clicks
startRsvpButton.addEventListener("click",
() => {
ui.start("#firebaseui-auth-container", uiConfig);
});
}
main();
Go to the Authentication dashboard in the Firebase console. In the Users tab, we should see the account information we just entered to log into the application.
Firebase latest news
At the 2023 Google Developers Conference, Jeff Huleatt and Daniel Lee shared how to use new concurrency options in Cloud Functions for Firebase to easily and quickly run efficient and scalable server code.
This method mainly uses a Concurrencyparameter to control concurrency, which can achieve less load and fewer resources to meet more access.
The following is a comparison chart of the number of instances under the same amount of access, using concurrency and not using concurrency.
Using Concurrencyit can make great use of each instance and reduce the number of instance creation and destruction. However, when the number of concurrency is set to too large, the instance load will be too large and the client will not respond for a long time. Therefore, you need to find the concurrency number suitable for the scenario when setting up.
So much has been introduced. If you want to explore more of Google's latest development technologies and tools, welcome to the CSDN special page. Here are the keynote speeches and selected keynote speech replay videos of the 2023 Google Developers Conference to help those who were unable to attend the conference in person. You can experience the whole conference and gain new technical knowledge. https://marketing.csdn.net/p/8b1b4b3f5f0fe4c3cdf1c2d5e42a05c3
For those who want to study in depth and learn the knowledge points of the conference, the Google Developer Online Course officially created by Google is a wonderful learning platform that allows you to systematically master the new knowledge of the conference technology. , to help you learn with twice the result with half the effort. https://developers.google.cn/learn/pathways?hl=zh-cn&utm_source=csdn