Improving restaurant operations and customer satisfaction through data-driven decision making (part -2)

The part one :

Improving restaurant operations and customer satisfaction through data-driven decision making

Step 2: API Creation for Data and Model (CRUD-based):

After developing our sentiment analysis model, the next crucial step is integrating it into our application through an API. This API serves as a versatile service that can be utilized in various contexts, including mobile apps, IoT devices, and web applications. It complements our basic restaurant review system, enhancing the application’s functionality. The sentiment analysis service classifies reviews as negative or positive, and we also store this data in a database alongside other relevant information.

To achieve this, we need to define our technology stack and architectural design to offer a ready-to-use product for our clients. Here’s a breakdown of our tech stack:

Backend:
- Language:Python
- Framework:Flask
- Database: PostgreSQL
- API Testing & Debugging:Postman

Frontend:
- Languages:HTML, CSS, JavaScript
- Library/Framework: ReactJS
- Caching: Index DB
- CSS Framework: Tailwind

Deployment:
- Docker

Now that we have our initial stack in place, our next task is to optimize our data model for effective management of customers, restaurants, and review data. This optimization will ensure scalability to accommodate future requirements.

Data Model and ER Diagram:

The sql required for table creation is present at: sql

We have chosen PostgreSQL as database because PostgreSQL offers robust data integrity, ACID compliance, and extensibility for versatile database applications.

The architecture diagram is displayed down:

Now we have to develop the api routes and data integration into them. Due to this step we can have a working prototype ready for backend. First let me define folder structure

The Api folder has routes folder which has business logic of various Api endpoints. The routes are given in format <type of request>: <api end point> : <what the api really does>

Review routes:

• Get: /api/getResSpecificData/:id : this route returns data analytics based required data for given id of restaurant
• Get: /api/reviews/:id : get all reviews for specified restaurant id
• Get: /api/reviews : get all reviews of all ids
• Post: /api/sentiment : Returns sentiment of given review
• Post: /api/reviews : create a review for given restaurant id from given customer id
• Put: /api/reviews/:id : update specific review (this should not be given to restaurant owner as it can be abused)
• Del: /api/reviews/:id : delete specific review (this should not be given to restaurant owner as it can be abused)

Customer route:

• Get: /api/customers : get all customers
• Get: /api/customers/:id : get customer of specific id
• Post: /api/customers : create customer profile
• Post: /api/customers/:id : put/update data customer of specific id
• Delete: /api/customers/:id : Delete customer of specific id

Restaurant route:

• Get: /api/restaurants: get all restaurants
• Get: /api/restaurants /:id : get restaurants of specific id
• Post: /api/restaurants: create restaurants profile
• Post: /api/restaurants /:id : put/update data restaurants of specific id
• Delete: /api/restaurants /:id : Delete restaurants of specific id

The model folder In api folder has db related model. The model specides the sttrcuure and methods on database class, it is done using sql-alchemy as db orm . Provided is an example

from flask_sqlalchemy import SQLAlchemy 
 
from models import db 
 
class Customer(db.Model): 
    id = db.Column(db.Integer, primary_key=True) 
    name = db.Column(db.String(100), nullable=False) 
    email = db.Column(db.String(100), unique=True, nullable=False) 
    username = db.Column(db.String(15))

All code can be seen at github,

Step 3:Frontend creation

As we have decided to react js as frontend, for creation react js application you should have node installed. If you don’t have it head to the website and download it.

For creating React +vite js application we have to run command

npm create vite@latest

Name your application and after creation cd into application. The steps command will be provided please follow them. For tailwind setup please follow this page . Provided are reasons for using react with Vite and tailwind

• Lightning-Fast Development: Vite’s rapid hot module replacement paired with React speeds up development significantly.
• Efficient UI Creation: Tailwind CSS simplifies responsive and modern UI design with utility classes.

We have to install react router dom with this command “npm install react-router-dom”, if you are just cloning my repo then just get in my frontend folder which is “sentiment-front” and run “npm install”

After successful creation of your react app you’ll have this folder structure in frontend

