The Monostack
---
TL;DR The Monostack concept is about using a single coherent technology stack for any kind of project. Wether its a one page marketing website or a full blown application, or both. You can build it with a Monostack. It's all about making your life as developer and maker easier in this challenging but exciting era of web development. The Monostack I'm going to discover is LIVT (Laravel, Inertia, Vue, Tailwind CSS) + a lot of curated packages and services.
---
In my previous blog post I spoke about how things were slowing down for me and that I want to start doing things differently. To facilitate that change I need to simplify and streamline the way I build, maintain and develop my projects. The next months I'm going to explore the concept of the Monostack which I think will help me achieve my goals, but make your life as a developer and maker easier as well. Before I get into the concept I want to get clear on the goals I want to focus on this year:
Increase sales with my one man design/development studio
This is my main source of income and I simply need to keep it going.
Become a maker
Who doesn't want to have their own product? Besides, I have all the skills it takes to become a creator and I postponed acting on it for far too long.
Share my knowledge on this blog
I like to help people and I have a lot of knowledge in my field that other people could benefit from as well.
Start a community
I hope to get in touch with like-minded people and gather them so we can help each other and progress at a much faster rate.
The concept
The current state of web development is exciting but is hard to keep up with. Therefore, I think focus is more important than ever. This is what the Monostack is all about. By focusing on one coherent technology stack makes it easier to keep up with the pace, go more in-depth with the tools you use, and ultimately build more powerful solutions more quickly and efficiently. Let's take a look at the key features of a Monostack.
One backend framework
For years I built projects with Wordpress but now I'm much more in favour of Laravel. Working with two frameworks is cutting my focus and time in half to become really good with Laravel. Dropping Wordpress in favour of Statamic lets me go all-in with Laravel.
One frontend framework
The same can be applied to the frontend. By only working with one frontend framework like Vue, React or Svelte it will become easier to gain more in-depth knowledge. This will make you more valuable as a developer as you will be able to create more complex components and functionalities.
One CSS framework
This is a no-brainer. Tailwind CSS all the way. Same benefits for the backend and frontend frameworks apply here.
Go modular with packages
More and more projects that provided their solutions as a standalone application (for example Statamic and Mailcoach) are now available as a package. This allows you to add really powerful functionality to your existing project. This also allows you start of small and grow your project gradually with whatever you need.
Power up with the right services and tools
As a developer you can make your live so much easier, and joyful with the right services and tools. However, an artisan isn't defined by the tools he uses but by how well he can wield them. The Monostack makes it really easy to apply the same knowledge, skills and settings of services and tools across similar set up projects. This makes it easier to reach and use the full potential of whatever services or tools you're using.
Automate
When adhering to the Monostack your projects will all be structured the same. This makes it perfect to invest in automation. By automating as much as we can, we can greatly improve all stages of development.
Great documentation & guides
To get the most out of a Monostack documentation and guides will play a big role. It makes it easier for newcomers to get up to speed and its perfect to share new insights and techniques.
The benefits
Applying the Monostack will result in quite some benefits compared to supporting multiple stacks.
Easier to set up
By having a predefined stack and having automation in place we can setup new projects in minutes instead of hours.
Easier to develop
As every project is structured the same it's easier to gain and maintain speed when building new functionalities. It also makes it easier to apply solutions for problems you already solved in other projects.
Easier to extend
By having a curated list of packages and guides it will become easier to find and implement them in your project making the best use of them.
Easier to deploy
As every project is set up the same way, deploying can be done the same way as well. Making it worth to invest in a highly optimised deployment flow that all your projects could benefit from.
Easier to maintain
By updating one project makes it easier to update other projects as well as you can apply the same knowledge.
Easier to collaborate
By using a Monostack it also makes it easier to collaborate as you intuitively know how everything is wired up and configured.
Better use of system resources
With all your projects being run from a single code base you can make better use of the background services and workers that run on your production system.
Compound improvements
Improvements in one project can improve all of your projects. Add automation and you can easily update/upgrade all your projects at once
This all sounds great, but what does it look like in practice?
As mentioned earlier, the Monostack doesn't dictate a certain technology stack. It's all up to you as a developer. Having said that, I do have a clear vision what my ideal Monostack looks like. It basically comes down to:
Frontend framework - Vue
CSS framework - Tailwind CSS
But wait...
This just sounds like the LIT/VILT stack or TALL stack you might say. You're correct, the base is the same. However, they don't provide additional documentation on best practices, what additional packages to pick or how to deploy your projects and maintain them.
A Monostack is supposed to provide also guidance on how to set up, run, deploy and maintain your applications. The Monostack I'm going to explore is LIVT stack (basically LIT stack with additional packages and services). Some of the topics I'm going to write about are:
Installing and setting up packages
Laravel Debugbar - Keeping track of system resources while developing
Statamic - for CMS
Mailcoach - for Newsletters
Jetstream - application scaffolding
Ziggy - makes routes accessible in js/vue
Laravel Translations Loader - adding multilanguage support for js/vue
Pest - testing framework
Dusk - browser tests
Lasso - Speeding up your deployments by precompiling assets
Using premium services and tools
Flareapp - error traking in production
Ohdear - uptime monitoring
Tinkerwell - conceptualizing new features and executing simple tasks
Ray - Code debugging
ploi - Server management and deployments
GitHub - Repository management + CI/CD
Postmark - Email service provider
Automation
For automation I'm going to show you how to use Ansible. This might seem overkill but its really powerful and is actually quite easy to work with once you understand the basics.
Devops
I will talk about setting up your local development, staging and production environment
Do I need to apply everything you're going to write about to gain benefits?
No, the topics I'm going to write about can be applied on virtually any Laravel based project. So apply what you like and skip the things you're not interested in.
Alright lets go!
If you made it this far I assume you have at least some interest in the concept of the Monostack and in particular the stack I'm going to focus on. In the next months I'm going to touch all topics and I hope you will be joining me on this journey. If you do, make sure to follow me on Twitter and subscribe on my newsletter to not miss any articles. I hopefully see you again in my next post!