PPSSPP Website
This is the entire frontend for the official ppsspp.org website.
It's built using Docusaurus 2, a modern static website generator using React, with some rather heavy customizations here and there to add a login system.
Backend and authentication
The backend is not (yet?) open source.
Authentication is done using httponly cookies, which means that client side javascript can't see them. Thus, we also keep a record of the current login state in localstorage. Could also use a client-visible cookie but localstorage was just easier.
In root.js, we wrap everything in <BrowserOnly> so that we can have dynamic content. Ideally, we'd only use that in the navbar (for the login indicator) and on the select few pages where it matters - it's a future project to try to get to such a state.
Local testing instructions
Prerequisites:
-
On Windows, you probably should use a WSL shell. IF you've checked out in a /mnt directory, you'll want to be using WSL 1. You can change version with
wsl --set-version Ubuntu 1or similar in PowerShell, if you're on v2. -
Node must be installed:
sudo apt npm installIf you are using an ubuntu WSL, install npm from here. Also it must be a Ubuntu 22, so if you have an older one, uninstall and reinstall your ubuntu WSL.
Local testing:
./switch.sh local
npm update
npm run start (not serve! that's for serving the build directory, after npm build)
That will launch the site on localhost:3000.
Deploy instructions
NOTE: Currently, only hrydgard does this.
Prerequisites: See Local Testing Instructions.
If upgrading PPSSPP versions, regenerate static/downloads.json using util/dirtree-json. That will have its own README.md.
Use one of the below as appropriate:
./deploy.sh dev (deploys to dev.ppsspp.org)
./deploy.sh prod (deploys to www.ppsspp.org)