Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/adenlall/animecal
Export your anilist watching list into your calendar
https://github.com/adenlall/animecal
anilist calendar icalendar nextjs nextjs15
Last synced: 13 days ago
JSON representation
Export your anilist watching list into your calendar
- Host: GitHub
- URL: https://github.com/adenlall/animecal
- Owner: adenlall
- Created: 2025-01-27T23:06:37.000Z (18 days ago)
- Default Branch: main
- Last Pushed: 2025-01-30T11:44:42.000Z (16 days ago)
- Last Synced: 2025-01-30T12:30:19.207Z (16 days ago)
- Topics: anilist, calendar, icalendar, nextjs, nextjs15
- Language: TypeScript
- Homepage: https://animecal.vercel.app
- Size: 2.16 MB
- Stars: 3
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# AnimeCal - AniList Watching list to Calendar Exporter
[![Next.js Version](https://img.shields.io/badge/next.js-15.1.6-blue?logo=next.js)](https://nextjs.org/)
[![React Version](https://img.shields.io/badge/react-19.0.0-blue?logo=react)](https://react.dev/)
[![Zustand State Management](https://img.shields.io/badge/state_management-zustand-%2320232a)](https://zustand-demo.pmnd.rs/)AnimeCal is a Next.js 15 application that helps anime enthusiasts export their AniList watching list into a standardized `.ics` calendar format. Easily integrate your anime schedule with popular calendar services like Google Calendar, Outlook, or Apple Calendar.
## ✨ Features
- 🔐 Secure AniList OAuth authentication
- 📺 Fetch current watching list from AniList
- 🗓️ Generate iCalendar (.ics) files with airing schedules
- ✏️ Type safety with **TypeScript**, **Graphql** and **Codegen**
- ⚡ Offline caching using IndexedDB
- 🎨 Beautiful UI with DaisyUI components
- 🔄 Real-time data synchronization
- 📱 Responsive design## 📸 Screenshots
![]()
Home Screen
![]()
Watchlist Preview
![]()
Profile Settings
![]()
Anime Details
## 🚀 Getting Started
### Prerequisites
- Node.js 18+
- npm 9+
- AniList API credentials### Installation
1. Clone the repository
```bash
git clone https://github.com/adenlall/AnimeCal.git
cd AnimeCal
```
2. Install dependencies```bash
npm install
```3. Configure environment variables
- Create a .env.local file in the root directory:
```env
NEXT_PUBLIC_ANILIST_CLIENT_ID=your_client_id
NEXT_PUBLIC_ANILIST_REDIRECT_URI=http://localhost:3000/api/auth/callback
ANILIST_CLIENT_SECRET=your_client_secret
```4. Run the development server
```bash
npm run dev
```## 🛠️ Technologies Used
- **Next.js 15** - React framework for server-side rendering and static generation
- **React 19** - Frontend library for building user interfaces
- **Zustand** - State management solution
- **GraphQL Codegen** - Type-safe GraphQL operations
- **Tailwind CSS + DaisyUI** - Modern styling framework
- **IndexedDB** - Client-side storage for offline caching
## 📖 Usage
1. **Authenticate with AniList**
- Click the "Login with AniList" button
- Grant necessary permissions2. **Fetch Watching List**
- The application will automatically retrieve your current watching list
- View anime titles with next airing dates3. **Generate Calendar**
- Click "Generate Calendar" to create .ics file
- Customize calendar options:
- Include past episodes
- Set reminder notifications
- Choose calendar timezone4. **Export & Sync**
- Download .ics file
- Import to your preferred calendar service
- Automatic updates when new episodes air## 🤝 Contributing
Contributions are welcome! Please follow these steps:
1. Fork the repository
2. Create your feature branch (git checkout -b feature/AmazingFeature)
3. Commit your changes (git commit -m 'Add some AmazingFeature')
4. Push to the branch (git push origin feature/AmazingFeature)
5. Open a Pull Request## 📄 License
This project is licensed under the MIT License - see the LICENSE file for details.
## 🙏 Acknowledgments
1. AniList team for their excellent API
2. Next.js community for awesome documentation
3. Contributors to the open-source libraries used in this project