Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/saphalpdyl/pixel-mail
An email application built almost from scratch with authentication , encryption , saved login and so on. Full stack app with SQL Database, Node backend and React Front end
https://github.com/saphalpdyl/pixel-mail
html-css-javascript jwt-authentication mariadb nodejs sql
Last synced: 12 days ago
JSON representation
An email application built almost from scratch with authentication , encryption , saved login and so on. Full stack app with SQL Database, Node backend and React Front end
- Host: GitHub
- URL: https://github.com/saphalpdyl/pixel-mail
- Owner: saphalpdyl
- Created: 2023-03-09T05:27:55.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2023-10-29T15:07:13.000Z (over 1 year ago)
- Last Synced: 2024-11-27T11:18:37.579Z (2 months ago)
- Topics: html-css-javascript, jwt-authentication, mariadb, nodejs, sql
- Language: JavaScript
- Homepage:
- Size: 944 KB
- Stars: 1
- Watchers: 1
- Forks: 1
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
![]()
# PIXEL Mail
An open-source web application that I have built as a learning project using React and Node.js. As a student and self-taught programmer, I have created this application to improve my skills and gain practical experience in web development and SQL.PIXEL Mail is a simple email service that allows users to send and receive emails through a clean and modern user interface. It's a great project for anyone who is looking to learn how to build a full-stack web application from scratch.
This application is a work-in-progress, and I'm constantly making improvements and adding new features. If you're interested in contributing to the project, feel free to fork the repository and submit a pull request. Your feedback and contributions are greatly appreciated!
[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
![](https://img.shields.io/github/actions/workflow/status/saphalpdyl/Gmail_Clone-using-SQL/lint.yml)## Server Environment Variables
PIXEL Mail server uses the following environment variables for configuration:
- **DB_HOST**: the hostname of the MariaDB server
- **DB_USERNAME**: the username for accessing the MariaDB
- **DB_PASSWORD**: the password for accessing the MariaDB
- **DB_NAME**: the name of the MariaDB
- **JWT_SECRET**: the secret key for JSON Web Tokens (JWT) used for authentication and authorizationMake sure to set these variables before running the server. You can use a `.env` file to store these variables locally or set them directly in your hosting environment.
## MariaDB Structure
### Table 1: UsersThis table stores information about registered users of the PIXEL Mail application.
| Column Name | Data Type | Description |
| --- | --- | --- |
| `id` | INT | Unique identifier for each user |
| `email` | VARCHAR(255) | Email address of the user |
| `password` | VARCHAR(255) | Encrypted password of the user using `bcrypt` package |
| `username` | VARCHAR(255) | Display name of the user |### Table 2: Emails
This table stores information about the emails sent and received by the users.
| Column Name | Data Type | Description |
| --- | --- | --- |
| `id` | INT | Unique identifier for each email |
| `sender_email` | VARCHAR(255) | Email address of the sender |
| `receiver_email` | VARCHAR(255) | Email address of the receiver |
| `content` | TEXT | The body of the email |
| `sent_at` | DATETIME | The date and time the email was sent |
| `sender` | VARCHAR(255) | The display name of the sender |## Tech Stack
PIXEL Mail is a web application that uses React for the front-end development, and Node.js with Express as the back-end server. MySQL is used for data storage and management.- Front-end: **React**
- Back-end: **Node.js** with **Express**
- Database: **MariaDB**## Screenshots
### Home
![Screenshot from 2023-03-29 22-30-41](https://user-images.githubusercontent.com/69297872/228610818-38e38462-4b92-497c-b4a6-261df17240f3.png)### Login
![Screenshot from 2023-03-29 22-29-19](https://user-images.githubusercontent.com/69297872/228610684-0cf2166f-5d50-4f79-8826-02388ebf19bb.png)### Register
![Screenshot from 2023-03-29 22-29-11](https://user-images.githubusercontent.com/69297872/228610731-532a4cc9-5d2d-45f6-8dfb-58716391747f.png)