An open-source unblocked games website built with simplicity in mind.
- Clean and Easy to use UI
- 300+ Games
- Tab Cloaking / Disguise
git clone --branch v3 https://github.com/Radon-Games/Radon-Games.git
cd Radon-Games
npm ci
The development server has hot module replacement for ease of development. THIS SHOULD NOT BE USED FOR PRODUCTION.
npm run dev
In order to add games to Radon, you will first need to download the game files using some form of a website scraper. Once you have the game files, you will have to upload them to the Radon-Games-Assets in the corresponding folder. Once the games have been uploaded to the repository, you will need to edit the src/data/games.json
add add an entry for the game.
The build assets will appear in the /dist/public
directory. You can run the production version with npm start
although it is reccomended to process these files statically through Caddy file_server
API (see more information below).
npm run build
The recommended way to configure Radon is through Caddy. Caddy provides an easy to use and understand API for handling HTTP requests. This repository doesn't contain any game files due to the large file sizes. All the games are hosted on a separate repository found here.
In order to properly serve these files you need to use a reverse proxy to handle the different routes. Radon also hosts its own TOMP Bare server that needs to be proxied.
Radon uses Caddy file_server
API to serve the static files.
(radon) {
tls internal # We also reccomend using cloudflare to proxy requests so SSL doesn't have to be configured on the server
encode gzip # Apply gzip compression
... # Handle game files and Bare server
handle {
root * Radon-Games/dist/public
try_files {path} /index.html # Handle non `/` routes
file_server
}
}
In order to handle game files you will first have to clone the assets repository into your base directory.
git clone https://github.com/Radon-Games/Radon-Games-Assets.git
Once the files have been cloned you have to handle the /cdn/*
route used by Radon in your Caddy configuration file. The easiest way to do this is by directly serving the files through file_server
. However, Radon uses query string parameters when requesting images to lower loading times and bandwidth usage. In order to handle these requests, you can optionally choose to use caddy-imagefilter as seen in the advanced implementation.
(radon) {
...
handle /cdn/* {
uri strip_prefix /cdn
root * Radon-Games-Assets
file_server
}
...
}
{
order image_filter before file_server
}
# CDN Snippet
(cdn) {
uri strip_prefix /cdn
root * Radon-Games-Assets
file_server
@thumbnail {
path_regexp thumb /.+\.(jpg|jpeg|png|gif|bmp|tif|tiff|webp)$
query w=*
query h=*
}
image_filter @thumbnail {
resize {query.w} {query.h}
}
}
# Website Snippet
(radon) {
...
handle /cdn/* {
import cdn
}
...
}
Radon also hosts its own Bare Server in order for proxies to request content.
Before we configure Caddy to handle proxied requests we need to set up a Bare Server. We run the bare server using a node process manager called pm2 although it is not required.
npm i -g pm2 @tomphttp/bare-server-node
pm2 start "bare-server-node --host=127.0.0.1 --port=8080" -n Bare
This will start the Bare server in the background but if the server restarts it will not be restarted. In order to fix this we must save the pm2 configuration and tell it to run on startup.
pm2 save
pm2 startup
(radon) {
...
handle /bare/* {
uri strip_prefix /bare
reverse_proxy 127.0.0.1:8080 # Change port number to the port used by your bare server
}
...
}
# Website Snippet
(radon) {
tls internal
encode gzip
handle /bare/* {
uri strip_prefix /bare
reverse_proxy 127.0.0.1:8080
}
handle /cdn/* {
uri strip_prefix /cdn
root * Radon-Games-Assets
file_server
}
handle {
root * Radon-Games/dist/public
try_files {path} /index.html
file_server
}
}
{
order image_filter before file_server
}
# CDN Snippet
(cdn) {
uri strip_prefix /cdn
root * Radon-Games-Assets
file_server
@thumbnail {
path_regexp thumb /.+\.(jpg|jpeg|png|gif|bmp|tif|tiff|webp)$
query w=*
query h=*
}
image_filter @thumbnail {
resize {query.w} {query.h}
}
}
# Website Snippet
(radon) {
tls internal
encode gzip
handle /bare/* {
uri strip_prefix /bare
reverse_proxy 127.0.0.1:8080
}
handle /cdn/* {
import cdn
}
handle {
root * Radon-Games/dist/public
try_files {path} /index.html
file_server
}
}
We recommend proxying your domains through Cloudflare in order to help prevent against DDoS attacks and to simplify the number of steps on the server. If you don't know how to setup your domain through Cloudflare please check out the Cloudflare Docs.
Once your domain has been added to Cloudflare you should create A
records pointing to the IP address of your server.
Caddy allows for multiple different domains to be handled separately by the same server. This means that by default Caddy isn't going to reply with any information because we haven't told it what domains we want to use.
example.com, www.example.com { # List of domains
import radon
}
If you are configuring multiple domains you may want to have Caddy reply to all requests no matter what domain they are coming from, you can tell Caddy to listen on specific ports such as port 80 (default HTTP port).
:80 {
import radon
}
Doing this also requires you to change your SSL/TLS encryption mode to Flexible
from within Cloudflare as your server is no longer serving content through HTTPS.
- solid-slider
- fuzzysort
- vanilla-tilt
- Ultraviolet (proxy)
- STOMP (proxy)
- DIP (proxy)