This project aims to be a place for the gaming community to share their reviews of various video games via playthrough entries, and compare their thoughts to other users.
Make sure you have Node.js installed.
Run the following commands in the terminal:
git clone https://github.com/alanhwu/SaveStates.git
cd SaveStates/save_states && npm install
npm start
To start the backend servers, run node start_db.js
. Then visit
localhost:3000
in your browser of choice.
The general file structure for this project is as follows:
README.md (You are here!)
save_states/
└─── package.json
└─── package-lock.json
└─── start_db.js
└─── src/
└─── index.js
└─── Homepage.js
└─── Gamepage.js
└─── ...
└─── databases/
└─── user_info.db
└─── games.db
└─── ...
└─── public/
└─── logo.png
└─── ...
The package.json
file contains a bunch of macros and instructions for how
npm
(Node Package Manager) handles dependencies and different commands. The
main thing to take note of is the section under scripts
, which defines
commands such as npm start
(which you use to start the project).
This file contains the script necessary to locally host our databases (in
databases/
) at localhost:3001
, as well as allow for interaction with the
databases. There are functions to query the databases, as well as
add/change/remove items from them.
This folder contains the source files for the various webpages, which are
written mostly in JSX. Chief among these is src/index.js
, which uses routes to
define how all of the webpages link to each other.
This file utilizes Routes
from the react-router-dom
dependency to redirect
the user between various webpages. One can think of the webpages in this project
as belonging to a POSIX-esque file tree, where /
is the homepage and other
pages are given paths like /gamepage
. In fact, this is exactly what is
accomplished in src/index.js
, as seen below:
<Route path="/" element={<Homepage />}/>
<Route path="/game" element={<Gamepage />}/>
<Route path="/login" element={<Login />}/>
For example, the second line in the code snippet above defines the file path
/game
to use the file src/Gamepage.js
for its contents. You can verify
this yourself by visiting localhost:3000/game?Mario
(where Mario
is a search
query).
These files house the actual webpages themselves, and simply contain a function
that returns the contents of the webpage. Of note is the Link
XML tag, which
allows for redirects between pages using the aforementioned /
file tree schema
for organizing the webpages. Most of these pages utlilize the APIs in
start_db.js
in order to dynamically populate the page contents.
Contains the backend databases that contain all of the data. In this project we have three databases:
user_info.db
---Stores information about the user, such asusername
,followers
, etc.games.db
---Stores information about the games, such asName
,CoverArt
, etc.reviews.db
---Stores information about the games, such asentryName
,entryRating
, etc.
Contains some auto-generated files that ensure the project runs.