How WaggyLabs was created
The idea of creating a personal blog came to me in the Autumn 2018. I was inspired by other's blogs, popular sicence websites, and observing how scientific publishers were updating their websites to support enhance online preview. The main motivation, however, was underline by feeling the need to write continiously also in between preparing research manuscripts and grant application.
The continious writing since then did not work anyhow well as it turned out a complicated task to make myself write even simple posts about my onging whereabouts. Furthermore, few months later the first version of WaggyLabs (called Scientific Wagtail) became out of sync with Wagtail CSM, which it is based on. The changes in Wagtail between versions 2 and 3 were backwards incompatible especially in the Wagtail's editor interface, which broke how the custom blocks worked. Combined with unconvenient text editor in Wagtail version 2 adn difficulties to continiously update on the server it became quite unpleasant to use Scientific Wagtail editor interface.
Thus, about a year ago I started to develop WaggyLabs - a renewed and updated version of Scientific Wagtail. Compared to Scientific Wagtail, WaggyLabs features:
- New text editor supporting LaTeX equations, \ref, \label, \cite commands.
- Bootstrap themes that can be uploaded and configured for the site.
- Continious integration with Docker.
This post summarizes the steps to develop WaggyLabs. The demo preview can be found on the demo page.
Step 1. Choosing Wagtail.
I selected Wagtail CMS as the leading Django CMS used by many government agencies and companies. This means that Wagtail continies active development of new features, bugfixes and security patches.
Additionally, I really admired the approach of using Python to create the Wagtail istallation. Using the programming language instead of HTML building blocks to create WaggyLabs enabled me to develop the features I wanted which would be otherwise complicated to implement. Of course it came at a cost of longer setup time due to the longer lerning curve and due to the need to perform testing to reduce the number of bugs. But after all, I definitely would select Wagtail once again.
Step 2. Developing in local environment.
Scientific Wagtail's development was mainly guided by the AccordBox tutorial to develop a Wagtail CMS blog. At that time tutorial was free, but nowadays it under a paywall. Nevertheless, the code from that tutorial is still available.
I started the WaggyLabs development by implementing the various Bootstrap and custom components that I believed are useful for WaggyLabs. Next, I upgraded the Wagtail-Markdown text editor to handle LaTeX equations, referencing and citing features. The latter took me a pretty long time to make it working in browser. Still, the Javascript code for the text editor requires further improvement especially for the autocomplete functionality.
I also spent some time to develop the Site, Post List and Post pages to enable the general site and blogging functionality. There are as well probably some bugs, which will be removed along their discovery.
Step 3. PyPI package
After I developed the main WaggyLabs functionality, the next step was reshaping the code to upload the PyPI package. In order to do that, I followed the guides:
- Installable Django App.
- PEP-440 for the correct package versioning.
Note that instead of commonly used setup.cfg with the setuptools, I used the configuration based solely on pyptoject.toml file.
At this point the PyPI upload is not automated and I use the following three commands to upload the WaggyLabs package:
1 2 3 | |
Step 4. Continuous integration.
Finally, to overcome the crucial issue of WaggyLabs (and Scientific Wagtail) to update the code on the server, I spent quite a lot of time learning Docker conteinerization and GitHub actions.
The most helpful tutorials were:
- Docker website and its documentation, especially the docker compose reference.
- Docker Best Practices for Python Developers.
- Dockerizing Django with Postgres, Gunicorn and Nginx and its GitHub repository.
- .
Step 5. Running on server.
The final step was the server setup and encryption. Here, I checked the DigitalOcean tutorials on Ubuntu installation and updated the Docker containers to use Let's Encrypt service. The tutorials are:
- Initial Server Setup with Ubuntu 22.04.
- https://docs.digitalocean.com/developer-center/deploy-a-django-app-on-app-platform/.
- https://www.digitalocean.com/community/tutorials/how-to-install-and-use-docker-on-ubuntu-22-04.
- How To Use Docker with a UFW Firewall.
- Securing a Containerized Django Application with Let's Encrypt and its Github repo.
Future plans.
- Bug discovery and butfixes.
- Improve autocomplete in the text editor.
- Adopt Stimulus for frontend.
- Comments for posts.
- More new features and interface enhancements?
- Categories
-
Programming
- Tags
- WaggyLabs