Content Comparison

...

We would only need to use one programming language throughout our app, allowing us to work efficiently and consistently
Many online resources are available for it, so the few members of our team who were unfamiliar with JavaScript would be able to learn it quickly
JavaScript is the best language for web apps like ours

↓ where does this go?

Data origin:

Scraping tools: Puppeteer in Javascript.

Result returned: targeted JSON data.

API design:

API:

Localhost:5000/ is the placeholder we will use.

There are 4 types we need to use:

...

GET: Get the information user need.

...

POST: Change false information.

...

PUT: Update the information to latest version .

...

↑ where does this go?

Backend - NodeJS, ExpressJS

NodeJS: an open-source, cross-platform runtime environment for JavaScript built on Google’s V8 engine
- We chose to use NodeJS as it is very simple to use and easy to learn.
- Since Node is event-driven, it can also enable asynchronous programming, which provides great performance compared to Python
- Since NodeJS is open-source and cross-platform, everyone in the team could develop the app regardless of their development environment
- By using NodeJS, we can also use NPM (node package manager), which allows us to install numerous libraries to use in our code to help in development. ExpressJS is an example of one of these libraries which is installed using NPM
ExpressJS: a backend web application framework that's used to design and build web apps quickly and easily
- We decided to use Express as it allows us to create RESTful routes easily. This is particularly useful as we will be developing our own API as part of the project, which we will need to create custom routes for
- Since Express is an very popular NPM library, it works well with Node
- Express also supports JSON, which we plan on using for our API to return results

...

MongoDB: a cross-platform, NoSQL database
- Initial thoughs on database selection might be MongoDBdatabase options are: MongoDB, PostgreSQL, SQLite
- We chose MongoDB as our database as our app isn’t very big, so we didn't need to use SQL
- MongoDB is more scable as it will inital a new data fields whenevery we create the documents in database, hence suitable for agile iteration when adding new feature later.
- Additionally, MongoDB integrates well with NodeJS, and stores data in JSON format, which matches the format our API will output in

...

PuppeteerJS: an open-source NodeJS library
- We use PuppeteerJS for scraping the website as the library allows the backend to run a headless (a code-only) version of Chrome to load the websites on.
- A headless version of Chrome doesn’t use as much resources and as such can be easily run in any server, such as the hosting servers that we are using.
- PuppeteerJS also have high-level API control of the Headless Chrome browser via the DevTools Protocol. This allows for the code to read the structure code of the website directly and to access the required parts of the website.
Morgan: HTTP request logger middleware for node.js
Winston: A logger for just about everything.
CORS: NPM package for solving Cross Origin Resouce Sharing problems

UI design - Material UI

Material UI (MUI): an open-source frontend framework for React components based on Google’s Material Design
- We decided to use MUI as it would make the development of our app quicker and easier. Since MUI defines its own components, we can use them to quickly design the UI of our app, instead of spending time writing our own CSS classes
- Since we had decided to use React for our frontend, and MUI uses React components, it was only logical we used MUI over other non-React frameworks such as Bootstrap
- Additionally, some of our team members already had some experience using it. The extensive documentation also means it will be quick and easy for the team members who haven’t used it before to pick up, as well as debug
- By using MUI, we can keep our frontend UI theme consistent, and even customise it to suit our needs

Versions Compared