Skip to content

Frontend connected to TMDB API that allows you to browse its database to find your favorite movies and actors. Built with React Native, Expo and NativeWind.

Notifications You must be signed in to change notification settings

KevinVanDerSchans/cine-scape-react-native

Repository files navigation

CineScape

Frontend with React Native / Expo / NativeWind


Project overview

Frontend connected to TMDB API that allows you to browse its database to find
your favorite Movies and Actors. Built with React Native, Expo and NativeWind.

Project Setup

1º Install dev dependencies

npm install

2º Moviedb API

The Movie Database (TMDB)

Click on the link.

Create an account (fast and free).

Go to 'Edit Profile'.

In Settings, go to 'API'.

Copy the API Key.

Rename the .env.template file to .env

Paste it in the apiKey variable.

3º Run the APP

npm start

Runs the APP in development mode.


Expo Go

Download Expo on your phone to view it. You will be able to see your changes, build errors and logs in the terminal.


npm run ios

Like npm start but also attempts to open your APP in the iOS Simulator if you're on a Mac and have it installed.


npm run android

Like npm start but also attempts to open your APP on a connected Android device or emulator. Requires an installation of Android build tools.


Features

✔️ All the Movies you can imagine

✔️ Search Engine for Movies by Title

✔️ Tabs and Stack navigation

✔️ Error handling

✔️ Focus on accessibility

✔️ User feedbacks with Toasts

✔️ NativeWind for the styles

✔️ User-friendly and functional design

Components

⚛️ DYNAMIC LISTS
    - Trending Movies
    - Upcoming Movies
    - Top Rated Movies

⚛️ SEARCH ENGINE
      Up to 20 results related to the title of the Movie we have searched for

⚛️ MOVIE DETAIL PAGE
    - Movie image
    - Movie title
    - Year of release
    - Total running time
    - Genre
    - Movie overview
    - Top Cast: Cast List
    - Similar Movies: List of related Movies

⚛️ ACTOR/ACTRESS PAGE
    - Actor image
    - Full name
    - Place of birth
    - Gender
    - Birthday
    - Known for
    - % of Popularity
    - Biography
    - His/her Movies

⚛️  SPINNER
      Used for loading elements

Technologies and Tools used


Contribution

If you want to contribute to this project, follow these steps:

  1. Perform a fork to the repository.

  2. Create a branch for your feature or bugfix: git checkout -b feature/your-feature-name

  3. Make the necessary changes and commits: git commit -m 'Add some feature'

  4. Push to branch: git push origin feature/your-feature-name

  5. Send a pull request to the original repository.


Project Status

COMPLETED


Project Developer



Kevin Schans

About

Frontend connected to TMDB API that allows you to browse its database to find your favorite movies and actors. Built with React Native, Expo and NativeWind.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published