/login-react

Primary LanguageJavaScript

Login App

Preview

  • Login Screenshot from 2024-08-10 17-52-55

  • Sign Up Screenshot from 2024-08-10 18-01-51

  • Change Password Screenshot from 2024-08-10 18-01-33

  • Change Name Screenshot from 2024-08-10 18-01-41

  • Dashboard (unverified) Screenshot from 2024-08-10 17-53-35

  • Verify Email Screenshot from 2024-08-10 17-54-23

  • Email Verified Screenshot from 2024-08-10 17-54-34

  • Dashboard Screenshot from 2024-08-10 17-54-46

Features

Sign Up / Sign In with Google and / or Facebook Auth

Email Verification wih Nodemailer

State Management, Cookies

User Statistic

Technologies Used

  • Frontend: React.js with Vite

  • Backend: Node.js with Express.js

  • Database: PostgreSQL

  • State Management: Redux

Getting Started

Prequisites

  • Node.js and npm/yarn installed

  • PostgreSQL database setup

Installation

  • Clone the Repository:
git clone https://github.com/dowmar/login-react
cd login-react
  • Install Dependencies:
  • We user force for FE due to problems with meta-api
# For frontend
cd login-incit
npm install --force

# For backend
cd backend
npm install
  • Set Up Environment Variables: Create a .env file in the server directory with the following content:
DB_USER=YOUR_DB_USER
DB_PASSWORD=YOUR_DB_PASSWORD
DB_HOST=YOUR_HOST
DB_PORT=YOUR_PORT
DB_NAME=YOUR_DB_NAME
ACCESS_TOKEN_SECRET
REFRESH_TOKEN_SECRET
ENCRYPTION_SECRET
OUTLOOK_EMAIL
OUTLOOK_PASS
SERVER_URL
CLIENT_URL
CLIENT_URL2=
  • Initialize the Database:

Ensure your PostgreSQL database is set up and accessible using the connection string provided in the .env file.

  • Run the Application
# In the login-incit directory
npm run dev

# In the backend directory
npm start

Folder Structure

  • Frontend (login-incit/): Contains all React.js frontend code.
  • Backend (backend/): Contains the Express.js API and database interaction logic.

License

MIT