Coder Social home page Coder Social logo

trendingtechnology / uni-auth-model Goto Github PK

View Code? Open in Web Editor NEW
1.0 1.0 0.0 222 KB

Auth model created by Using nodeJs for backend & reactJs for frontend with the help of TailwindCss in styling

JavaScript 98.32% HTML 0.95% CSS 0.20% Handlebars 0.53%

uni-auth-model's Introduction

project cover

The Universal Auth System

Using The MERN Stack Including Mysql

--> The project is divded to two separte projects

1- The Client side ->

  • containing the react project Front-End
  • the client Auth Functions and storing user tokens methods
  • powered with the Tailwind CSS frameWork for styling perposes
  • using JWT package to create, handle, decode tokens
  • Axios package used to create the http requests & hnadling the connections between the back,front servers

2- The Server side ->

  • containing the Node project Back-End
  • The server Auth Main Functions --> Register, login, logout
  • verfiy mail by sending otp from the server to the client mail Using NodeMailer
  • Forget password by sending new pass from the server to client mail & ask him to change it once logged in again
  • update Client account Password & verfiy the user before updating using JWT Verfiy
  • Refresh Tokens function to update user Access token in case of expiration

Setup Steps

  • install Docker And init the docker compose file included in the project --> Optinal (you can use your favorate mysql database)
  • create db for your project in phpmyadmin interface
  • init the db.sql file included in the root of the project by copying it in the sql section on phpmyadmin it will create all the tables for you
  • open sever-side project
  • init npm install command in it to install necessary packages included in the packages.json file
  • create the .env file on the project and you will fint a .env example file in the project root compy it and place your info in it

---> you should create somthing like that

DATABASEHOST = 'db host'
DATABASEUSER = 'db username'
DATABASEPASSWORD = 'db password'
DATABASE = 'db name'

JWT_SECRET = 'JWT secret' // commoly we use HS256
,JWT_REFRESH_SECRET = 'JWT refresh secret' // commoly we use RS256
,JWT_EXPIRES_IN = 'expriration  time' // see the jwt package docs for more info about that 

PORT = 5000 // change it if you want to use another port

MAIL_SERVER = Gmail // for testing i use a new gamil made for dveloping only and enabel the low applications securty acess to be able to send from it by nodemailer
MAIL_USER = 'your email'
MAIL_PASS = 'email password'
  • init command npm start in the terminal
  • start Testing and add-on the rest of your project
after finishing from the back it's time for the front -->
  • open teh project in another directory
  • init npm install command to install the nesscary packages
  • init npm start command to start your front-end server
  • now you have your front & back sides workig fine
  • Well done... now it's time to start building your project and impress the world with your ideas
ps:
  • The system might have some problems if founded please report it to me so I can fix it in the future
  • please if there is any comments for better exprenice or security send to me to help the system be better for the other developers
  • the technolgy which used to create the server is Express Genertaor you can check it out from here
  • in the server mailing section you can use your personal Gmail account to send the mails for testing but you need to Allow security option in Gmail called Allow less secure apps as i metion in the .env file setup

Used Techs Reference:

# Technology Description
1 Node.js javascript frame work
2 express.js server creator and handler package
3 react.js the main front end framework
4 tailwindcss the styling css framework
5 JWT json web tokens used to create and handle access tokens
6 axios the http request handler package
7 bcrypt package to encrypt passwords
8 nanoid the package used to create ids
9 dotenv used to storing secret varaibles
10 nodemon for server handling
11 docker used to init the mysql & phpmyadmin containers

uni-auth-model's People

Contributors

mahmoud-bebars avatar

Stargazers

 avatar

Watchers

 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.