Huvimestari

Huvimestari is a production-ready Next.js website for an event business, combining a custom booking calendar powered by the Google Calendar API with automated email notifications via the Gmail API. Built with TypeScript and styled with Tailwind CSS, the site is deployed on Google Cloud Run and currently ranks first for bachelor party activities in Jyväskylä.

What is Huvimestari?

Huvimestari is a full website implementation for Huvimestari, a Finnish event company, built with the Next.js framework. It takes booking data from visitors on the public site, creates calendar events through the Google Calendar API, and sends confirmation emails through the Gmail API. The project includes the entire stack: Next.js pages, React components, Tailwind CSS styling, and containerized deployment scripts for Google Cloud Run.

Key Features

• Next.js framework — Server-rendered React pages with TypeScript support, offering fast loads and SEO-friendly output.
• Custom booking calendar — A purpose-built calendar component that syncs with Google Calendar to show availability and manage reservations.
• Gmail API email automation — Automatically sends booking confirmations and notifications whenever an event is created or updated.
• Tailwind CSS and Tailwind UI — Utility-first styling with pre-designed components for a coherent, modern interface.
• SEO landing pages — Landing pages are structured to rank in search engines; the site is currently the organic first result for bachelor party activities in Jyväskylä.
• Google Analytics — Visitor tracking is integrated for measuring traffic and conversion behavior.
• Google Cloud Run deployment — Includes step-by-step commands to authenticate, build, and deploy using gcloud builds submit and gcloud run deploy.
• High performance — Achieves a nearly 100% Lighthouse performance score, indicating optimized assets and fast rendering.

Who is it for?

• Event and activity businesses — A ready-made website that lets customers book directly from a live calendar without third-party booking software.
• Developers — A reference project showing how to integrate Google Calendar and Gmail APIs inside Next.js and deploy to a serverless container platform.
• Finnish local businesses — The site demonstrates how a small service company can dominate local search results with SEO-focused pages and fast performance.

Use cases

• Event organizers: offer bachelor party packages and take reservations through an interactive calendar that writes events to Google Calendar.
• Web developers: follow the deployment guide to publish a Next.js application to Cloud Run, including container builds and API enablement.
• Marketing teams: rely on the built-in Google Analytics and SEO landing pages to monitor organic traffic and generate leads from search.

How does Huvimestari work?

A visitor chooses an available time slot on the booking calendar, which triggers the creation of a Google Calendar event via the Google Calendar API. The Gmail API then sends a confirmation email to the customer. For developers, the README explains enabling Cloud Build and Cloud Run, authenticating with gcloud auth login, building an image with gcloud builds submit, and deploying with gcloud run deploy.

FAQ

What APIs does Huvimestari use?

Huvimestari uses the Google Calendar API for booking events and the Gmail API for sending transactional emails. Both are called directly from the Next.js server, and the project requires these APIs to be enabled in the Google Cloud project.

How do I deploy Huvimestari to Google Cloud Run?

First enable Cloud Build and Cloud Run in the Google Cloud project. Then authenticate with gcloud auth login, build the image using gcloud builds submit --tag gcr.io/YOUR-PROJECT/YOUR-IMAGE, and deploy with gcloud run deploy --image gcr.io/YOUR-PROJECT/YOUR-IMAGE --platform managed. After selecting the region, the site is live.

What frontend framework does Huvimestari use?

Huvimestari is built with Next.js, a React framework that supports server-side rendering and static site generation. It also uses TypeScript for type safety and Tailwind CSS for styling, with Tailwind UI components for some UI elements.

What is the website's performance score?

The site achieves a nearly 100% performance rating on Google Lighthouse, which reflects fast loading times, minimal blocking resources, and optimized images and assets.