Last year, I’ve taken up the quest of building a blogging platform that would offer a worthy alternative to Medium, Substack and others by offering maximum ease of publishing while opening new possibilities on many levels of online content creation, such as:
- creating — by using online editor or any desktop/mobile app
- hosting — via white-label PWA or embeds on sites like Carrd
- earning — by implementing arbitrary paywall or commerce model
And as a bonus that readers of this particular article may appreciate, it caters for the needs of us — software engineers that do blogging.
After a year of heavy development and regular feature-packed releases, the time has come to take the experiences and put my love towards tech blogging into use by introducing the stack, getting into details on specific solutions and looking back at decisions made to see what worked and what didn’t when building Pubray.
Stack overview
Like already described in the initial release article, the Pubray stack is built with following core technologies:
- Phoenix as a blazing-fast, scalable, real-time web server with Phoenix LiveView to enable a real-time server-side rendering — an approach towards gluing web client with the server that vastly reduces the overhead of building APIs and unleashes super-productivity
- React to maximize the performance of crucial client-side pieces and bring in a healthy & rich ecosystem of libraries that go along with it
The idea behind this stack was to build a publishing platform that could handle a lot of traffic without huge costs and while offering dynamic features such as live preview of a publication and notifications. And considering it was a one-man mission, I wanted to enable the fastest possible development pace in order to give Pubray a chance to become a competitive option on a very saturated market.
Of course, that’s just the foundation and Pubray pulls in many other incredible pieces, such as:
- Slate as a rich text editor framework that allows to build completely custom editor experience while ensuring top-notch rendering performance to handle even longest write-ups
- MJML to generate and send beautiful e-mails that look great with all e-mail clients without having to implement 150 hacks for most problematic ones such as Outlook and Gmail
- GitHub used in multiple ways — from OAuth sign in and cloud sync (a.k.a. articles as code) feature to keeping the platform code and running CI/CD tasks when it’s updated
- Playwright as the most modern and efficient tool for end-to-end browser testing with support for all the top browsers (Chrome, Safari, Edge, Firefox) without the overhead of Selenium
- Docker to containerize the application along with the stack behind it in order to be able to run it in a predictable fashion on any development machine and production server
- Let’s Encrypt to issue certificates for custom domains and secure the connection between readers/writers and Pubray servers regardless of the way a particular Pubray space is hosted
…and many others.
Engineering blog
Of course adopting some pieces to this particular stack went smooth while others became a serious endevour to get right. That’s where this Pubray Engineering blog comes in. In the upcoming articles I’ll explore how these and other pieces come together in order to pull off all of the Pubray features that were released in last couple of months.
I’ll focus on the most interesting challenges that came up when building Pubray, ranging from the fields such as:
- completely custom WYSIWYG editor
- end-to-end support for custom domains
- image processing that doesn’t interrupt the writing
- gluing server-side rendering (LiveView) with “traditional ways”
- assembling e-mails without too much hacking
- tracking & syncing with Dropbox drives and GitHub repos
- localization including tooling & workflow for translations
- CI/CD that mixes performance, HA and low costs
It’s a pretty diverse scope so I see this blog becoming an interesting read for many software engineers — ranging from indie devs and founder wannabes (yup, I did it all on my own), web dev practitioners and enthusiasts (both front-end and back-end) and those interested in CI & DevOps (esp. if you’re into Playwright, Docker or GitHub Actions).
Obviously, it didn’t make sense to mix the technical stream into the general purpose Pubray Blog so, as usual, please keep an eye on that for product updates and misc user-facing write-ups.
Stay tuned by subscribing to this blog with the bell icon.