Enhanced/Add On | Original Demo | Enhanced Demo ...coming soon |
---|---|---|
Enhanced | Basic CSS | TailwindUI & daisyUI |
Enhanced | User CRUD | User/Admin UX Increased |
Enhanced | Auth | Auth |
Enhanced | Submission form | Added format placeholders to form |
Add On | None | Email submission on status change |
Add On | None | Admin Dashboard |
Add On | None | Statistics Chart |
Add On | None | FAQ |
Add On | None | Screenshot |
A (MERN) React Redux Toolkit full stack application with jwt authentication, CRUD operations, protected routes, and NoSQL database. Support Ticket Services application is a customer facing product support system to engage with technicians and solve encountered issues
- INTRO
- SMEAC
- TECHNOLOGIES
- LAUNCH
- ILLUSTRATIONS
- SCOPE OF FUNCTIONALITIES
- EXAMPLE OF USE
- PROJECT STATUS
- SOURCES
- OTHER INFORMATION
Once the user encounters an issue with a product then it's the support services that will improve the users overall experience. The Support Ticket Services serves as a customer facing open line of communication and product troubleshooting. When a user needs help with product support the user submit's a ticket to Support Ticket Services. A users product experience will help increase revenue and improve company reputation and business relationships.
Support Ticket Services role is to solve and report issues within 24 hours, when a product issue is encountered by a user. STS will assist in solving any reported issue hours. Once a ticket is submitted by a user, a staff member will attempt to solve it through product documentation and troubleshooting steps. A staff member and user can create a note on the ticket and close it if solved.
The user must register and log into Support Ticket Services application and submit a ticket. The user will need to select product item from the dropdown box and write a detailed description of the issue. After a ticket is submitted, a user can post additional notes.
The format includes:
- Problem Statement
- Device and Version
- Browser and Version
- Reproduction Steps
- Expected Outcome
- Actual Outcome
- Notes
- Screenshot
A staff member will see the list of tickets as a "new" and address the issue and create a note on the ticket as they are working through the debugging process. The steps for the staff member to solve the issue are included in this order:
- Utilize Product Documentation
- Reproduce The Issue
- If all resources are exhausted then escalate to jira for dev work
The application was created on a macOS BigSur version 11.6.5, MacBook Pro 13 inch with Apple M1 chip. The browser is a Google Chrome Version 100.0.4896.127 (Official Build) (arm64)
In order to handle the version control a local and remote repo were used to handle commits and branches during the project. Supporting documentation can be found in the sources
- HTML: ReactDOM.Render will pass the Single Page Application through the root element
- CSS: Styling HTML
- JavaScript/JSX: Functional Programming Language across the whole application
- React: UI Library
- Redux ToolKit: Robust State Management
- React Dev Tools
- Nodejs: Runtime
- Express: Backend Framework, handles endpoints
- MongoDB: Database stores collections
- Mongoose: ODM Object Data Mapper through Express
- Postman: Ground truthing routes and request/response objects
Version Control
- Git
- Github Repo for the remote repository IDE
- VSCODE with several extensions
Support Ticket Services launched on Heroku on 4-29-2022
Login Page Register Page New Ticket Page View All Of Users Tickets Page View One Ticket Page Add A Note
JSON Web Token
- Once the token is hashed and salted I verified it on JSON Web Token
- Next to confirm the correct user
id
was encrypted in the token, a cross check in the MongoDBuser
collection matched
- Authentication
- ...
- Registration
- Login
- JSON Web Token
- Create a ticket
- View a ticket
- Create a note
- View a note
An admin user will have future enhancements implemented see Roadmap
Currently live and Deployed to Heroku, fully functional.
The project will undergo several CI/CD improvements and testing in the dev environment, and afterwards pushed to prod via heroku main branch
This project will undergo several enhancements to include
New styling with TailwindUI- Added UI/UX for Admin/Users
- Added format placeholders to create a ticket form
- Adjusted layout
- Email submission on status change
- Admin Dashboard
- Statistics Chart using D3 API
- FAQ
- Admin role to include:
- Delete a user
- Reset a password
- Any user ticket history
- User role add ons:
- User can reset password
- User can delete account
- User history snapshot 45 days
- Support screenshots
- TBD