Capstone Project 2 - Streaming App

Website URL: https://streaming-app-syp4.onrender.com

Streaming App features an engaging movie and TV show slider, inspired by popular streaming platforms like Netflix. This dynamic slider provides users with a visually appealing way to discover and navigate through a curated selection of movies and TV shows.

Key Highlights:

• Featured Content: Explore handpicked featured movies and TV shows prominently displayed in the slider.
• Interactive Design: Navigate through the slider with ease, allowing users to quickly browse and select content.
• Visual Thumbnails: Each item in the slider is accompanied by visually appealing thumbnails, giving users a glimpse of the content.

How to Use the Slider:

1. Visit the home page.
2. Look for the movie and TV show slider prominently featured on the page.
3. Use the navigation controls to slide through the curated selection.
4. Click on a movie or TV show thumbnail to view more details.

Enjoy a visually rich and interactive experience with the curated movie and TV show slider on Streaming App!

Instructions:

1. Click the "Sign Up" button.
2. Fill out the forms, then click the "Submit" button.
3. You will be redirected to the homepage, where you can enjoy the movie and TV show slider.

OR

1. Click the "Login" button.
2. Fill out the forms below:
   • Username: sampleuser
   • Password: password
3. click the "Submit" button.
4. You will be redirected to the homepage, where you can enjoy the movie and TV show slider.

Tests

• there are tests in backend folder.

    cd backend
    npm install
    npm test

TMDB API documentation: https://developer.themoviedb.org/reference/intro/getting-started

• Note: Create a new account to request an API key/token.

*Tech Stack Used

• Reactjs
• Expressjs
• PostgreSQL
• Semantic UI
• Render as website hosting service
• React Slick as a library (For slider)

Slider Implementation

The movie and TV show slider in Streaming App is implemented using the React Slick library. React Slick provides a smooth and customizable carousel component, enhancing the user experience with its responsive design and feature-rich functionalities.

Feel free to explore the React Slick documentation for more details on its configuration options and customization capabilities.