/call-system

πŸ“ž A website that performs call system

Primary LanguageJavaScriptMIT LicenseMIT

πŸ“ž CALL SYSTEM

Image description

πŸ”Ž The Call System or Call System is a tool used to centralize user demands. It serves to establish a management routine for these requests.

πŸ—” Check out the app: https://www.linkedin.com/in/kayke-fujinaka/

πŸ“„ Explanation

The project was carried out using the framework ReactJs connecting with Firebase which helped with authentication, registration, login and data persistence.

🎲 How ​​the Project Works

It serves to establish a management routine available to the user, having some functionalities, such as, for example, creating a ticket, registering a company, editing ticket/customer information, editing the profile, etc.

The user can create clients or companies, which will be registered within the site, being able to create calls later.

If the user wants to register a call. He needs to put:

  • Which customer needs this service. Thus, a list of some companies will appear;
  • The subject that needs to be addressed or discussed;
  • The status of the call, namely: In Open, In Progress or Answered;
  • Complete that serves to better describe the problem, aiming to have a more effective communication (Optional).

⚠️ Notes

The visitor will not have access to private routes. If you have not registered or logged in to the site. Therefore, whenever he tries to access the URL without being registered/logged in, he will be redirected to the homepage.

In addition, the user will not be able to return to the home page when already logged in. Thus, he will need to log out on the Profile page to return to the Login or Registration screen.

πŸ“ Pages

The site has a total of 5 pages, which are:

  • Login: The page to login and access the site.
  • Registration: The page that has the functionality to register users on the site and thus have access to other private pages.
  • Dashboard (Private): The page that has the functionality to record tickets.
  • New Ticket (Private): The page that has the function of adding a new ticket on the Dashboard.
  • Customers (Private): The page that has the functionality to register a company, putting the company name, CPNJ and the company address.
  • Profile (Private): The page that presents the information (name, email and avatar) of the registered user, which has the functionality to edit them, except for the email.

🎯 Steps

βœ”οΈ Global Project Styles
βœ”οΈ Adding Firebase
βœ”οΈ Login and Registration Page/Routes
βœ”οΈ Login and Registration Structuring/Styling
βœ”οΈ Dashboard Page/Route (Private Route)
βœ”οΈ Context Created
βœ”οΈ Importing Firebase Tools
βœ”οΈ Login/Register functionality with Firebase
βœ”οΈ Adding Toastify
βœ”οΈ Header component
βœ”οΈ Component Title
βœ”οΈ User Profile Page/Route (Private Route)
βœ”οΈ Profile Structuring/Styling
βœ”οΈ Edit Profile
βœ”οΈ Customers Page/Route (Private Route)
βœ”οΈ Customers\ Structuring/Styling βœ”οΈ Register a Company in Customers
βœ”οΈ Dashboard Refactoring
βœ”οΈ Dashboard Structuring/Styling
βœ”οΈ New Page/Route (Private Route)
βœ”οΈ Functions on the page for new tickets
βœ”οΈ Option to search ticket in Dashboard
βœ”οΈ Modal Structuring/Styling
βœ”οΈ Edit ticket
βœ”οΈ Finished Project --- βš™οΈ Extra ---
βœ”οΈ Adding Styled-Components

πŸš€ Technologies

πŸ“• How to use it?

Before starting, you need to have Git and Node installed.

# Clone this project
$ git clone https://github.com/Kayke-Fujinaka/Call-System

# access
$ cd call-system

# install dependencies
$ yarn or npm

# Run the project
$ yarn start or npm start

# The server will initialize in the <http://localhost:3000>

🀝 Collaborators

Thanks to the following people who contributed to this project:

Photo by Kayke Fujinaka on GitHub
Kayke Fujinaka

πŸ“ License

This project is under license. See the LICENSE file for more details.

 

Go back to top