DEV Community

Dmitry Miasnenko
Dmitry Miasnenko

Posted on

sero - self hosted surge.sh analog

REPOSITORY ON GITHUB

Lightning-fast, static web publishing with zero configuration and full control

πŸ“– Table Of Contents

πŸ”§ Tools

Sero - this tool is used to upload your site to sero servers

❓ About The Project

This project is essentially a revamp of the well-known surge.sh platform. While surge.sh is a fantastic tool for publishing web applications, I noticed it lacked certain features that could significantly enhance its utility. Therefore, I decided to create my own version, incorporating those missing elements to provide a more comprehensive and seamless user experience.

One key feature that it is self-hosted. This gives users more flexibility and control over their projects, allowing them to truly make their work their own. My goal with this project is to create a platform that not only meets but exceeds the needs of web developers, making the process of publishing web applications as hassle-free and efficient as possible. It also has some features that are not in surge.sh

So saying shortly this is a simple web server for static websites but with an ability to deploy it with custom subdomain without any configuration using cli tool. On upload it will automatically create subdomain for your site.

This is a cli tool for upload tool

πŸš€ Features

  • Deploy in seconds without configuration
  • Enable and disable site new
  • Download site new
  • Limits control new
  • Easy upload with cli tool
  • Custom 404.html (on 404 status user will see your 404.html)
  • Custom 503.html new (on disabled site)
  • Clean urls /index.html can be accessed at /index
  • Redirect from / to /index.html

πŸ”Œ Built With

⌨️ Getting Started

Prerequisites

That is what you will need to deploy this project

  • You need to buy a domain
  • You need a server
  • You need access to DNS records
  • You need to have docker-compose installed

Installation

Clone this repository

git clone https://github.com/clowzed/sero
Enter fullscreen mode Exit fullscreen mode

✏️ Configure DNS records

  • Add wildcard subdomain to your server.

It is usually done by adding TXT DNS record with value "*" pointing to your server

✏️ Configure docker-compose.yml

Simply open a docker-compose.yml file from this repo with any redactor you link

  1. Configure your domain and zone (for example I bought example.com) (lines 30 and 31)
environment variable description
DOMAIN example
ZONE com
  1. Configure desired limits if you want (you can skip this)
environment variable description already set
MAX_USERS Maximum amount of users to be registered 1
MAX_SITES_PER_USER Maximum amount of sites which each user can upload 100
MAX_BODY_LIMIT_BYTES Maximum body limit in bytes 10000000 (10mb)

πŸš€ Deploy

docker-compose up -d
Enter fullscreen mode Exit fullscreen mode

✨ Usage

Let see an example of uploading your site to your sero server.

Consider our domain is awesome.com

Installing cli tool

npm i -g @clowzed/sero
Enter fullscreen mode Exit fullscreen mode

πŸ†• Creating and initializing folder

mkdir our-website
cd our-website
sero init # This will generate default sero.toml file
Enter fullscreen mode Exit fullscreen mode

πŸ†• Creating index.html

echo "Hello from our website!" > index.html
Enter fullscreen mode Exit fullscreen mode

πŸ” Inspecting sero.toml

Tha is how default sero.toml file looks like

[credentials]
username = "clowzed" # Here will be your hostname
password = ""

[server]
url = "http://sero.com/" 
subdomain = "clowzed"
Enter fullscreen mode Exit fullscreen mode

✏️ Changing sero.toml

So now we need to change url to point to our server.

We also want to change subdomain for our website

[credentials]
username = "clowzed"
password = ""

[server]
url = "http://awesome.com/" 
subdomain = "oursite"
Enter fullscreen mode Exit fullscreen mode

⬆️ Registration and uploading

sero register # We need to call it this only if we've changed username
sero upload
Enter fullscreen mode Exit fullscreen mode

Now your site is available at http://oursite.awesome.com/

Advanced usage with new features

1) Disabling site new

You can disable your site using this command.

sero disable
Enter fullscreen mode Exit fullscreen mode

This will preserve your subdomain so other users will not be able to borrow it.
This will return 503 status code for any request to site with your subdomain.
You can create 503.html file so it will be returned to user. You can do it for maintenance. The 503.html file should be at root of your folder

2) You can enable site with this command. Now it will work as usual. new

sero enable
Enter fullscreen mode Exit fullscreen mode

3) Download your site new

You can easily download your site as zip with this command

sero download
Enter fullscreen mode Exit fullscreen mode

4) Delete your site and free subdomain

sero teardown
Enter fullscreen mode Exit fullscreen mode

Thank you for reading this. If you want to contact here is my mail : clowzed.work@gmail.com

Fell free to use this project, create issues and pull requests!

Top comments (3)

Collapse
 
schemetastic profile image
Schemetastic (Rodrigo)

Wow! Interesting project!

Do you plan to make a SaaS out of this?

Welcome to the DEV community BTW!

Collapse
 
clowzed profile image
Dmitry Miasnenko • Edited

Hi! Thanks for your comment!
I think I will, it's just a matter of time.
It's little nervous to post something you made for the first time.
Such people as you inspire confidence to continue

Collapse
 
schemetastic profile image
Schemetastic (Rodrigo)

My pleasure! I'll try to test this very soon and get to you with feedback.