GithubHelp home page GithubHelp logo

arkadina / authentication-w-react-js Goto Github PK

View Code? Open in Web Editor NEW

This project forked from hubertryanofficial/authentication-w-react-js

0.0 0.0 0.0 368 KB

Authentication with ReactJs And Firebase

JavaScript 75.45% CSS 21.98% HTML 2.58%

authentication-w-react-js's Introduction

Authentication W/ReactJs

In this project you will have a simple authentication, you can connect using auth with standard email and password, simulating a user login to be able to show your data like e-mail, full name and random motivational phrases, and you can change your profile picture for your account. Everything with Firebase Auth, Firestore and Storage.
by Hubert Ryan!

About โœ

With React Js, using the React Router Dom to send to others pages, navigating to other pages of the application and checking the user's status, whether connected or not.

The project depends on a google config of Firebase Auth Config Web, this configuration comes in the creation of a Firebase project, you can acquire it, below I will explain where to put this data for Firebase to know in which database the application is connected.

This layout design was completely developed from scratch to be a realistic and original application for anyone who is going to clone and use it.

Dependencies ๐Ÿ”ง

Below are all the dependencies that were used for this project to be completed. These three libraries were enough to make a project like this work. Firebase obviously serves as the database!

  • Firebase
  • React Router Dom
  • React Loader Spinner

Important: Soon, more updates will come! Always update this repository to be able to see news like Styled Components and others.

Getting Started ๐Ÿงจ

Install ๐Ÿ”Œ

First, you need to clone this project to an ideal location on your computer. You can clone either using the github command line or by downloading directly from the browser or the WINRAR file, after that, extract it.

$ git clone https://github.com/HubertRyanOfficial/Authentication-W-React-Js.git

or

Download direct to you computer with WINRAR or with GitHub Desktop.

Second, install all necessary project dependencies locally so that the project can run smoothly. Of course, go to the project folder before that!

$ yarn install

or

$ npm install

Run the project ๐Ÿ–ฅ

As I said above, you need to create a Firebase project and get the necessary settings for the database to work and not return any errors. They are in the folder src/config/database/firebaseConfig.js you just have to change the settings that are in the constant and nothing else!

Important: Without this configuration the application will not work!

Now just run.

$ yarn start

or

$ npm start

Now we can use and develop our project, are we going to test together with me? Let's Go!

Thank You ๐ŸŽ‰

Thank you so much for reading this repository and seeing my code shares, a huge hug! Always keep learning and updating.

By Hubert Ryan ๐Ÿ˜‹

authentication-w-react-js's People

Contributors

hubertryanofficial avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.