Vehicle Parking App

A comprehensive web-based parking management system built with Flask and Vue.js for the Modern Application Development II (MAD II) project at IITM BS Degree.

📋 Table of Contents

Overview
Features
Technology Stack
Project Structure
Prerequisites
Installation
Configuration
Usage
API Endpoints
Database Models
Celery Tasks
Contributing
License

🚗 Overview

The Vehicle Parking App is a full-stack web application that manages parking lots, spots, and vehicle reservations. It provides separate interfaces for administrators and regular users, enabling efficient parking management with real-time updates and automated reporting.

Key Functionalities:

Admin Panel: Manage parking lots, spots, and user accounts
User Interface: Reserve parking spots, view booking history, and generate reports
Real-time Updates: Live parking spot availability
Automated Tasks: Daily reminders and monthly reports
Export Features: CSV export of parking history

✨ Features

Admin Features

Create and manage parking lots
Monitor parking spot availability
View user statistics and activity
Generate comprehensive reports
Manage user accounts

User Features

Browse available parking lots
Reserve parking spots in real-time
View booking history
Receive automated reminders
Export parking history to CSV
Access monthly activity reports

System Features

JWT-based authentication
Redis caching for improved performance
Celery-based background tasks
Email notifications
PDF and CSV report generation

🛠 Technology Stack

Backend

Framework: Flask (Python)
Database: SQLite
Caching: Redis
Task Queue: Celery
Authentication: JWT

Frontend

Framework: Vue.js 3
State Management: Vuex
Routing: Vue Router
HTTP Client: Axios

Additional Tools

Email Service: Flask-Mail
PDF Generation: Custom PDF utilities
Background Processing: Celery with Redis broker

📁 Project Structure

vehicle_parking_app/
├── frontend/                    # Vue.js frontend application
│   ├── public/                  # Static assets
│   ├── src/
│   │   ├── components/          # Reusable Vue components
│   │   ├── views/              # Page-level components
│   │   ├── router/             # Vue Router configuration
│   │   ├── store/              # Vuex store modules
│   │   └── services/           # API communication services
│   └── package.json
│
├── backend/                     # Flask backend application
│   ├── models/                  # Database models
│   ├── routes/                  # API route handlers
│   ├── services/               # Business logic services
│   ├── tasks/                  # Celery background tasks
│   ├── utils/                  # Utility functions
│   ├── templates/              # Jinja2 templates
│   └── auth/                   # Authentication module
│
├── migrations/                  # Database migrations
├── scripts/                     # Utility scripts
├── requirements.txt             # Python dependencies
├── run.py                       # Application entry point
├── celery_worker.py            # Celery worker entry point
└── README.md                   # Project documentation

📋 Prerequisites

Before running this application, make sure you have the following installed:

Python 3.8 or higher
Node.js 14 or higher
npm or yarn
Redis server
Git

🚀 Installation

1. Clone the Repository

git clone https://github.com/22f3003124/vehicle-parking-app.git
cd vehicle-parking-app

2. Backend Setup

Create Virtual Environment

python -m venv venv
source venv/bin/activate  # On Windows: venv\Scripts\activate

Install Python Dependencies

pip install -r requirements.txt

Initialize Database

python scripts/create_db.py
python scripts/create_admin.py
python scripts/seed_data.py  # Optional: Add test data

3. Frontend Setup

Navigate to Frontend Directory

cd frontend

Install Node Dependencies

npm install

4. Redis Setup

Install and Start Redis

# On Ubuntu/Debian
sudo apt-get install redis-server
sudo systemctl start redis-server

# On macOS
brew install redis
brew services start redis

# On Windows
# Download and install Redis from official website

⚙️ Configuration

1. Environment Variables

Create a .env file in the root directory:

# Database
DATABASE_URL=sqlite:///parking_app.db

# Redis
REDIS_HOST=localhost
REDIS_PORT=6379
REDIS_DB=0

# JWT
JWT_SECRET_KEY=your-secret-key-here

# Email Configuration
MAIL_SERVER=smtp.gmail.com
MAIL_PORT=587
MAIL_USE_TLS=True
[email protected]
MAIL_PASSWORD=your-app-password

# Flask
FLASK_ENV=development
FLASK_DEBUG=True

2. Vue.js Configuration

Update frontend/vue.config.js for API base URL:

module.exports = {
  devServer: {
    proxy: {
      '/api': {
        target: 'http://localhost:5000',
        changeOrigin: true
      }
    }
  }
}

🎯 Usage

1. Start Redis Server

redis-server

2. Start Celery Worker

celery -A celery_worker.celery worker --loglevel=info

3. Start Backend Server

