An opinionated setup
The Lean Web Kit is an opinionated setup of a set of hand-picked services, with at its core:
- Vue + Nuxt - a modern app framework to build advanced sites & apps quickly.
- Dato CMS - a cloud-based environment to manage all your content.
- Netlify - an all-in-one hosting provider with A/B testing support, cloud functions and more.
To get started with the Lean Web Kit in your project, you’ll need to replicate this setup in 3 steps:
1. Clone the CMS
The first thing you’ll need to bootstrap your project is a clone of the CMS. To get a clone:
- Log in on the Dato CMS Dashboard with the shared Voorhoede developer credentials.
- Find the Lean Web Kit Template project.
- Select Duplicate from the options menu.
Your CMS is now ready to be used. To connect it to your app and hosting in the next steps, you’ll need to get your API Access Token from the CMS. Go to CMS > Settings (in top menu) > API tokens > Read-only API token and copy the API key:
In the example above, the API key is
2. Clone the app
mkdir my-lean-project cd my-lean-project/ npx degit voorhoede/lean-web-kit
Your app needs to be connected to your CMS. You can configure this in a
- Paste your API token after
With our example token this would be
You can now test that your app works by running:
npm install npm run dev
Your new app is now available on
For more info on the application’s code see the
readme.md files located in every directory.
Push the code of your new application to a new repository on GitHub, GitLab or Bitbucket. All three are supported by Netlify, which we’ll configure in the next step.
3. Deploy to Netlify
The final step is to deploy your new app to Netlify:
- Log in on Netlify (and sign up along the way if you don’t have an account yet).
- Create a new site by selecting “New site from git”.
- Follow the instructions to connect to your git provider and select your repository.
The basic build settings are automatically pre-filled based on the
netlify.toml file in your repository:
All that’s left is to connect your CMS by setting your API token under Advanced build settings:
Hit “Deploy site” to deploy your app.
Changes to your code (on the master branch) are now automatically deployed. To deploy a new version of your app when you publish content, you’ll also need to connect Netlify from your CMS. Go to CMS > Settings (in top menu) > Deployment settings > Production: