Anime Scroll

Anime Scroll is a Next.js 14-based application that leverages server actions for efficient API calls, implements infinite scrolling for seamless content loading, and enhances user experience with Framer Motion animations. Ideal for anime enthusiasts, it integrates features such as data fetching from the Shikimori API, client-side rendering with motion components, and optimizations for improved performance.

Features

• Server Side App with Next.js 14: Utilizes the latest version of Next.js for server-side rendering and server actions.
• Server Actions: Abstracts the process of making API calls from client to server, allowing you to perform create, update, and delete actions alongside typical read operations.
• Infinite Scroll: Implements infinite scrolling to dynamically load content as the user scrolls.
• Framer Motion Animations: Enhances the user interface with smooth and interactive animations.

Technologies Used

• Next.js 14
• React
• Framer Motion
• Shikimori API
• react-intersection-observer

Getting Started

Follow these instructions to get a copy of the project up and running on your local machine for development and testing purposes.

Prerequisites

• Node.js (v14 or later)
• npm or yarn

Installation

1. Clone the repository:

   git clone https://github.com/ankitray-dev/anime-scroll.git

2. Navigate to the project directory:

   cd anime-scroll

3. Install dependencies:

   npm install

   or

   yarn install

Usage

1. Start the development server:

   npm run dev

   or

   yarn dev

2. Open your browser and go to http://localhost:3000 to see the app in action.

Contributing

We welcome contributions from the community. To contribute, follow these steps:

1. Fork the repository.
2. Create a new branch:

   git checkout -b feature-name

3. Make your changes and commit them:

   git commit -m 'Add some feature'

4. Push to the branch:

   git push origin feature-name

5. Open a pull request on GitHub.

License

This project is licensed under the MIT License.

Acknowledgements

• Thanks to the creators of Next.js, Framer Motion, and Shikimori API.
• Special thanks to the developers who contributed to the react-intersection-observer package.

Contact

For questions or feedback, please contact Ankit at [[email protected]].