Skip to content

To be renovated with mocking user interface and recommendation based on visitor history and ratings

License

Notifications You must be signed in to change notification settings

ZZZ-RecSys/ZZZ-MovieSearch-Client-PlusRec

 
 

Repository files navigation

ZZZ - Movie Recommender App

TensorFlow Node.js React Next.js PostgreSQL

image

Technology Framework

This project is developed with Next.js, initiated using create-next-app. It builds upon the ZZZ-Movie RecSystem Data Pre-processing repository, which imports a comprehensive movie dataset from Kaggle into a PostgreSQL database and enriches it with vector embeddings for each movie title.

To enhance the search functionality, our Movie Recommender App employs TensorFlow's Universal Sentence Encoder for advanced semantic vector retrieval. Then we present search results through a responsive interface built with React and Next.js.

Guided by insights from Aiven's guide on building a movie recommender, we've made enhancements to both the user interface and API. These updates serve as a foundation for a feature currently in development, which will offer personalized recommendations by analyzing users' search histories.

Getting Started

This guide walks you through setting up a Node.js application that connects to a PostgreSQL database using environment variables for configuration.

Prerequisites

Setup Instructions

Step 1: Install Node.js

Ensure Node.js (which includes npm) is installed on your system. You can verify by running node -v and npm -v in your terminal.

Step 2: Initialize Project

Navigate to your project's root directory in the terminal and install dependencies:

cd /path/to/your/project
npm install

Step 3: Configure Environment Variables

Create a .env file in the project root with the following content:

PG_NAME=<your_database_name>
PG_PASSWORD=<your_database_password>
PG_HOST=<your_database_host>
PG_PORT=<your_database_port>

Step 4: Download SSL Certificate

Step 5: Populate the PostgreSQL Database

Before running the development server, ensure your PostgreSQL database is populated with the initial dataset, located in ZZZ-MovieRecSystem

Step 6: Run the Development Server

Start the development server with:

npm run dev

Step 7: Access the Application

With the development server running, access your application through the browser at http://localhost:3000

Upcoming Enhancements

  1. Implementing personalized recommendation features utilizing users' search histories for a more tailored experience.
  2. Add a mocking user feature with a new interface.
  3. Add a recommendation feature based on mocked user visits and ratings.
  4. Deploying the web application to a public domain for broader accessibility.

Additional Information and Resources

  • Certificates: Ensure your database client uses SSL/TLS with ca.pem.

  • DevPost: For a detailed narrative on the project's evolution and insights, visit the DevPost project page.

  • Dataset: The source of the dataset is available on Kaggle, providing a rich repository of movie plots. Visit the ZZZ-MovieRecSystem to populate your database.

Contributors

  • Yiwei Zhang
  • Shizhe Zhang
  • Weiran Zhao

About

To be renovated with mocking user interface and recommendation based on visitor history and ratings

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • TypeScript 90.1%
  • CSS 7.4%
  • JavaScript 2.5%