Booking Listings Project

Demo

1. Instructions to Run the Project

Prerequisites

• Docker & Docker Compose installed
• Node.js (for local frontend development)
• Python 3.10+ (for local backend development)
• GNU Make (install with brew install make on macOS)

Run with Docker Compose (Makefile)

1. Copy .env.example to .env and update environment variables as needed.
2. Build and start all services:

   make build
   make start
   

3. Access services:
   • Frontend (Nuxt): http://localhost:3000
   • Backend (FastAPI): http://localhost:8000
   • Database: localhost:5432

---

2. Code Structure & Folders

booking_listings/
├── backend/
│   ├── booking_listings/
│   │   ├── app/           # FastAPI app, routers, application logic
│   │   ├── db/            # Database config, DAO, models, migrations
│   │   ├── static/        # Static files
│   │   ├── log.py         # Logging setup
│   │   ├── settings.py    # App settings/config for db connection and application config
│   │   └── __main__.py    # FastAPI entrypoint
│   └── pyproject.toml     # Python project config (same as package.json on FE)
├── frontend/
│   ├── api/               # API client, DTOs, endpoints for handle BE requests
│   ├── app/               # Nuxt app root
│   ├── components/        # Vue components custom and resuable (shared) (button, data-table, pagination, etc.)
│   ├── layouts/           # Nuxt layouts
│   ├── pages/             # Nuxt pages
│   ├── plugins/           # Nuxt plugins to setup global usage like handle api request to BE
│   ├── public/            # Static assets (robots.txt, images, etc.)
│   ├── types/             # TypeScript global types
│   ├── utils/             # Utility functions for global usage
│   ├── package.json       # Frontend dependencies & scripts
│   └── nuxt.config.ts     # Nuxt config
├── environment/
│   ├── db/                # DB Dockerfile
│   ├── node/              # Node/Nuxt Dockerfile
│   └── python/            # Python/FastAPI Dockerfile
├── docker-compose.yml     # Multi-service orchestration
├── Makefile               # Common dev commands
└── README.md              # Project documentation

---

3. Things to Improve

• Improve error handling and validation in backend APIs and frontend
• Use vee-validate library for more advanced form validation on FE
• Create some individual component for button or card to make usable
• Can use long polling or websocket for more real time update