AI Landing Page

Overview

Welcome to the AI Landing Page project! This repository showcases an interactive and visually stunning landing page that includes:

A matrix rain effect
Animated bouncing cat and fish GIFs
A dynamic progress indicator
A debug console with start/stop controls

Features

Matrix Effect: A dynamic background inspired by the Matrix movie, rendered using HTML5 Canvas.
Animated GIFs: Bouncing and sparkling GIFs of a cat and a fish, adding a playful touch to the page.
Progress Indicator: Displays loading progress in a stylish manner.
Debug Console: Inline debug console to monitor errors, with buttons to stop/restart animations.

Demo

Check out the live demo here.

Preview

Getting Started

To get a local copy up and running, follow these simple steps.

Prerequisites

Make sure you have the following installed:

Node.js
npm

Installation

Clone the repository:

git clone https://github.com/hjhgitw/ai-landing-page.git
cd ai-landing-page

Install npm packages:
```
npm install
```
Start the local development server:
```
npm start
```
Open your browser and navigate to http://localhost:3000.

Usage

To use this project, simply open index.html in your preferred web browser. The animations and effects will start automatically.

Code Structure

ai-landing-page/
├── index.html
├── server.js
├── package.json
├── netlify.toml
└── README.md

### Explanation:

1. **`netlify.toml` File**:
    ```toml
    [build]
      base = ""
      publish = ""
      command = ""
    ```

2. **One-Click Deploy Button**: The button `[![Deploy to Netlify](https://www.netlify.com/img/deploy/button.svg)](https://app.netlify.com/start/deploy?repository=https://github.com/hjhgitw/ai-landing-page)` allows users to deploy the project to Netlify with a single click.

3. **Netlify Badge**: Replace `your-badge-id` and `your-site-name` with your specific details from the Netlify site.

4. **Demo Link**: Update `https://your-live-demo-link.com` with the actual link to your live demo if available.

5. **GIF Previews**: Replace `path/to/your/bouncing_sparkling_cat.gif` and `path/to/your/bouncing_sparkling_fish.gif` with the actual paths to your GIFs.

By following these steps and updating the placeholders with your information, you'll have a professional and functional `README.md` for your GitHub project.

hjhgitw / ai-landing-page