Angular.js Trivia Website

In the Spring 2023 Semester, I created a trivia website to help me practice both my geography knowledge and my full-stack development. Since GitHub Pages is incompatible with the Node.js backend, I cannot host it here.

One of the most common development stacks is called MEAN. A MEAN development stack consists of:
MongoDB - Database
Express.js - Library to implement Server
Angular.js - Front-end
Node.js - Backend Language

However, I used PostgreSQL instead of MongoDB as my database, since it is incredibly simple and easy to host locally. Here is what the interface looks like:

Angular is a commonly used front-end framework for designing Single-Page Applications (SPAs) such as this. I set up a simple PostgreSQL database that runs on my local machine that the Node/Express backend can access through standard HTTP protocol. The Frontend is also able to make queries to the API generated by the backend.

The game involves choosing two countries at random and choosing a category. The player will then choose the country with a higher value of that category (area, gdp, population). There is also a mode that involves choosing which country has the selected capital. The score will continuously count until it is recorded or the page is refreshed.

My biggest takeaway from the project is that I made the game too easy. Guessing whether the USA or Vatican City has a higher population is not exactly challenging. Further editions of the game will choose countries that are within a certain percentage of each other. I have made an updated version of this game that uses text input and a picture of the flag. Not worthy of front-page real estate, but I still made a page for it:
Flag Guesser

The relevant frontend/backend files can be found on GitHub (as it is quite tedious to place the whole project there): https://github.com/Bmeshanko/trivia-website