React Native Anime Catalog

Implements the Anime Catalog using [Jikan API](https://docs.api.jikan.moe/)

Features

This project mainly focuses on the latest libraries and performance optimization by using MMKV storage for Redux persist store, React Query v5 + Ky for data fetching and caching, utilizing useInfiniteQuery (v5) for pagination (infinite scroll), React Navigation (stack, drawer, bottom tabs), Flashlist for Fast & Performant React Native List and FastImage for image caching.

• Browse Anime Catalog: View anime catalog for airing, complete, and upcoming series.
• View Anime Details: Access detailed information about each anime and mark favorites.
• Favorites Management: Organize your favorite anime, view details, and remove favorites.

Download Apk: AnimeCatalog.apk

Examples

Home screens:

Home.mp4

Favorites screens:

Fav.mp4

Prerequisites

Before running the project, make sure you have the following:

• Node.js installed on your machine
• React Native CLI installed globally

Getting Started

To get started with the project, follow these steps:

Clone the repository: git clone https://github.com/aliffazfar/rn-AnimeJikan.git

1. Install dependencies:

   • cd rn-AnimeJikan
   • yarn

2. yarn ios | yarn android

3. (*) Debug JS Remotely by react-native-devsettings

Generate APK: yarn build:android:apkRelease
Output apk location: rn-AnimeJikan/android/app/build/outputs/apk/release/app-release.apk

Folder Structure

The project follows the following folder structure:

• src/components: Contains reusable components used in the project.
• src/hooks: Contains custom hooks.
• src/navigators: Contains navigation utilities.
• src/redux: Contains Redux slices for fetching and managing data.
• src/screens: Contains the main screens of the application.
• src/services: Contains the API service config and endpoints.
• src/types: Contains TypeScript type declarations for the project.

Contact

For any inquiries or questions, please contact aliffazfararis@gmail.com.