This project showcases a dynamic web application built with Next.js featuring two main interactive experiences:
- Matrix Digital Rain (Homepage): A visually engaging Matrix-style digital rain effect implemented using HTML5 Canvas. Users can customize the animation by:
- Adjusting the speed of the falling characters.
- Changing the color of the characters.
- Toggling an RGB rainbow mode for a vibrant effect.
- Reversing the direction of the rain (characters falling up or down).
- Character Cam (
/charspage): An innovative feature that uses your webcam feed and renders it in real-time as ASCII-like art using a set of special characters.
The application also includes an "About" page (/lorem) providing more details on these features.
This is a Next.js project bootstrapped with create-next-app.
To run this project on your local machine, follow these steps:
First, ensure you have Node.js and npm (or yarn/pnpm/bun) installed. Then, clone the repository and install the dependencies:
git clone <repository-url>
cd <repository-folder>
npm install
# or
yarn install
# or
pnpm install
# or
bun installNext, run the development server:
npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun devOpen http://localhost:3000 with your browser to see the result.
You can start editing the page by modifying app/page.tsx. The page auto-updates as you edit the file.
This project uses next/font to automatically optimize and load Geist, a new font family for Vercel.
To learn more about Next.js, take a look at the following resources:
- Next.js Documentation - learn about Next.js features and API.
- Learn Next.js - an interactive Next.js tutorial.
You can check out the Next.js GitHub repository - your feedback and contributions are welcome!
The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.
Check out our Next.js deployment documentation for more details.
This project was developed with assistance from GitHub Copilot.