Search for movies. Organize your collection. And share with your friends. Movify opens the door to exciting movie experiences by creating a social media-like platform where interactions are solely film-based. Here you can view the activity of people in your network and see what movies they’re watching, liking, and sharing.
Redis’ advanced capabilities maximized the user’s experience through its ability to transmit data between components at lightning speed. Achieving this consistently optimized the application’s functionality by keeping users engaged. This allowed commands and social interactions on the platform to be carried out in real-time, mirroring the pace of real-life events.
Let’s take a look at how this application was made in more detail. But before we go any further, we’d like to highlight that we have a great variety of innovative apps for you to discover on the Redis Launchpad.
So if you enjoy this post, make sure to have a browse after!
You’ll build a social platform that allows people to connect all around the world based on movie preferences. This involves managing your own movie collections, liking other people’s movie activity as well as creating a fun and easy way to discover movies that are hidden from the mainstream spotlight.
Below we’ll highlight what components you’ll need to bring this application to life as well as walk you through each step of the implementation process.
Ready to get started?
OK, let’s get straight into it.
What will you need?
Install the below software on your local machine:
git clone https://github.com/redis-developer/movify
To launch the app locally, you’ll need a docker-compose. For security reasons, backend/.env is not on this repo. Since we rely on Google Sign-in for authentication, you’ll need to create a Web client and register http://127.0.0.1:8000/api/auth as an authorized redirect URI.
Next you’ll have to generate a random string for the encryption openssl rand -hex 16. And finally you’ll need to create a TMDB account and get an API key.
You can now fill the .env file as follows:
GOOGLE_CLIENT_ID=
GOOGLE_CLIENT_SECRET=
SECRET_KEY=
TMDB=
The Docker compose file defines the services that make up your app. In this case, there are 3 services – frontend, backend, and Redis.
version: '3.7'
services:
nginx:
image: nginx:1.17
volumes:
- ./nginx/nginx.conf:/etc/nginx/conf.d/default.conf
ports:
- 8000:80
depends_on:
- backend
- frontend
redis:
image: redislabs/redismod:latest
command: --loadmodule /usr/lib/redis/modules/redisearch.so --loadmodule /usr/lib/redis/modules/redisgraph.so --loadmodule
/usr/lib/redis/modules/rejson.so --dir /data
# ports:
# - 6379:6379
volumes:
- ./redis-data:/data
frontend:
image: redis21_frontend
volumes:
- ./frontend:/app
backend:
image: redis21_backend
entrypoint: uvicorn main:app --host 0.0.0.0 --port 8000 --root-path /api --reload
depends_on:
- redis
environment:
- HOST=http://127.0.0.1:8000
volumes:
- ./backend:/app
docker build -t redis21_backend backend/
docker build -t redis21_frontend frontend/
docker-compose up
The script run.sh will build the images and start the containers.
This project was bootstrapped with Create React App.
In the project directory, you can run the following commands:
npm startThis runs the app in the development mode.
Open http://localhost:3000 to view it in the browser.
The page will reload if you make edits. You’ll also see any lint errors in the console.
npm testThis command launches the test runner in the interactive watch mode. You can visit the section about running tests for more information.
npm run buildBuilds the app for production to the build folder. This correctly bundles React in production mode and optimizes the build for the best performance. The build is minified and the filenames include the hashes. At this point, your app will be ready to be deployed!
See the section about deployment for more information.
npm run ejectNote: This is a one-way operation. Once you eject, you can’t go back!
If you aren’t satisfied with the build tool and configuration choices, then you can always eject at any time. This command will remove the single build dependency from your project. Instead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them.
All of the commands except eject will still work. However, they will point to the copied scripts so you can tweak them. At this point, you’re on your own.
What’s also important to know is that you don’t ever have to use eject. The curated feature set is suitable for small and middle deployments, so you shouldn’t feel obligated to use this feature.
Use the TMDB API to search and retrieve new movies that are hidden amongst a huge collection of films. The results are cached by the server with an LRU policy. User-generated data is stored in a graph and in JSON clusters. Here, everything can be updated with the JSON.
There are three types of nodes in this data model:
Users
Collection
MovieThere are three types of edges:
User - [: FOLLOWS]> User
User - [:HAS]> Collection
Collection - [:CONTAINS]> Movie {time}To create those classes we made the abstract nodes and upside edges which both make it very simple to work with CRUD operations.
Having these collections will provide you with flexible and efficient querying. The metadata associated with users and collections is stored as JSON.
User {id, picture, name}
Collection {id, name, description}Below we have abstract classes for CRUD operations. This makes it very simple to create certain types of nodes and get all of the CRUD operations in a single line of code.
However, for queries we prefer to use cypher.
Everything has been timestamped. This was very handy when we wanted to add the friends’ activity view – which was the addition of a simple cypher query on our already timestamped relations.
The homepage is where a friend’s recent activity is displayed. Here you’ll have a share link to connect with other users on the platform.
Movies are organized in collections which are then shared with your friends.
Searching for movies is done by using external APIs and responses are cached using an LRU eviction policy.
To get additional information about a movie, you may need to make a couple more calls. Here we’re using TMDB API to request information about a movie. Another one is made gather information about the crew and cast members.
One of the most frustrating endeavors any movie fan can relate to is trying to discover captivating movies that are concealed from the spotlight. These hidden gems are hard to locate and often require a lot of time investment to dig them out from underneath the mainstream surface.
But with Movify, fans can navigate more efficiently to their favorite movies by connecting with people with similar POVs and cinematic tastes, enabling users to share. Their activities and see what films others are liking, sharing, and watching.
From a performance perspective, Redis’ powerful caching capabilities guaranteed low latency, allowing users to interact with each other in real-time. This removes the likelihood of any lags from occurring and contaminating the user experience, enabling users to seamlessly interact with other movie fans seamlessly.
If you want to discover more about how this application was made, watch the YouTube video here. But that’s not all. We also have a whole range of innovative applications for you to check out on the Redis Launchpad.
Programmers from all around the world are unlocking their creative potential by using Redis and you can too.
Head on over. Be inspired. And have fun with Redis.
Despite still being a student, Matthias has a whole range of experience in programming, artificial intelligence, machine learning, and much more. To stay up date with all of the projects he’s involved in, check out his GitHub page here.