🚀 Layout Transitions Project

Mostly for showcasing the power of view transitions and dynamic animations in Next.js.

The project was bootstrapped with bun create next-app, and it took 3 seconds. I added all the packages, some free SVGs, and a few lines of code to make it look like this.

🌟 Features

🎥 Smooth Page Transitions

• Powered by next-view-transitions.

⚡ Fast builds

• Built with super fast bun
• Leverages turbopack for fast HMR builds.

🕺 Dynamic Animations

• Utilizes motion that makes life so much easier when creating animations that are easy to implement and customize.

💻 Modern Stack

• Uses the latest Next.js app router structure, ensuring future compatibility.
• Uses Tailwind CSS for rapid styling.

🐰 Uses BunnyCDN

• The project is hosted on BunnyCDN and uses EdgeScripts to control the site's behavior.

🚀 Quick Start

Prerequisites

Ensure you have the following installed:

• Node.js (18+)
• bun

Clone the Repository

git clone https://github.com/gsicvj/layout-transitions.git

Install Dependencies

bun install

Run the Development Server

bun dev

Visit http://localhost:3000 to view the app.

Build for Production

bun run build

📂 Project Structure

.
├── app/             # Application entry points and routes
├── components/      # Reusable UI components
├── public/          # Static assets
├── utils/           # Utility functions
├── package.json     # Project metadata
└── README.md        # Documentation

📜 License

This project is open-sourced under the MIT License.

💬 Feedback and Contributions

Contributions, issues, and feature requests are welcome! Feel free to check out the issues page or submit a pull request.

🌐 Connect with Me

• GitHub: gsicvj
• X: @endomenurh

Have fun! 😎