-
-
-
-
-
-
-
-
-
\ No newline at end of file
From 328913d5555bac9513a481c0cb65cce858cddbb7 Mon Sep 17 00:00:00 2001
From: Son Nguyen
Date: Thu, 20 Jun 2024 11:45:15 +0700
Subject: [PATCH 10/21] Final: Enhanced app's loading times (#196)
---
.../.idea/MovieVerse-Backend.iml | 2 +-
.../www/MovieVerse-Backend/.idea/misc.xml | 2 +-
.../MovieVerse-Backend/.idea/workspace.xml | 102 +-
.../www/MovieVerse-Backend/README.md | 64 +-
.../django_backend/movieverse/models.py | 2 +-
.../templates/movieverse/search.html | 40 +-
.../django_backend/movieverse/views.py | 5 +-
.../www/MovieVerse-Backend/package-lock.json | 30953 ++++++++++++++++
.../www/MovieVerse-Backend/package.json | 109 +
.../www/MovieVerse-Frontend/.idea/.gitignore | 8 +
.../.idea/MovieVerse-Frontend.iml | 12 +
.../www/MovieVerse-Frontend/.idea/modules.xml | 8 +
.../www/MovieVerse-Frontend/.idea/vcs.xml | 6 +
.../www/MovieVerse-Frontend/App.jsx | 114 +
.../www/MovieVerse-Frontend/App.vue | 99 +
.../www/MovieVerse-Frontend/README.md | 5 +-
.../www/MovieVerse-Frontend/package-lock.json | 30953 ++++++++++++++++
.../www/MovieVerse-Frontend/package.json | 109 +
18 files changed, 62539 insertions(+), 54 deletions(-)
create mode 100644 MovieVerse-Mobile/www/MovieVerse-Backend/package-lock.json
create mode 100644 MovieVerse-Mobile/www/MovieVerse-Backend/package.json
create mode 100644 MovieVerse-Mobile/www/MovieVerse-Frontend/.idea/.gitignore
create mode 100644 MovieVerse-Mobile/www/MovieVerse-Frontend/.idea/MovieVerse-Frontend.iml
create mode 100644 MovieVerse-Mobile/www/MovieVerse-Frontend/.idea/modules.xml
create mode 100644 MovieVerse-Mobile/www/MovieVerse-Frontend/.idea/vcs.xml
create mode 100644 MovieVerse-Mobile/www/MovieVerse-Frontend/App.jsx
create mode 100644 MovieVerse-Mobile/www/MovieVerse-Frontend/App.vue
create mode 100644 MovieVerse-Mobile/www/MovieVerse-Frontend/package-lock.json
create mode 100644 MovieVerse-Mobile/www/MovieVerse-Frontend/package.json
diff --git a/MovieVerse-Mobile/www/MovieVerse-Backend/.idea/MovieVerse-Backend.iml b/MovieVerse-Mobile/www/MovieVerse-Backend/.idea/MovieVerse-Backend.iml
index 3aa61256..eb3b04f4 100644
--- a/MovieVerse-Mobile/www/MovieVerse-Backend/.idea/MovieVerse-Backend.iml
+++ b/MovieVerse-Mobile/www/MovieVerse-Backend/.idea/MovieVerse-Backend.iml
@@ -16,7 +16,7 @@
-
+
diff --git a/MovieVerse-Mobile/www/MovieVerse-Backend/.idea/misc.xml b/MovieVerse-Mobile/www/MovieVerse-Backend/.idea/misc.xml
index 0b75147f..5b451b62 100644
--- a/MovieVerse-Mobile/www/MovieVerse-Backend/.idea/misc.xml
+++ b/MovieVerse-Mobile/www/MovieVerse-Backend/.idea/misc.xml
@@ -3,5 +3,5 @@
-
+
\ No newline at end of file
diff --git a/MovieVerse-Mobile/www/MovieVerse-Backend/.idea/workspace.xml b/MovieVerse-Mobile/www/MovieVerse-Backend/.idea/workspace.xml
index 8abdaa45..db9e4af4 100644
--- a/MovieVerse-Mobile/www/MovieVerse-Backend/.idea/workspace.xml
+++ b/MovieVerse-Mobile/www/MovieVerse-Backend/.idea/workspace.xml
@@ -33,35 +33,35 @@
- {
+ "keyToString": {
+ "ASKED_ADD_EXTERNAL_FILES": "true",
+ "ASKED_SHARE_PROJECT_CONFIGURATION_FILES": "true",
+ "Django Server.Django-Backend.executor": "Run",
+ "Django Server.MovieVerse-Backend.executor": "Run",
+ "Django tests.Test: movieverse.tests.executor": "Run",
+ "OpenAPI/Swagger Code Generator.movieverse-openapi.yaml.executor": "Run",
+ "Python tests.Python tests in api_test_suite.py.executor": "Run",
+ "Python.flask.executor": "Run",
+ "Python.genre_classifier.executor": "Run",
+ "Python.movie-recommendation.executor": "Run",
+ "Python.plot-summarizer.executor": "Run",
+ "Python.python manage.py runserver.executor": "Run",
+ "Python.sentiment_analysis.executor": "Run",
+ "RunOnceActivity.OpenDjangoStructureViewOnStart": "true",
+ "RunOnceActivity.ShowReadmeOnStart": "true",
+ "SHARE_PROJECT_CONFIGURATION_FILES": "true",
+ "git-widget-placeholder": "main-deployment-branch",
+ "last_opened_file_path": "/Users/davidnguyen/WebstormProjects/The-MovieVerse-Database/MovieVerse-Backend/django_backend/movieverse",
+ "node.js.detected.package.eslint": "true",
+ "node.js.detected.package.tslint": "true",
+ "node.js.selected.package.eslint": "(autodetect)",
+ "node.js.selected.package.tslint": "(autodetect)",
+ "nodejs_package_manager_path": "npm",
+ "settings.editor.selected.configurable": "reference.settings.ide.settings.new.ui",
+ "vue.rearranger.settings.migration": "true"
}
-}]]>
+}
@@ -156,7 +156,7 @@
-
+
@@ -249,6 +249,8 @@
+
+
@@ -442,7 +444,47 @@
1718813369344
-
+
+
+ 1718852665340
+
+
+
+ 1718852665340
+
+
+
+ 1718853152128
+
+
+
+ 1718853152128
+
+
+
+ 1718853190045
+
+
+
+ 1718853190045
+
+
+
+ 1718853213239
+
+
+
+ 1718853213239
+
+
+
+ 1718853227483
+
+
+
+ 1718853227483
+
+
diff --git a/MovieVerse-Mobile/www/MovieVerse-Backend/README.md b/MovieVerse-Mobile/www/MovieVerse-Backend/README.md
index 8f614f4a..dfd808c7 100644
--- a/MovieVerse-Mobile/www/MovieVerse-Backend/README.md
+++ b/MovieVerse-Mobile/www/MovieVerse-Backend/README.md
@@ -6,9 +6,11 @@
- [Getting Started](#getting-started)
- [Prerequisites](#prerequisites)
- [Installation](#installation)
- - [Running the Services](#running-the-services)
+ - [Quick Start](#quick-start)
+ - [Running the Services (Recommended)](#running-the-services-recommended)
- [Database Services](#database-services)
- [Django Service](#django-service)
+ - [API Service](#api-service)
- [Flask Service](#flask-service)
- [Machine Learning Services](#machine-learning-services)
- [Crawler Service](#crawler-service)
@@ -17,9 +19,9 @@
## Overview
-The backend of MovieVerse is built using a microservices architecture. This architecture allows for independent scalability and enhanced flexibility in the development of different functionalities of the app, such as authentication, user management, movie data processing, and more.
+The backend of MovieVerse is built using the **microservices architecture**. This architecture allows for independent scalability and enhanced flexibility in the development of different functionalities of the app, such as authentication, user management, movie data processing, and more.
-**Important**: Be sure to read this file and the [README.md](databases/README.md) file in the `databases` directory for more information on the backend services of MovieVerse before you start developing.
+**Important**: Be sure to carefully read this file and the [README.md](databases/README.md) file in the `databases` directory for more information on the backend services of MovieVerse before you start developing.
## Architecture
@@ -70,7 +72,7 @@ pip install -r requirements.txt
2. Navigate to the repository:
```bash
- cd mobile-backend
+ cd MovieVerse-Backend
```
3. Create a Virtual Environment (optional but recommended):
@@ -81,7 +83,19 @@ pip install -r requirements.txt
4. Follow the specific installation instructions for each service below.
-### Running the Services
+### Quick Start
+
+To quickly start the backend services of MovieVerse, simply run:
+
+```bash
+npm start
+```
+
+This command will start most (but not all) of the services required for the backend of MovieVerse. Note that before running this command, you must have all the prerequisites installed on your machine.
+
+**Important**: Remember to set the `SECRET_KEY` and set `Debug` to `True` in the [settings.py](django_backend/django_backend/settings.py) file in the `django_backend` directory. This is crucial for running the Django server locally. Additionally, you are also required to obtain a Django secret key and set it in the `settings.py` file.
+
+### Running the Services (Recommended)
To run the MovieVerse's backend services, follow these steps **in order**:
@@ -179,11 +193,11 @@ MovieVerse currently uses MongoDB, Redis, PostgreSQL, and MySQL as its primary d
7. For the next steps, refer to the [README.md](databases/README.md) file in the `databases` directory for more information on the database services.
**Disclaimer**: These servers are for your local development environment only, in order for you to see how our backend services interact with each other.
-In our production environment, we use cloud-based services like AWS, Azure, and Google Cloud to host our databases and services. This thus will look different from what you might see on your end.
+In our production environment, we use cloud-based services like AWS, Azure, and Google Cloud (in our case, **Heroku**) to host our databases and services. This thus will look different from what you might see on your end.
#### Django Service
-The Django service is responsible for handling the majority of backend functionalities of MovieVerse, such as API endpoints, movies management, database interactions, user management, and more. To run the Django service, follow these steps:
+The Django service is responsible for handling the majority of backend functionalities of MovieVerse, such as API endpoints, movies management, database interactions, user management, and more. It was designed using the **Model-View-Controller (MVC)** architecture. To run the Django service, follow these steps:
1. Navigate to the `django_backend` directory:
```bash
@@ -227,10 +241,44 @@ If you go to `http://127.0.0.1:8000/admin/` in your browser, you should see te f
-This is the Django admin interface for the backend of MovieVerse. It allows you to manage users, movies, reviews, and more.
+This is the Django admin interface for the backend of MovieVerse. It allows you (the admin and other authorized users) to manage users, movies, reviews, and more in the databases.
+
+For example, if you click on `Movies`, you should see the following interface, which allows you to manage movies in the database:
+
+
+
+
Note that the UI that you see when you go to `http://127.0.0.1:8000/` in your browser is only a template and does not represent the actual UI of the MovieVerse app. The actual UI is built using React and Vue and can be found in the [MovieVerse-Frontend](../MovieVerse-Frontend) directory.
+**Important**: There has been a known Django bug where the admin interface' CSS styles are not loaded properly. If you encounter this issue, you can fix it by:
+
+1. Set the `STATIC_ROOT` variable in the `settings.py` file to the path of the `static` directory in the `django_backend` directory:
+
+ ```python
+ import os
+
+ STATIC_ROOT = os.path.join(BASE_DIR, 'static')
+ ```
+
+2. Set the `STATIC_URL` variable in the `settings.py` file to the path of the `static` directory in the `django_backend` directory:
+
+ ```python
+ STATIC_URL = '/static/'
+ ```
+
+3. Run the following command to collect the static files:
+
+ ```bash
+ python manage.py collectstatic
+ ```
+
+If the issue is still not fixed, contact me at [info@movie-verse.com](mailto:info@movie-verse.com) so that I can take a look at your situation.
+
+#### API Service
+
+The API service is responsible for handling API requests from the frontend of MovieVerse. To get started with the API service, follow the steps outlined in this [README.md](databases/README.md#rest-apis) file.
+
#### Flask Service
The Flask service is responsible for handling basic backend functionalities of MovieVerse. To run the Flask service, follow these steps:
diff --git a/MovieVerse-Mobile/www/MovieVerse-Backend/django_backend/movieverse/models.py b/MovieVerse-Mobile/www/MovieVerse-Backend/django_backend/movieverse/models.py
index 6c825111..0ebf850c 100644
--- a/MovieVerse-Mobile/www/MovieVerse-Backend/django_backend/movieverse/models.py
+++ b/MovieVerse-Mobile/www/MovieVerse-Backend/django_backend/movieverse/models.py
@@ -19,7 +19,7 @@ def __str__(self):
class Movie(models.Model):
_id = models.ObjectIdField()
movieId = models.IntegerField(unique=True)
- title = models.CharField(max_length=255)
+ title = models.CharField(max_length=255, db_column='title')
overview = models.TextField(null=True, blank=True)
releaseDate = models.DateField(null=True, blank=True)
runtime = models.IntegerField(null=True, blank=True)
diff --git a/MovieVerse-Mobile/www/MovieVerse-Backend/django_backend/movieverse/templates/movieverse/search.html b/MovieVerse-Mobile/www/MovieVerse-Backend/django_backend/movieverse/templates/movieverse/search.html
index 28aab55b..4bd63004 100644
--- a/MovieVerse-Mobile/www/MovieVerse-Backend/django_backend/movieverse/templates/movieverse/search.html
+++ b/MovieVerse-Mobile/www/MovieVerse-Backend/django_backend/movieverse/templates/movieverse/search.html
@@ -77,6 +77,15 @@
border-radius: 5px;
cursor: pointer;
}
+ a {
+ text-decoration: none;
+ color: #2ecc71;
+ font-size: 1.2em;
+ margin-top: 20px;
+ }
+ a:hover {
+ text-decoration: underline;
+ }
@@ -86,23 +95,34 @@