Skip to content

beekmanbram/craft-cms-boilerplate

Repository files navigation

Craft CMS 5 Bootstrap Vite Boilerplate

This is a Craft CMS 5.x boilerplate Made by Bram Beekman use internally for projects, that I open sourced so anybody can use it. Inspired by MadeByShape TailwindCSS Vite Starter.

The Stack

Requirements

Plugins

Craft CMS

  • Vite
  • Minify
  • CKEditor
  • Navigation

Install

Create an empty folder and CD to it in terminal.

Option 1: Git

You can clone the repo from Github using Git CLI:

git clone https://github.com/beekmanbram/craft-cms-boilerplate.git .

Option 2: Manual

Download a copy of this repo to your computer using the Code button above, and choosing Download ZIP. Move these files to your empty folder.

2. Start DDEV, Install Craft CMS and dependencies

Firstly, edit .ddev/config.yaml and change the name to your project name.

Then, there are a few CLI commands (See more) I've created that allow starting DDEV, installing Craft CMS and installing dependencies. The one to get you started:

make install

3. Starting Vite

Once you've followed step 2 and it's successfully ran through the steps, you'll need to start Vite which allows you to start using front end tooling:

make dev

CLI commands

I've created a few commands to make development easier. All these commands are ran in terminal:

Command Description
make install Starts DDEV, Install Craft CMS and dependencies.
make dev Starts Vite development process.
make prod Run on production to start Vite build process - minify, compress etc.

Nice to know

Database

To access the database inside the DDEV environment, you can use TablePlus. You can use the following command to open TablePlus to export/import:

ddev tableplus

Exiting Vite

One thing that confused me in side the terminal was how to exi Vite once running a CLI command like make dev. You can't use ctrl + c like you would in a normal terminal. You need to use:

q + enter

HTTPS recommended

There is a few issues getting Vite, DDEV and Craft CMS running nicely together over HTTP, so always make sure you are using HTTPS. For DDEV just run:

ddev stop --all
mkcert -install
ddev start
ddev launch