Frontend Tattoo Studio

Welcome to the frontend part of my tattoo studio.

Table of Contents

1. Description
2. Objetive
3. Stack
4. Local installation
5. Endpoints
6. Development
7. Contact

Description

This project is dedicated to the creation of the Frontend that will interact with our Backend, which handles the operations of the tattoo studio. We will develop pages that will allow users to register and log in, access and update their profile, and review their scheduled appointments. In addition, sections will be implemented to check available services and schedule new appointments. We will also include an administration panel that will allow to manage and update the application information as needed.

Objetive

The goal of this project is to create an interface for the application that is adaptable and allows access and use by clients, professionals, as well as an administrator. For this, I am using React, with the intention of fully mastering this tool.

Stack

Local installation

1. Clone this repository:

$ git clone https://github.com/SantiagoAlfaroMarti/Frontend_Tattoo_Studio_React.git

2. Install node modules: $ npm install -y
3. $ docker run -d --name mysqlc -p 3306:3306 -e MYSQL_ROOT_PASSWORD=root -v mysql_data:/var/lib/mysql mysql
4. Connect this repository with our database:

• DB_HOST=localhost
• DB_USER=root
• DB_PASSWORD=root
• DB_NAME=your_database_name
• DB_PORT=3306

5. $ npm run migrations
6. $ npm run db:seed
7. $ npm run dev

Endpoints

Authentication

Method	URI	Action	Auth	Body
POST	/api/auth/register	Register user	N/A (public)	{ "email": "youremail@email.com", "password_hash": "yourPassword" }
POST	/api/auth/login	Login user	N/A (public)	{ "email": "youremail@email.com", "password_hash": "yourPasswordHashed" }

Users

Method	URI	Action	Auth	Body
GET	/api/users	View all users	Token (superadmin)	N/A
GET	/api/users/profile	View user profile	Token (user)	N/A
PUT	/api/users/profile	Update user profile	Token (user)	{ "first_name": "newFirstName", "last_name": "newLastName", "email": "newEmail", "password_hash": "newPassword" }
DELETE	/api/users/:id	Delete user	Token (superadmin)	N/A

Appointments

Method	URI	Action	Permissions	Body
POST	/api/appointments	Create appointment	Token (user)	{ "appointment_date": "year-month-dayThour:minute:secondZ", "service_id": 2 }
PUT	/api/appointments	Update my appointment	Token (user)	{ "id": appointmentId, "appointment_date": "newDate", "service_id": "newService" }
GET	/api/appointments/:id	Retrieve appointment	Token (user)	N/A
GET	/api/appointments	View my appointments	Token (user)	N/A
DELETE	/api/appointments/:id	Delete appointment	Token (user)	N/A

Services

Method	URI	Action	Permissions	Body
GET	/api/services	View all services	N/A (public)	N/A
POST	/api/services	Create service	Token (superadmin)	{ "service_name": "serviceName", "description": "serviceDescription" }
PUT	/api/services/:id	Update service	Token (superadmin)	{ "service_name": "newServiceName", "description": "newDescription" }
DELETE	/api/services/:id	Delete service	Token (superadmin)	N/A

Roles

Method	URI	Action	Permissions	Body
GET	/api/roles	View all roles	Token (superadmin)	N/A
POST	/api/roles	Create role	Token (superadmin)	{ "id": roleId, "name": "roleName" }
PUT	/api/roles/:id	Update role	Token (superadmin)	{ "id": newRoleId, "name": "newRoleName" }
DELETE	/api/roles/:id	Delete role	Token (superadmin)	N/A

Development

const developer = "SantiagoAlfaro";

console.log("Developed by: " SantiagoAlfaro);

Contact

• Santiago Alfaro Martí
  • GitHub