https://github.com/daniel-oyoo/login_page
This project is a web application enabling user registration and login, with data securely stored in a MySQL database. It features client-side validation, password hashing, and session management, suitable for a mental wellness platform.
https://github.com/daniel-oyoo/login_page
css hashing node-js sql
Last synced: 3 months ago
JSON representation
This project is a web application enabling user registration and login, with data securely stored in a MySQL database. It features client-side validation, password hashing, and session management, suitable for a mental wellness platform.
- Host: GitHub
- URL: https://github.com/daniel-oyoo/login_page
- Owner: mark-bit-hub
- Created: 2025-02-22T13:00:06.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-02-28T15:40:39.000Z (over 1 year ago)
- Last Synced: 2025-02-28T20:43:47.224Z (over 1 year ago)
- Topics: css, hashing, node-js, sql
- Language: JavaScript
- Homepage:
- Size: 20.5 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
Project Title: Mental Wellness Hub - User Authentication and Data Storage
Description:
This project is a dynamic web application that allows users to register, log in, and submit forms that store data in a MySQL database. It implements client-side validation using JavaScript and secure authentication mechanisms, including password hashing and session management.
Technologies Used:
Frontend:
HTML5
CSS3
JavaScript
Backend:
Node.js
Express.js
MySQL
bcrypt (or crypto)
cors
cookie-parser
dotenv
Database:
MySQL
Setup and Installation:
Prerequisites:
Node.js and npm (Node Package Manager) installed.
MySQL server installed and running.
Git installed.
Clone the Repository:
Clone the repository from GitHub to your local machine:
Bash
git clone
cd
Install Backend Dependencies:
Navigate to the project directory in your terminal.
Install the required Node.js packages:
Bash
npm install express mysql body-parser cookie-parser cors crypto dotenv
Database Setup:
Create a MySQL database named mental_wellness (or as specified in your .env file).
Create the users table:
SQL
CREATE TABLE users (
user_id INT AUTO_INCREMENT PRIMARY KEY,
username VARCHAR(255) UNIQUE NOT NULL,
password VARCHAR(255) NOT NULL
);
Environment Variables:
Create a .env file in the root directory of your project.
Add your MySQL database credentials:
DB_HOST=localhost
DB_USER=your_mysql_username
DB_PASSWORD=your_mysql_password
DB_NAME=mental_wellness
Replace the place holder values with your own values.
Run the Backend Server:
Start the Node.js server:
Bash
node server.js
The server will start running on http://localhost:3000.
Open the Frontend:
Open the login_page/index.html file in your web browser.
Code Structure:
server.js:
Contains the Node.js/Express.js backend code.
Sets up the MySQL database connection.
Handles user registration and login routes.
Uses bcrypt (or crypto) for password hashing.
Uses cors for cross origin resource sharing.
Serves the static files.
login_page/index.html:
The main HTML file for the login and registration page.
login_page/script.js:
Contains the JavaScript code for client-side validation and handling form submissions.
Uses the fetch API to communicate with the backend.
login_page/style.css:
Contains the styling for the web page.
.env:
Contains the environmental variables for the database connections.
Key Features:
User Registration:
Allows users to create new accounts.
Hashes passwords using SHA-256 (or bcrypt) for security.
Stores user data in the MySQL database.
User Login:
Authenticates users based on their username and password.
Compares the hashed password from the database with the provided password.
Uses cookies for session management.
Client-Side Validation:
Validates user input using JavaScript.
Provides real-time feedback to users.
Secure Authentication:
Uses password hashing to protect user credentials.
Uses cookies to store session information.
Emotional Intelligence Quotes:
Displays a rotation of emotional intelligence quotes.
How to Use:
Registration:
Open the application in your browser.
Click the "Register" link.
Enter your username and password.
Click the "Register" button.
Login:
Enter your username and password.
Click the "Login" button.
Deployment:
Hosting: You can deploy this application to platforms like Heroku, AWS, or Google Cloud.
Database: Ensure your MySQL database is accessible to your deployed application.
Environment Variables: Configure environment variables on your hosting platform.
HTTPS: Use HTTPS for secure communication.
Contributing:
Fork the repository.
Create a new branch for your feature or bug fix.
Submit a pull request.
DEBUGGING
Debugging and Troubleshooting:
1. Common Errors and Solutions:
net::ERR_CONNECTION_REFUSED (Frontend):
Cause: The backend server is not running, or the port is incorrect.
Solution:
Verify that the Node.js server is running (node server.js).
Check the port number in your fetch requests and ensure it matches the server's port.
Temporarily disable firewalls.
404 (Not Found) (Frontend):
Cause: The requested route (e.g., /register, /login) is not defined in the backend.
Solution:
Check your server.js file and ensure the route is defined using app.post('/register', ...) or app.post('/login', ...).
Verify the URL in your fetch requests.
SyntaxError: Unexpected token '<', "