Building MovieSync in Public (with Antigravity) 🎬🚀
Building in public means sharing not just the outcome, but the tools and decisions behind it. While creating MovieSync, I also leveraged Antigravity to accelerate development and deployment, making the project faster to ship and easier to scale.
*The Problem
*
Movie intermissions are short, but queues are long. Whether it’s the washroom or food counter, people waste valuable break time waiting. There’s no visibility into crowd density, and decisions are made blindly.
*The Idea
*
MovieSync is a real-time venue dashboard that shows crowd levels across different areas using simple color indicators. Users can instantly decide where to go and avoid congestion.
Tech Stack
- 1. React + Vite (Frontend)
- 2. Vanilla CSS (Glassmorphism UI)
- 3. Docker (Multi-stage build)
- 4. Nginx (Static hosting)
- 5. Google Cloud Run (Serverless deployment)
- 6. Antigravity (Rapid development & cloud workflow acceleration)
- 7. Frontend Architecture
I built the UI with React and Vite to keep it lightweight and fast. Instead of using heavy UI frameworks, I hand-coded the layout with Vanilla CSS. The interface uses glassmorphism effects, smooth transitions, and micro-animations to create a premium experience.
Real-Time Simulation
Since real sensors were unavailable, I implemented dynamic simulators that mimic WebSocket-based IoT data. The dashboard updates crowd density in real time using:
Green → Low traffic
Orange → Moderate traffic
Red → High congestion
Docker Multi-Stage Build
The project uses a two-stage Docker setup:
Node stage builds optimized assets
Nginx stage serves the static SPA on port 8080
This keeps the container small and production-ready.
Cloud Deployment with Google Cloud Run
The container is deployed serverlessly using Google Cloud Run. It automatically scales based on traffic and integrates with Cloud Build for CI/CD.
Deployment command:
gcloud run deploy moviesync --source . --port 8080
Where Antigravity Helped
Antigravity helped streamline:
- Rapid scaffolding of the project structure
- Faster iteration during UI development
- Simplified deployment workflow
- Reduced setup complexity for cloud deployment
- Improved developer productivity
Using Antigravity alongside Cloud Run made the entire process smoother and quicker.
Key Features
- Real-time queue dashboard
- Serverless scalable deployment
- Lightweight UI
- Dockerized production build
- Antigravity-powered workflow
- Open-source repository
- What's Next
- Real IoT sensor integration
- WebSocket backend
- Predictive analytics
- Mobile PWA version
- Multi-venue support
- Final Thoughts
MovieSync demonstrates how modern tools like React, Docker, Google Cloud Run, and Antigravity can be combined to build scalable real-time applications quickly. Building in public made the journey more transparent and collaborative.
What are you building right now? 🚀
Top comments (0)