EateryCrit is an interactive web application that allows users to explore restaurants, submit reviews, and view average ratings. Some restaurants may be fictional. The app is built with React (frontend) and Flask + SQLAlchemy (backend), with full CORS support and user auth with Flask.
Made with Flask + SQLAlchemy + SQLite, along with React (TSX) + TailwindCSS + Framer Motion. Overall, I got to work with relational databases and configuring REST API endpoints to GET/POST needed data.
- Secure login and logout functionality using cookie sessions, integrated with Redis.
- Frontend communicates with Flask backend via REST API endpoints.
- Users, restaurants and reviews stored using SQLite & SQLAlchemy (relational db).
- Displays a list of restaurants fetched from the backend.
- Each restaurant shows the name, average rating, location and other information! (AI-generated images - future implementation)
- Later on, users will be able to add restaurants, so reviews can be added!
- Users can submit ratings for restaurants, ONLY given they are registered.
- Ratings are stored and displayed in real-time (dynamic updating).
- Smooth slide-up animation for welcome messages.
- Typing animation for personalized greetings.
- Subtle form popup transitions for login and review submission.
- Rocking or bouncing animations for logos to enhance UI engagement.
- A KEY concept I heavily support is responsiveness, thus...
- built with TailwindCSS for mobile-first design.
- Frontend: React, TailwindCSS, Framer Motion (animations), TypewriterJS (typing effect)
- Backend: Python Flask, Flask-CORS, SQLite/SQLAlchemy
- APIs: AI image generation (DALL·E / Stable Diffusion) -> FUTURE IMPLEMENTATION!!!
- State Management, on load: React hooks (
useState, useEffect) - React Router: Used React router to form a browser router, navigating between pages
- clone the repo! This is straightforward
Create and activate virtual environment:
python -m venv venv
source venv/bin/activate # macOS/Linux
venv\Scripts\activate # windowsInstall dependencies:
pip install -r requirements.txtRun the backend server:
python app.pyIt should bind to 127.0.0.1:5000 by default, which is used in the front-end
Navigate to frontend folder:
cd ../clientInstall dependencies:
npm installRun the development server:
npm run dev- Navigate to the login page and log in (or sign up) with valid credentials.
- Browse the restaurant list. Use filters if wanted! (In the future -> ADD RESTAURANT!)
- Click on a restaurant to view details and submit ratings.
- AI-generated images appear for fictional restaurants. -> FUTURE IMPLEMENTATIONS!
- Enjoy smooth animations and personalized greetings.