python run.py

4. Start Frontend Development Server

cd frontend
npm run serve

5. Access the Application

Frontend: http://localhost:8080
Backend API: http://localhost:5000
Admin Panel: http://localhost:8080/admin
User Dashboard: http://localhost:8080/user

Default Credentials

Admin Account

Username: admin
Password: admin123

Test User Account

Username: testuser
Password: test123

🔌 API Endpoints

Authentication

POST /api/auth/login - User login
POST /api/auth/register - User registration
POST /api/auth/logout - User logout

Admin Endpoints

GET /api/admin/parking-lots - Get all parking lots
POST /api/admin/parking-lots - Create new parking lot
PUT /api/admin/parking-lots/{id} - Update parking lot
DELETE /api/admin/parking-lots/{id} - Delete parking lot
GET /api/admin/users - Get all users
GET /api/admin/statistics - Get system statistics

User Endpoints

GET /api/user/parking-lots - Get available parking lots
POST /api/user/reservations - Create reservation
GET /api/user/reservations - Get user reservations
PUT /api/user/reservations/{id} - Update reservation
DELETE /api/user/reservations/{id} - Cancel reservation
GET /api/user/export-history - Export parking history

📊 Database Models

User Model

class User(db.Model):
    id = db.Column(db.Integer, primary_key=True)
    username = db.Column(db.String(64), unique=True)
    password = db.Column(db.String(128))
    fullname = db.Column(db.String(128))
    email = db.Column(db.String(128), unique=True)
    address = db.Column(db.String(256))
    pin_code = db.Column(db.String(10))
    is_admin = db.Column(db.Boolean, default=False)

Parking Lot Model

class ParkingLot(db.Model):
    id = db.Column(db.Integer, primary_key=True)
    prime_location_name = db.Column(db.String(128))
    price = db.Column(db.Float)
    address = db.Column(db.String(256))
    pin_code = db.Column(db.String(10))
    number_of_spots = db.Column(db.Integer)

Parking Spot Model

class ParkingSpot(db.Model):
    id = db.Column(db.Integer, primary_key=True)
    lot_id = db.Column(db.Integer, db.ForeignKey('parking_lot.id'))
    status = db.Column(db.String(1), default='A')  # 'A' for available, 'O' for occupied
    spot_number = db.Column(db.Integer)

Reservation Model

class Reservation(db.Model):
    id = db.Column(db.Integer, primary_key=True)
    user_id = db.Column(db.Integer, db.ForeignKey('user.id'))
    spot_id = db.Column(db.Integer, db.ForeignKey('parking_spot.id'))
    vehicle_number = db.Column(db.String(20))
    parking_timestamp = db.Column(db.DateTime, default=datetime.utcnow)
    leaving_timestamp = db.Column(db.DateTime, nullable=True)
    parking_cost = db.Column(db.Float, nullable=True)

🔄 Celery Tasks

Daily Reminder Task

@celery.task
def send_daily_reminders():
    """Send daily reminders to users who haven't visited or booked parking recently"""

Monthly Report Task

@celery.task
def generate_monthly_reports():
    """Generate and send monthly activity reports to all users"""

CSV Export Task

@celery.task
def export_user_parking_history(user_id):
    """Export user's parking history to CSV"""

🤝 Contributing

Fork the repository
Create a feature branch (git checkout -b feature/AmazingFeature)
Commit your changes (git commit -m 'Add some AmazingFeature')
Push to the branch (git push origin feature/AmazingFeature)
Open a Pull Request

Development Guidelines

Follow PEP 8 for Python code
Use ESLint configuration for JavaScript/Vue.js
Write unit tests for new features
Update documentation for API changes
Ensure all tests pass before submitting PR

📝 License

This project is created for educational purposes as part of the MAD II project at IITM BS Degree program.

📞 Contact

Author: Student ID 22f3003124
Institution: Indian Institute of Technology Madras (IITM)
Course: Modern Application Development II (MAD II)

🎓 Academic Context

This project is developed as part of the Modern Application Development II course curriculum, demonstrating:

Full-stack web development skills
RESTful API design
Modern frontend frameworks
Database design and management
Background task processing
Caching strategies
Authentication and authorization
Automated testing and deployment

Note: This application is developed for academic purposes and may require additional security enhancements for production use.

Name		Name	Last commit message	Last commit date
Latest commit History 14 Commits
.vscode		.vscode
__pycache__		__pycache__
backend		backend
frontend		frontend
.gitignore		.gitignore
README.md		README.md
celery_worker.py		celery_worker.py
run.py		run.py

namish18/vehicle-parking-app

Folders and files

Latest commit

History

Repository files navigation