Cinemax

Your AI-Powered Movie Guide - Discover, Track, and Explore Films Like Never Before

Introduction

Cinemax is an AI-powered movie discovery platform built with React.js, Redux for state management, Material UI for the interface, and Axios for API integration. It also features an in-app voice assistant powered by Alan AI for hands-free interaction.

Application Showcase

Live Demo

For a quick preview, check out the Live Demo.

Features

• Favorites & Watchlists - Create and manage your personal movie library.
• Light and Dark Mode - Switch themes to match your preference.
• Movie Sorting & Details - Sort movies by categories or genres and explore comprehensive details about films and actors.
• User Authentication - Secure login and account management for personalized experiences.
• Voice Control Navigation - Use Alan AI for hands-free interaction. Try commands like:
  • "Find movies directed by Martin Scorsese"
  • "Search for Superman movies"
  • "Show me top-rated action movies"

Getting Started

Running the Application

To get started with Cinemax locally, follow these steps:

1. Clone the repository:

   git clone https://github.com/nathan-abela/Cinemax.git

2. Install Dependencies:

   npm install

3. Setup Environment Variables:

   • Create a .env file.

   • Obtain a free TMDB API key from The Movie DB & Alan AI SDK key from Alan AI and add it to your .env file:

     REACT_APP_TMDB_KEY=<your_tmdb_api_key>
     REACT_APP_ALAN_AI_KEY=<your_alan_ai_sdk_key>

4. Start the development server:

   npm start

5. Open your browser:

   Navigate to http://localhost:3000 to see the application.

Serving Production Build Locally

To preview the production build of the app locally:

1. Build the app:

   npm run build

2. Serve the build locally using serve:

   npx serve -s build

3. Open your browser:

   Navigate to http://localhost:5000

4. If deploying to a subpath (like GitHub Pages):

   Make sure your package.json includes the correct homepage field:

   "homepage": "https://username.github.io/repository-name"

   This ensures that static assets load correctly from the proper path.

Technologies Used

• React.js
• Redux
• Material UI
• Axios
• Alan AI

Resources

• TMDB API Documentation
• Alan AI Documentation
• MUI Library

---