Now create these files in src :these files will contain our code for frontend, you can change names as your choice, but the imports will change as per that, so keep that in mind

We have 3 things to implement,

• Api calls to backend for data sending and receiving and handing the response from server,
• state management and component update,
• error and long response rate handling

The api calls are made using javascipt’s native fetch api. The fetch api with using async and await rovides a very simple and straight forward approcah for api calling, response and error handling. Given below is the code for fetching data from api.

States :

const [BarPlotData, setBarPlotData] = React.useState([{ key: [{ count: "", value: "" }] }]) 
const [Labels, setLabels] = React.useState() 
const [ResName, setResName] = React.useState(1) 
const [isLoading, setIsLoading] = React.useState(true); 

Api call example :

const result = async () => { 
 try { 
 const res = await (await fetch(`${import.meta.env.VITE_WEB}/api/getResSpecificData/${ResName}`)).json() 
 if (res) { 
 setBarPlotData(res[0]); 
 setLabels([res[1]]); 
 setIsLoading(false); 
 } else { 
 setIsLoading(true); 
 } 
 
 } catch (error) { 
 console.log(error) 
 setIsLoading(true); 
 } 
 } 
 
 React.useEffect(() => { 
 result() 
 }, [ResName])

The ss of the website after creation are given below, if you want to visit it yourself use click here

The review page

The analytics page

After creation of the frontend, you can use multiple platforms for deployment and wherever you deploy do not forget to provide a .env variable as your base URL. For this demo purpose I used netlify for website deployment, it is faster and easier for small scale application and free plan available

Docker deployment of the backend :

Create docker file in root folder of your project and put this inside

# Use the official Python base image 
FROM python:3.9 
 
# Set the working directory inside the container 
WORKDIR /app 
 
# Copy the necessary files into the container 
COPY Api ./Api 
COPY models ./models 
COPY Dockerfile /app 
COPY Api/app.py /app 
COPY Api/.env /app 
COPY Api/config.py /app 
 
# Install the required Python packages 
RUN pip install - no-cache-dir flask gunicorn flask-cors pandas nltk python-dotenv psycopg2 aiohttp Flask-SQLAlchemy scikit-learn==1.3.0 flask-cors 
RUN pip install gunicorn Flask[async] 
 
# Expose the port on which the Flask app will run (adjust if necessary) 
EXPOSE 5000 
 
# Define the command to run your application 
CMD ["gunicorn", "app:app", " - bind", "0.0.0.0:5000"]

Deployment and Conclusion:

After creating the backend, you have several deployment options. Don’t forget to include a .env file. For this demo, I used Render for API deployment due to its speed and ease of use for small-scale applications with a free plan available. However, you can also consider platforms like Google Cloud, AWS ECS, ECR, Azure, and more. Feel free to reach out for a demo if interested.

With this, our project is complete and ready to be delivered to your client. Throughout this project, we’ve worked with various technologies, including Python, SQL, JavaScript, and various frameworks, enhancing our development skills. I welcome any advice or criticism you may have.

There’s immense potential for further development, such as

• Restaurant recommendation,
• Better analytics
• Quarter wise excel file downloading,
• User auth and better way of user privacy

If you’re a business owner or professional interested in collaborating to enhance your business, please reach out to me at joshiharsh0506@gmail.com. This project showcases a basic demo of my skills, and I’m open to collaborating on more ambitious ventures.

If you’re a fellow developer, a business or management enthusiast, and you’d like to contribute to this project or create something new together, please don’t hesitate to contact me.

The part one :

Improving restaurant operations and customer satisfaction through data-driven decision making

About myself:

I’m Harsh Joshi, currently pursuing my master’s in AI and ML with a solid year of project development experience. My curiosity drives me to embrace new challenges and amalgamate diverse elements to achieve results. I firmly believe in approaching personal projects from a business perspective, striving to deliver practical and valuable solutions.

• 📧 Email: joshiharsh0506@gmail.com
• GitHub: harsh0506
• Portfolio Website: harshjcodes.netlify.app
• LinkedIn: Harsh Joshi