Building a website builder — Part 1.

published on 02 December 2019

People keep asking me how the website builder logic is set up. The “subdomains” and the “custom domains” parts are especially mysterious.

1*lecrskynjo1biatxpu5paw

I understand this looks a little magic from the outside. But things turn out to be very trivial once you figure each detail out. It’s just a web app after all 🙂

There are 4 magic parts in a website builder development:

  1. subdomains
  2. custom domains
  3. SSL certificates
  4. your own landing page (the website of a website builder)

Each magic part took me much time to establish. I hope my advice will save you this time and you will spend it on more important things (e.g. hanging out with family).

So.

I used https://github.com/jazzband/django-hosts for understanding where visitors come from: it can be a subdomain or a custom domain. Use such plugin to detect users coming from

I used Heroku as a server. You can add an asterisk subdomain there (for my project: *.unicornplatform.com). Add this once, and all the future subdomains are served successfully and automatically.

After settings up django-hosts your app will be able to receive and detect requests from any subdomains. So now if your user creates a new website with a random subdomain, your app will instantly recognize it.

Custom domains and SSL made me pull a lot of my hairs. It was very challenging. The biggest obstacle was Heroku specificity. You can easily add up to 10,000 custom domains to Heroku, but Heroku forces you to use CNAME as a DNS record. It will work, but your users will not be able to use their company email inboxes (because CNAME DNS record can not live alongside an MX record).

I run an AWS EC2 instance with an nginx. I simply use nginx proxy_pass to pass the requests to the Heroku app. My clients are asked to add an A-type DNS record (an IP of my instance) to their domain.

I also run Certbot on the AWS EC2 instance. Certbot allows to simply issue a Let’s Encrypt certificate and auto-renew it — a must-have for a website builder!

The last part was to create a landing page for my website builder. I did not know how to solve this problem until the day I actually began building my landing page. It turned out there is actually no problems with it: my app recognizes unicornplatform.com as one of the clients’ custom domain and serves as usual.

Bye!

Thanks for reading the first part of the “Building a website builder”. There is much more to come:

  • making the builder part
  • rendering templates
  • connecting integrations
  • uploading and serving pictures
  • gaining initial users
  • onboarding new users

You can learn more about me and the project here:

Read more

Runs on Unicorn Platform