BangkokFilmmakers.com is the official website of Bangkok Filmmakers, Thailand’s largest grassroots community for film professionals, crew, and creators. Founded in 2017, the Facebook group has grown to over 10,000 members, providing a space for job listings, gear rentals, networking, and film festival promotion.
As the founder and technical architect, I developed the web platform from the ground up to extend the community’s reach beyond Facebook. The site is not just a static homepage—it’s a fully-featured modern platform, built with performance, scale, and extensibility in mind.
Project Goals
✅ Create a public-facing portal for the Bangkok Filmmakers community
✅ Enable member discovery, showcasing local talent and vendors
✅ Archive and promote the 60 Second Film Festival, a long-running community event
✅ Build a foundation for future features like casting calls, location databases, and event calendars
Technical Architecture
⚙️ Framework & Build Tools
Next.js 15 (App Router) for SSR/SSG, routing, and future scalability
MDX Support (@mdx-js/mdx, @next/mdx) for content-rich pages and editor integration
Tailwind CSS with tailwind-merge and tailwindcss-animate for utility-first styling
Radix UI + shadcn/ui patterns for accessible, low-level UI components
Zod and React Hook Form for form validation across associate registration and contact features
🗃️ Content & Data Layer
Markdown + MDX files power most long-form content (posts, policies, static pages)
A caching layer built with custom scripts (lib/cache/generate-cache-posts.mjs, generate-associates-cache.mjs) pre-generates static JSON from the content directory
Supabase serves as the backend for dynamic content like associate profiles, form submissions, and (in future phases) ticketing or vendor listings
📦 Packages & Integrations
Google Maps API via @react-google-maps/api for future location-based listings
PayPal integration via @paypal/react-paypal-js for payment processing and donations
ReCAPTCHA and react-cookie-consent for compliance and security
Resend for transactional emails (e.g., form confirmations or festival updates)
The prebuild caching system ensures the site builds quickly and scales cleanly—even if dozens or hundreds of new MDX content pages or associates are added. The next-sitemap generator keeps SEO up to date.
Component-Level Design
Modular component structure following Atomic Design principles
Fully responsive design with utility-based layout control
Terminal-inspired UI in other projects (e.g., OWolf.com) can be brought into this platform if needed
Real-World Impact
Bangkok Filmmakers isn't a theoretical portfolio project—it’s a living platform serving real users:
🎬 Over 10,000 creators connected via the extended community
📽️ Multiple seasons of the 60 Second Film Festival promoted and archived
🛠️ Trusted by professionals working with brands like Canon, Facebook, and Dell
💬 Future enhancements include authenticated dashboards, location management, and film industry tools for Thailand-based crews
Future Directions
Admin CMS Layer with live Markdown/MDX editor for team collaboration
Location Scouting Directory with custom tags, filters, and map previews
Event Calendar and interactive showcase for community films
Final Thoughts
This project is a perfect illustration of how developer-led infrastructure can directly empower a creative industry. From job discovery to festival promotion, I designed every layer of the stack to be fast, composable, and future-ready.
The codebase is built for growth, but the soul of the platform is community.
“When you build tools for filmmakers, you’re building tools for stories.”