This administration system allows you to manage the information about your events, salespersons and clients (CRUD). Also, you can create a unique link for each salesperson to sell tickets and generate a secure QR ticket for each client (npm crypto and qrcode). I applied the PERN stack to carry out this project, creating a rest API with Nodejs-Express and a client with Reactjs. I chose these technologies to meet the requirements and apply a relational database with PostgreSQL. Finally, I use Cloudinary to store payment receipts in the cloud.
username: admin
password: 12345
username: security
password: 12345
This image describes the process of a customer going to an event.
- node: 16.15.0
- npm: 8.5.5
- express: 4.18.1
- react: 18.2.0
- pg: 8.7.3
- Download and install Node.js
- Download and install PostgreSQL
- Download and install Postman
First clone the repository with the following commands:
git clone https://github.com/parduccinward/qr-ticket-management-system.git
cd qr-ticket-management-system/
code .Then start the application by installing npm on both the project root folder and the frontend folder, using the following commands:
npm i
npm run devThe node server.js should start listening on port 4000.
npm i
npm startThe client should start in the browser at port 3000.
Depending on the operating system you are using, follow the following guidelines to enter PostgreSQL:
Once inside the psql command line, we create the database by executing the create-database.sql file contained in the models folder. Again, this is done depending on the operating system as follows:
Linux
postgres=# \i /yourpath/qr-ticket-management-system/models/create-database.sql
Windows
postgres=# \i 'C:/yourpath/qr-ticket-management-system/models/create-database.sql'
After running this command, you should get this response:
CREATE DATABASE
You are now connected to database "ticketmanagement" as user "youruser"
CREATE TABLE
CREATE TABLE
CREATE TABLE
CREATE TABLE
To check that all the tables were created correctly we can use the command \dt
To create different users, use Postman to consume the /api/auth/register API endpoint, sending a JSON body:
Admin users can be created with the role 5150.
{
"username": "admin",
"password": "12345",
"role": "5150"
}Security guards users can be created with the role 2001.
{
"username": "security",
"password": "12345",
"role": "2001"
}Make sure to momentarily disable the verify JWT middleware while creating users, in ./routes/users.js as follows:
// from this
router.post("/register", verifyJWT, registerUser);
// to this
router.post("/register", registerUser);In order for customers to securely upload their payment receipts, we use Cloudinary as a cloud repository. I highly recommend this approach because is free and secure.
Create an account on the official Cloudinary registration page. Then go to your dashboard and copy the following credentials:
- Cloud Name
- API Key
- API Secret
To complete the installation, we need to create an .env file in the root directory and enter the following credentials:
FRONTEND_ORIGIN="http://localhost:3000"
PORT=4000
PGHOST="localhost"
PGUSER=postgres
PGDATABASE=ticketmanagement
PGPASSWORD=*yourpostgrespwd
PGPORT=5432
ACCESS_TOKEN_SECRET=*youraccesstoken
REFRESH_TOKEN_SECRET=*yourrefreshtoken
CLOUDINARY_CLOUD_NAME=*yourcloudname
CLOUDINARY_API_KEY=*yourcloudinaryapikey
CLOUDINARY_API_SECRET=*yourcloudinaryapisecret- The PG variables are the credentials you have in the PostgreSQL installation.
- The Cloudinary variables are the ones we copied in the previous step.
- Tokens are created using the following code one at a time for each token.
We enter node by typing node in a terminal an then:
require("crypto").randomBytes(64).toString("hex");
The following image corresponds to the entity relationship model of the project:
- Create secure QRs
- Auth using JWT
- Create private routes
- Responsive design
- Validate fields on backend
- Show number of clients for each Salesperson
This project uses the MIT license, please see the LICENSE file for more information.