The platform handles the entire accommodation presentation and booking flow: customizable homepage with hero, "Why Choose Civico200" section, search bar with filters (check-in/check-out, guests), accommodation catalog with informative cards (price, guests, beds, bathrooms, size), detail pages with complete descriptions, photo galleries, services/amenities, location map, stay details (check-in/out, minimum stay, house rules, cancellation terms, safety), guest reviews with star ratings, contact form, and Payload admin for staff with accommodation/review/homepage/site config management. Responsive design optimized for mobile and desktop.

Key features

• Accommodation catalog: rooms and apartments with complete info (price/night, guests, beds, bathrooms, size, localized descriptions, main image).
• Search & filters: search bar with check-in/check-out dates, number of guests, real-time availability filter, results counter.
• iCal calendar: Airbnb iCal integration for automatic availability sync, event parsing, blocked occupied dates.
• Detail pages: organized tabs (General, Services and photos, Location and codes, Stay), rich-text descriptions, interactive photo galleries (Embla Carousel), Mapbox map with GPS coordinates.
• Review system: 1-5 star rating, guest name, review text, date, accommodation link, "featured" flag for homepage carousel, reviews tab in accommodation admin.
• Stay details: check-in/out times, minimum stay (nights), house rules (array), cancellation terms (array), accommodation and safety (array).
• Contact form: React Hook Form + Zod validation, email sending via Resend with React Email templates, confirmation toast.
• CMS Admin: accommodation management (4 tabs: General, Services and photos, Location and codes, Stay), review management, homepage content (hero image/title/subtitle), site config (logo, email, phone, address, social links), media library, draft/publish workflow.
• i18n: full IT/EN support with next-intl, localized fields (name, descriptions, location, rules), locale switcher.
• Identification codes: CIR (Regional Identification Code), CIN (National Identification Code) for regulatory compliance.

Data layer & integrations

• Payload CMS 3.76 with MongoDB for collections (accommodations, reviews, media, users) and globals (homepage, site-config).
• tRPC for type-safe APIs (
  accommodations, reviews, siteConfig).
• Zod for schema validation.
• Resend + React Email for transactional emails (contact form, confirmations).
• Vercel Blob for media storage.
• iCal parsing: fetch and parse Airbnb calendars for availability management, blocked occupied dates.
• Mapbox GL JS for interactive maps with accommodation location markers.
• nuqs for URL state management with persistent filters.

Security & access

• Granular RBAC on Payload collections (admin, editor roles).
• Draft/publish workflow for content.
• Input validation with Zod on forms.
• Access control: only admin accesses all CMS features.
• Payload SEO plugin for optimized metadata.

UI/UX and performance

• Tailwind CSS 4 for utility-first styling.
• Embla Carousel for photo galleries (with wheel gestures).
• Mapbox GL for interactive maps.
• React Hook Form for form management and client-side validation.
• React Day Picker for calendar date picker.
• Lucide React and React Icons for icons.
• Sonner for toast notifications, next-themes for theme switching.
• React Error Boundary for error handling.
• Responsive design, lazy image loading, tuned LCP/CLS.

Technical highlights

• Next.js 16 + React 19 + TypeScript.
• Payload 3.76 (MongoDB), Vercel Blob media.
• iCal Airbnb integration (calendar parsing, availability sync).
• Mapbox GL for maps with GPS coordinates.
• Advanced search bar with date/guest filters, real-time availability.
• Review system with stars and featured carousel.
• tRPC + React Query for type-safe APIs.
• React Email + Resend for transactional.
• next-intl (IT/EN), React Hook Form, Zod, nuqs.
• Complete admin with 4 accommodation tabs, media library, draft/publish.
• Tailwind 4, Embla Carousel, Biome, pnpm.