Overview of My Submission
STACKER
Is a software that helps businesses to easily track communications between customer service agents and clients.It uses REDIS
to store data(issues submitted by clients). It is integrated with a chat developed using socketIO
. This Project comes with apython(Flask) API
and a Vue,Vite Application
.The user interface was built using tailwindCss
.
Basic Functionality:
- As a client, you create an account or register.
- Access the dashboard
- Create an Issue(the issue will be added to a queue)
- On the customer service agent side.
- Login to the system.
- You will see a dashboard with a list of Issues to be attended.
- Those that are already being attended by other agents, will be indicated in red.
- Attend an issue with a green background.
- To attend an issue, click go to chat. It will redirect you to a chat where you can communicate with a client.
- The client will be notified when the issue is being attended.
- If an issue has been completed, it is CLOSED.
- If it is under investigation, it is ARCHIVED.
- Otherwise, it is left OPEN / in PROGRESS.
- On the dashboard, the client and the customer service agent will be able to see their issues -open,closed and archived.
Why this?:
We want to provide a simple way for customer representative agents to handle multiple clients at the same time seemlessly, using a chat and a queuing system.
Where we used redis.
((as a primary database using RedisJson
Module through Redis OM Python
))
- Storage of chat information - messages
- Storage of Issues
- Storage of user data
Submission Category:
Wacky Wildcards
Overview video (Optional)
Link to Code
emacliam / REDIS-HACKERTHON---CRM
Customer Relationship Management Application
Overview of Project
STACKER
Is a software that helps businesses to easily track communications between customer service agents and clients.It uses REDIS
to store data(issues submitted by clients). It is integrated with a chat developed using socketIO
. This Project comes with apython(Flask) API
and a Vue,Vite Application
.The user interface was built using tailwindCss
.
Basic Functionality:
- As a client, you create an account or register.
- Access the dashboard
- Create an Issue(the issue will be added to a queue)
- On the customer service agent side.
- Login to the system.
- You will see a dashboard with a list of Issues to be attended.
- Those that are already being attended by other agents, will be indicated in red.
- Attend an issue with a green background.
- To attend an issue, click go to chat. It will redirect you to a chat where you can communicate with a client.
- The client will…
Languages Used:
Javascript(Vue,js)
html
Tailwindcss
Python
Screen screenshots
Landing Page
Dashboard Page
Chat Page
How it works
How the data is stored:
Data is stored using RedisJSON
module in DB and RedisOM Python
as a client library
- Store (Add):
model_instance = ModelName(key1=value1, key2=value2, ..., keyN=valueN)
model_instance.save()
Code Example:Database Schema
Issues
class Issue(EmbeddedJsonModel, JsonModel):
subject: Optional[Optional[str]] = Field(index=True)
description: Optional[str] = Field(index=True)
issue_status: Optional[str] = Field(index=True)
sender: Optional[str] = Field(index=True)
created_at: Optional[str] = Field(index=True)
record_status: Optional[str] = Field(index=True)
Messages
class Message(JsonModel):
issue: Optional[Optional[str]] = Field(index=True)
sender: Optional[str] = Field(index=True)
sender_data: User
issue_data: Issue
message_body: Optional[str] = Field(index=True)
User
class User(EmbeddedJsonModel, JsonModel):
first_name: Optional[str] = Field(index=True)
last_name: Optional[str] = Field(index=True)
role: Optional[str] = Field(index=True)
created_at: Optional[str] = Field(index=True)
record_status: Optional[str] = Field(index=True)
How the data is accessed:
Get:
model_instance = ModelName.find((ModelName.field1=="value1")&(ModelName.field2=="value2"))
- to filterby field1's and field2's values.Update:
model_instance = ModelName().get(model_instance_id)
model_instance.field1 = new_value1
model_instance.field2 = new_value2
model_instance.fieldN = new_valueN
model_instance.save()
Code Example: How to access/get user data
def get_users():
try:
users = User.find(User.record_status=="ALIVE").all()
users_list = []
for user in users:
user_dict = {}
for x in user:
user_dict[x[0]] = x[1]
users_list.append(user_dict)
return jsonify({
"status_code": "200",
"status": "success",
"message": "users_retrieved_ok",
"data": users_list
})
except:
traceback.print_exc()
return jsonify({
"status_code": "500",
"status": "error",
"message": "failed_to_retrieve_users",
"data": [],
})
How to run it locally?
Backend
- Prerequisites:
Python 3.8.2
- Local Installation Steps:
- clone repo
- access folder titled "CRM BACKEND"
- add ".env" file in the root directory of the project and add the line:
-> "REDIS_OM_URL=[URL_TO_REDIS_CLOUD]"
- create and activate virtual environment in the root directory using the command (on Windows 10 cmd):
-> "python -m venv [ENVIRONMENT_NAME]"
-> "[ENVIRONMENT_NAME]\scripts\activate"
-install project packages in the active environment using the command (on Windows 10 cmd):
-> "pip install -r requirements.txt"
-run flask API using the command (on Windows 10 cmd):
-> "flask run"
-it should give an output like:
* Debug mode: on
* Running on localhost:[PORT_NUMBER]
* Restarting with stat
* Debugger is active!
* Debugger PIN: [DEBUGGER_PIN]
Frontend
- Prerequisites:
Node.js >= 14
- Local Installation Steps:
- clone repo
- access folder titled "CRM FRONTEND"
- run "YARN INSTALL"
- In the project folder, there is a file "config.js".change url to your backends server url.
- run "YARN DEV" to run the project
- To expose host on a network run with --host flag eg:"YARN DEV --host"
Prerequisites
Node.js >= 14
Python 3.8.2
Redis Cloud Account
Additional Resources / Info
Architecture
Model
Collaborators
Role: Python Developer
On this Project, he developed a python Api using flask
Me
Role: Front End Developer
On this project, i developed a vue.js application
Deployment
We recommend running this project Locally following the steps above
License
APACHE
Top comments (0)