< Back
Samalla Beach House Website logo

Samalla Beach House Website

Status: Active

Timeline: September 2020 - present

Visit site: samallabeachhouse.com

Technologies: StencilJS 2.14, Ionic Core 6, TypeScript, Telegram Bot API & Netlify


A site for a beachfront rental in Prampram, Ghana. It shows the property off with photos and gives guests what they need to book a coastal stay.

The Samalla Beach House needed a presence online to bring in visitors and lay out the property, the amenities, and how to reserve a stay on the coast.

Under the hood

The site is built with StencilJS 2.14, which compiles reusable UI into Web Components, paired with Ionic Core 6 for the mobile-friendly pieces like slides, modals, and icons. It's TypeScript with TSX templates, routed by stencil-router-v2, and built and prerendered through the Stencil CLI. Stencil's Jest-based spec and e2e runners cover the tests. The output is a static site that drops onto Netlify or any static host. The whole thing comes to about 15 custom Web Components (hero, gallery, amenities, rooms, location, contact modal, and the rest).

There's no database. Reservation forms post straight to a private Telegram channel through the Telegram Bot API, which doubles as a lightweight booking dashboard. Guests can also reach out over WhatsApp, Instagram, Facebook, Twitter, or email, and an embedded Google Map shows where the house is.

What's on it

  • A photo gallery with a swipeable slider and navigation controls
  • A reservation form wired to Telegram notifications, so bookings land in real time
  • Sleeping arrangements (two bedrooms with queen beds and one sofa bed)
  • 17 amenities, including a kitchen, A/C, beachfront access, and free parking
  • An embedded Google Map with directions
  • A house-rules section
  • Contact options across WhatsApp, email, phone, and social media
  • Fast-loading Web Components with optional prerendering