An Interest In:
Web News this Week
- April 16, 2024
- April 15, 2024
- April 14, 2024
- April 13, 2024
- April 12, 2024
- April 11, 2024
- April 10, 2024
Setting up your first ReactJS & Firebase Auth project
Nowadays, security is very important on websites and apps. Sometimes, developers make their own backend incorporating their own custom security methods. Other developers use various cloud platforms so that they dont need to worry about security logic, and these platforms help developers with most secure ways of authenticating users.
We are going to see how you can use Firebase auth service to secure your react APP.
Setting up Firebase
First you will need to set up our own Firebase project through the Firebase Console. To get started, navigate your browser to Firebase Console. Make sure you are logged into your Google account.
Now, click on Add project and follow the simple instructions provided. Once presented with a dashboard, click on Authentication on the sidebar and click on Get Started to enable the module. Now you will be presented with various authentication options. Click on Email/Password, enable it, and save it. We will come back later, let create our react app first.
Setting up React project
Navigate to your terminal and use npx create-react-app appname to create a new react app.
Next lets install firebase and react router dom: npm install firebase react-router-dom react-firebase-hooks
Integrating Firebase into our React app
Now lets go back to the Firebase Console dashboard, click on Project Settings. Click on the third icon (</>) to configure our Firebase project for the web. Here you will see a config file. Copy the config. Create a new file in the src folder named firebase.js, import firebase modules, and paste the config file here.
Next we will initialize our app and services so that we can use Firebase throughout our app. This will use our config to recognize the project and initialize authentication and database modules.
With this on your react app you can now start to create login and signup forms and use the firebase authentication module.
Original Link: https://dev.to/catevee/setting-up-your-first-reactjs-firebase-auth-project-4i0j
Dev To
An online community for sharing and discovering great ideas, having debates, and making friendsMore About this Source Visit Dev To