Fullstack Project – React, MySQL, Node.js, Socket.io, – Upwork

Fullstack Project – React, MySQL, Node.js, Socket.io,

——————————————————————————————————-
General

A system for marking vacations; like and dislike, follow and unfollow

Every user who enters the website, will be able to tag the vacation with "follow", every vacation that is tagged by the user and goes through a change by the admin of the website, will change in real-time (using socket.io) for the user in the page in which he follows..

Infrastructure
1. Server side = Nodejs, express api
2. Client side = React.js

The project needs to be done on localhost (no need for hosting)

HTML + CSS
– HTML5 Structure
– Bootstrap design (optional)
 React
– Redux
– React -saga / thunk / middleware
– Container components / service component / router etc..
 NodeJS
– Using express
– Restfull App
– Socket io
 MySQL
– Design & create schema
– Queries

—————————————————————————————————————————–
Project Details

Entities on the system:
1. User: ID, first name, last name, user name, password
2. Admin: only one user in the system
3. Vacation: ID, Description, Destintatiion, Picture, Dates (when to when), price, number of followers

Permissions in the system
   1. Admin – responsible for the maintenance of the system, change vacations, add and delete vacations
   2. User – login, sign-up, monitor vacations, follow and unfollow

Login page
If the user is not logged-in, he’ll be transferred to the login page.
In the login page, they’ll be 2 options: login or register

Sign-up page
1. all fields are mandatory
2. check that the user doesn’t exist already

Main Page – Vacations
1. in this page, the vacations will be displayed in the following order: vacations that the user follows and after that vacations that the user doesn’t follow.
2. every vacation that the user follows will change in real-time when the admin changes any information on the page.
3. the information will change on the user’s page without refreshing the page (by using socket.io)

Main Admin Page
1. Available for the admin only, cannot do follow, can only do: add, delete, edit
2. for adding: the button "add vacation" at the top part of the screen, by clicking the button a modal will open or transition to the component that displays adding vacation, after saving a vacation, the admin can see the vacation in the main page and the all the users in the system.
3. for adding and deleting, icons of pencil and x (see image in the document, page 5/6)
4. admin page – reports

Admin Page – Reports
1. In this page, you need to choose a library for graphs; for example, chartjs or victory, but can be whatever you want.
2. x axis – IDs of only followed vacations.
3. y axis – number of followers per vacation (see example image on the document, page 6/6)

Project – Files
1. Backend
2. Frontend
3. Database

Delete node_modules from backend and frontend
Zip the main folder

*At least 5 vacations

Budget: $100

Posted On: January 15, 2022 18:05 UTC
Category: Full Stack Development
Skills:HTML, Redux, Bootstrap, React, MySQL, Node.js, CSS, Socket.io

Country: Israel

click to apply
Read More
All jobs | upwork.com

Scroll to Top