This is a Craft CMS 4.x boilerplate MadeByShape use internally for projects.
It's built with the intention of being used with Tailwind CSS, VueJS and Alpine.js frameworks.
It uses both Webpack and Gulp (For now) to build the project.
composer create-project madebyshape/craft-cms
./craft setup
, instead manually edit the .env
file..env
is filled in, run ./craft install
npm run dev
Your go to for local development
npm run prod
Generates production assets (Minify, favicon etc). Perfect for running on server.
npm run setup
If project already exists, this will pull, migrate and apply project config and run dev tasks
.env
filegeneral.php
config/project.yaml
)Components are small bits of a template, e.g. a button, input field that then either make up a block or a full template. Use the components
folder and name each component file by it's use case e.g. inputField.twig
.
Make sure to describe each component at the top of each component file so other developers know how it is used. If the component accepts any attributes, make sure you include a description of these at the top of each component (Camel Case) file (See the components/_example.twig
) file.
Blocks are large chunks of markup, or made up of smaller components. E.g. a block could be a form, with button and input field components included. Use the blocks
folder and name each component file (Camel Case) by it's use case e.g. largeForm.twig
(If a SASS file exists for a block, use the same file name).
Blocks ideally should be selectable via a Matrix Field so CP users can pick and choose these per template. In some cases this might not be possible though, e.g. if the page is dynamically generated.
[] Use Webpack solely instead of a mixture of Webpack and Gulp [] Add Google Workbox [] rel="preload" fonts via a Webpack task [] Move some Twig components in to VueJS
MadeByShape - https://madebyshape.co.uk
Jason Mayo - https://github.com/bymayo / https://bymayo.co.uk
git clone --depth 1 https://github.com/Tribes-Agency/craft-3.git
git commit --amend -m "Initiate repo from template"
git remote set-url origin https://github.com/Tribes-Agency/<NAME>.git
git push origin