SaaS Landing Page

A modern, animated, dark-mode-first landing page template for SaaS products — built with React, TypeScript, TailwindCSS, and Zustand.

🔗 Live Demo | 💻 GitHub Repo

---

📌 Project Overview

A reusable marketing-site template for a SaaS product. It features animated section transitions, smooth scrolling, theme toggle, clean typography, and a polished hero. Built with React + TypeScript and styled with TailwindCSS; lightweight global state is handled by Zustand. Optimized for performance, accessibility, and a great mobile experience.

---

🌐 Live Preview

👉 https://react-landing-page-ivory-one.vercel.app

---

🛠 Technologies Used

Core Framework & Build Tools

State Management

Styling

Deployment

---

⚙️ Getting Started

📋 Prerequisites

• Node.js v20.x or higher
• npm v10.x or higher
• Git

📦 Installation

1. Clone the repository:

   git clone https://github.com/bcheban/react-landing-page.git
   cd react-landing-page

2. Install dependencies:

   npm install

3. Start the dev server:

   npm run dev

   The app will open at http://localhost:5173.

🧰 Available Scripts

Script	Description
npm run dev	Start the local Vite dev server
npm run build	Create a production build in /dist
npm run preview	Preview the production build locally
npm run lint	Run ESLint across the project

---

🚀 Features

• 🎬 Animated Sections – Smooth fade/slide reveals as you scroll.
• 🌗 Light / Dark Mode – Persistent theme toggle.
• 🧭 Smooth Scrolling – Anchor-link navigation between sections.
• 🧠 Zustand Store – Minimal global state for theme + UI.
• 📱 Fully Responsive – Mobile-first design.
• ♿ Accessible – Semantic markup, focus styles, contrast-aware.

---

📊 Lighthouse

Made with ❤️ by @bcheban