development setup
Install Dependencies
Run these commands ek hi baar:
sudo apt update
sudo apt install openjdk-17-jdk mysql-server git -y
curl -fsSL https://deb.nodesource.com/setup_18.x | sudo -E bash -
sudo apt install -y nodejs
Check karlo versions:
java -version
node -v
mysql --version
Prerequisites
Make sure you have the following installed:
Java 17+ (for Spring Boot backend)
Maven (for building Spring Boot backend)
Node.js 18+ and npm (for React frontend)
MySQL 8+ (or any compatible database)
Docker & Docker Compose (optional for containerized setup)
Git
Check installation:
java -version
mvn -v
node -v
npm -v
mysql --version
docker -v
docker-compose -v
git --version
2️⃣ Clone the Repository
Fork and clone the project:
git clone https://github.com/YOUR_USERNAME/chattingo.git
cd chattingo
Project structure:
chattingo/
├── backend/
├── frontend/
└── README.md
3️⃣ Backend Setup (Spring Boot)
3.1 Navigate to backend
cd backend
3.2 Environment Variables
Copy example environment file:
cp .env.example .env
Edit .env with your database and server port settings:
DB_URL=jdbc:mysql://localhost:3306/chattingo
DB_USERNAME=root
DB_PASSWORD=your_password
SERVER_PORT=8081
Note: Spring Boot reads
SERVER_PORTfrom.env.
3.3 Run Backend
Option 1: Load .env and run
export $(grep -v '^#' .env | xargs)
./mvnw spring-boot:run
Option 2: Command line override (no need to change .env)
./mvnw spring-boot:run -Dspring-boot.run.arguments="--server.port=8081"
Backend should now run on:
http://localhost:8081
4️⃣ Frontend Setup (React)
4.1 Navigate to frontend
cd ../frontend
4.2 Environment Variables
Copy .env.example to .env and update API URL:
REACT_APP_API_URL=http://localhost:8081
4.3 Install Dependencies
npm install
4.4 Run Frontend
npm start
Frontend should now run on:
http://localhost:3000
5️⃣ Database Setup
Make sure your MySQL database is running. Create a database:
CREATE DATABASE chattingo;
Spring Boot will automatically create tables via Hibernate when the backend runs.
6️⃣ Common Issues & Fixes
| Issue | Solution |
| Port 8080 already in use | Use SERVER_PORT=8081 in .env or --server.port=8081 in command line |
| Frontend can't reach backend | Check REACT_APP_API_URL matches backend URL & port |
| MySQL connection error | Verify username, password, and database URL in .env |
7️⃣ Optional: Dockerized Setup
If you want to run the full project in Docker, use Docker Compose:
docker-compose up --build
It will start frontend, backend, and database automatically.
8️⃣ Tips for Development
Always start backend first, then frontend.
For port changes, use environment variables instead of hardcoding.
Check logs in terminal for errors (
./mvnw spring-boot:runornpm start).Commit your changes frequently when working on new features.
✅ Conclusion
Now you have a full development environment for Chattingo, with backend on port 8081 and frontend on port 3000. You can start coding new features, testing APIs, or experimenting with the database.
applicaiton .prpperites
spring.datasource.url=${SPRING_DATASOURCE_URL:jdbc:mysql://localhost:3306/chattingo_db?createDatabaseIfNotExist=true}
spring.datasource.driver-class-name=com.mysql.cj.jdbc.Driver
spring.datasource.username=root
spring.datasource.password=Root@123
spring.jpa.properties.hibernate.dialect=org.hibernate.dialect.MySQL8Dialect
spring.jpa.hibernate.ddl-auto=update
spring.jpa.show-sql=true
# JWT secret (fallback for local dev; override via env: JWT_SECRET)
jwt.secret=ThisIsASecureJwtSecretKeyWith32Chars
# CORS Configuration (can be overridden by environment variables)
cors.allowed.origins=${CORS_ALLOWED_ORIGINS:http://localhost:3000,http://localhost}
cors.allowed.methods=${CORS_ALLOWED_METHODS:GET,POST,PUT,DELETE,OPTIONS}
~ ~ ~