ChatApp is a web application designed to challenge players' reaction times and accuracy. The application leverages the Flask framework on the server side and React on the client side, with socket communication to provide real-time interactivity. Players participate in a game where they must click on a moving target as quickly as possible, testing their reaction speed and aiming skills.
- React with JavaScript for the frontend, including:
- React router with v6 for handling the client-side routing,
- React redux for the app-wide state management,
- Material UI for creating the UI.
- React Socket.io for real-time communication with the server.
- Flask for the backend, including:
- Flask-Smorest used to serialize and deserialize data,
- Flask-JWT-Extended for authenticating the user,
- Flask-SQLAlchemy as our database ORM,
- Flask-Migrate for the SQLAlchemy database migrations.
- Flask-Socketio for the instant communication with the client.
- Sqlite for our in-memory database.
-
Running the server on localhost:5000 (make sure you are in the server directory).
- create the virtual environment, activate it, and install the dependencies.
python -m venv venv venv\Scripts\activate pip install -r requirements.txt
- add the .env file with the environment variables.
DATABASE_URL = "sqlite:///database.db" JWT_SECRET_KEY = "your_secret_key" DEBUG_MODE = 1
- create the database tables from the migrations and run the application.
flask db upgrade python run.py
- create the virtual environment, activate it, and install the dependencies.
-
Running the client on localhost:3000 (make sure you are in the client directory).
- install the dependencies and run the application.
npm install npm start
- install the dependencies and run the application.