Game recommendation system using Machine Learning and Flask

Took so long to finish this project
.
└── Game-Recommendation-System
├── __init__.py # setup our app
├── auth.py # the auth routes for our app
├── Games.db # our database
├── main.py # the non-auth routes for our app
├── models.py # our user model
├── games.py # our ML personalized models
├── ml_utils.py # our uploader ML models
└── templates
├── base.html # contains common layout and links
├── index.html # show the home page
├── login.html # show the login form
├── profile.html # show the profile page
└── signup.html # show the signup form
└── games.html # show the games page
└── profile.html # show the profile page
└── 404.html # show the 404 error page
└── static
├── img
├── EA-Access.png # image for index.html
├── EA-Access@2x.png # image for index.html
├── GitHub-Contact.png # image for index.html
├── GitHub-Logo.jpg # image for index.html
├── Medium-Logo.jpg # image for index.html
├── css
├── 404.css # contais js script for 404.html
├── base.css # contais js script for base.html
├── index.css # contais js script for index.html
├── games.css # contais js script for games.html
├── profile.css # contais js script for profile.html
├── js
├── games.js # contais js script for games.js
├── index.js # contais js script for index.js
├── profile.js # contais js script for profile.js
├── csv # contains common csv files

SQL DB

For the sqlite database, since I have knowledge in BI, I chose to create a database (Games.db) to be able to store the data. So I can use the standard Python integration to make the Machine Learning model and load the data into Flask. So I created some tables and some views, to make it work locally.

Games by Genre
Games released by Year
Number of games released by Publisher
  • For the user to add the games to his profile, I created a validation rule, where he must register on the website, so that his profile is active first and then he can add it freely. The data in this register is inserted in a table called USER in sqlite.
  • In order for games to be added to the user’s profile, I used POST methods from Flask to insert the data into the USERGAMESPLAYED table of the database in sqlite. Therefore, it will store the corresponding user ID and the games it has played in the table.
  • If the user decides to delete any game from his profile, he can select the desired games in the table, after confirmation, the POST method of Flask is triggered again to delete this data from the same USERGAMESPLAYED table.
  • To perform the INSERT and DELETE commands in the sqlite database, and to bring the necessary data to Python, I used the SQLAlchemy library.

HTML, CSS and JS

For HTML, CSS and JS I used the DataTables plug-in to store the games (games.html) that can be added to the profile and to later show the games that were added to the user’s profile (profile.html). Therefore, using simple commands according to the DataTables documentation, it is possible to add an interactive table that has a search field, filter, sorting and even pagination automatically.

  • I added the option for the user to be able to download the recommendation according to their profile, and download the added games, using Flask’s GET method and exporting this data to a CSV file.
  • I used Bulma’s CSS framework, a Free and open source framework to be able to customize the website according to the need.

Machine Learning Models

Regarding the Machine Learning model, I really wanted to provide a personalized recommendation, so I didn’t find any (literally none) material or article for me to study or help me with, so instead of training the profile dataset only once of the user, I train the dataset a few times during the application, that is, whenever the dataset can be changed by the user (inserted, updated, deleted, etc.). So he can have the recommendation as updated as possible, according to his profile.

Conclusion

I confess that I was extremely proud and satisfied with the result of the project, mainly because I was able to integrate so many frameworks, libraries and technologies together and see everything working in the end, it is really very rewarding.

In love with the result

Online Project

The project is publishing to the GitHub repository according to the files needed for execution: Game-Recommendation-System Repository

App deployed

Difficulties

I’ve always been a fan of StackOverflow (one of the best communities in my opinion ♥), and during this project, in addition to the official documentation from libraries and frameworks, it was the one that helped me the most in problems that I spent hours and days trying to solve, mainly for having so much integrated technology. So the topics below cover one of the difficulties I’ve been on this project.

  • Create the GET method to make different downloads of different CSV files available.
  • Integrate with DataTables and create pagination in tables using Flask in HTML files.
  • Make changes to customizations in HTML and add a dropdown icon in the navbar according to the initials of the user’s name using the Bulma framework, integrated with Python and Flask.
  • Add personalized success and danger messages using Flask integrated with HTML.
  • Use a Python variable in JavaScript.
  • Obviously, understand how the flow and files needed for Flask to run.
  • Publish on Heroku (and see it working online and no longer locally), that part I suffered a lot (but still need changes)!
  • Show the games recommendation to the user, using the joblib library to import the saved machine learning models, and make the games recommendation interactively (this one really took me a long time).
  • Understanding of Relative Imports and Absolute Imports.

Future improvements

  • Improve the application on Heroku, because I’m totally new at deploy apps
  • Improve CSS and JS scripts, because I’m not an expert of those languages
  • Add “I forgot my password” button and workflow for the user to recover the password
  • Add interactive graphics using the dash library of Plotly or Power BI or Tableau, so that the user can follow the metrics of his profile.
  • Create an option to add games as wishlist (they were not played), and to show the difference from one to the other, so the recommendation will also consider these games.

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store