What's inside

• Parallax scroll gallery and 3D featured-property card
• Buy / Rent tabs with live search and Card Hover Effect grid
• Property detail dialog with token-amount reservation checkout
• Agent and builder subscription plans
• Buyer portal with reservations and plan usage
• Site-visit request form

1. 1

   Unzip the download

   Extract Haven-Properties-Website.zip — you'll get a Haven-Properties-Website/ folder with every file the project needs.

2. 2

   Open the folder in VS Code

   Use File → Open Folder…, or run this from a terminal in the folder where you unzipped it:

   $ code Haven-Properties-Website

3. 3

   Check Node.js

   Next.js 16 needs Node.js 20.9 or newer. Check with:

   $ node -v

4. 4

   Install dependencies

   Open the VS Code terminal (Ctrl + `) and run:

   $ npm install

5. 5

   Start the dev server

   Then open http://localhost:3000 in your browser — the page reloads as you edit.

   $ npm run dev

6. 6

   Make it yours

   The whole template is one component in src/components/demos/ — text, prices, products and photos are plain objects at the top of that file. Brand colours are the palette in its `theme` object. Effects live in src/components/demos/aceternity/ and shadcn/ui parts in src/components/demos/ui/.

7. 7

   Connect your own services

   Checkout, subscriptions, portal login and forms are front-end simulations: they keep state in the browser and send nothing. Replace their handlers in src/components/demos/premium-features.tsx with your payment provider, auth and email or CRM calls.

8. 8

   Build for production

   Creates an optimised build and serves it. Deploy to Vercel, Netlify or any Node host.

   $ npm run build
   $ npm start