A web client built with React to interact with my previous project where I built an API.
- Register new users.
- Get information about specific users. Such as liked genres and movie ratings.
- Connect users to new movies, genres.
- Rate Movies
- Add Movies to the local database
- Search functionality to search movies by name
- Get movie recommendations for each movie
Open the project folder in VSCode. Before you run this program, you probably need to change the baseURL for the api. Also add your own TMDB API key to the apiKey. And finally, open the terminal in VSCode or run it in your folder. These commands should be enough to get you up and running.
- npm install (Installs all the packages used on this project)
- npm run dev (Starts the website)
The client was built using React.js with Vite. These were some of the more important packages used in this project
- Styled Components
- Axios
- React Router
The program is split into sub-folders within the SRC folder. Each page is under the pages folder. Each layout is under the layouts folder. And each component such as specific stylings are under the components folder.
This project was the first time going into React and I had no real previous experience with JavaScript other than some smaller experimentation a while ago. And as such, I may have done some things in a poor fashion but overall as a beginner to React I am happy with this project. I will be revisiting this project or create a second version once my React skills have improved. This project did however give me much more exposure to working with APIs and I felt like I learned a lot and saw many things to improve with my previous API structure.
For future projects, I will try to break out components in an earlier stage and try to plan my design using styled-components in a more scalable fashion as well.
I used TMDB API to be able to show and search between movies.