Boilerplates to Accelerate Development Sean Smith

Who am I? • Solo developer https://caffeinecreations.ca • Website 101 Podcast https://website101podcast.com • Toronto Craft Slack https://caffeinecreations.slack.com/ • Photography Enthusiast https://vero.co/createsean

Overview • What is a boilerplate? • What to include and exclude • Documentation • Using Packagist

What is a Boilerplate? • Boilerplate is code or configuration that can be used over and over in order to save time. • It’s a template for your site building process • DRY

cuts out the repetition, I wouldn't make the salt and pepper for a recipe Kevin Nicholson - Freelancer

Utilizing a Craft CMS boilerplate for our web projects streamlines the development process and provides a solid foundation to build from. More importantly, it allows our team to focus on creating unique designs while expediting project timelines and enhancing overall workflow efficiency. Ashleigh – Project Manager

My Motivation • Tired of recreating the same configurations and settings over and over • Frustrated with opening different sites to crib code or settings • Save time – several hours at the beginning of a project

The Goal • The goal is to save you time when starting a new project. • DRY – code, config, channels, & fields

What to Include • Build process Vite, Laravel Mix, etc.. • Common site elements such as navbar, news section, homepage, contact page, etc • Content builder with common block types such as copy, video embed, related entries, slider • Hero options slider, basic, enhanced

What to Include • Plugins commonly used on every site you build CKEditor, Retcon, SEOmatic, Sprig, Knock Knock • Developer QOL plugins such as: Asset Rev, Environment Label, Control Panel CSS • Templates multiple options prebuilt and just uncomment. i.e. A standard navbar with dropdowns or an off-canvas menu

What to Exclude • Fields and sections that are likely to be one offs • Advanced Functionality multifaceted search, complex forms • Plugins that you do not use on every site For example Google Maps,

Documentation • Documentation Important to keep this updated • Code – include examples to help get set up or instructions for something that may not be obvious • Open to the public Be verbose and write even more documentation

Packagist • https://packagist.org • Useful if you want to make it easy for anyone to install with one line of code. • Running the create command will install vendor packages • Without packagist you can clone and do a few extra steps.

Packagist • You can also have the dotenv created and run craft commands as part of the install process. Add the following to the scripts section of your composer.json file. "scripts": { "post-root-package-install": [ "@php -r \"file_exists('.env') || copy('.env.example', '.env');\"" ], "post-create-project-cmd": [ "@php craft setup/security-key", "@php craft setup/app-id" ] }

Unseen Advantages • Conventions set standards and best practices • Accessibility prebuilt components are accessible • Documentation easy to onboard other developers

Disadvantages

Demo • Launch Demo • View starter github

Website 101 Podcast Podcast Episode about boilerplates https://tinyurl.com/boilerplates-for-web

My Boilerplate https://github.com/CreateSean/craft-starter One command – requires setting up packagist composer create-project createsean/craft-starter .

Get Started • Use my starter • Search Packagist and use another starter • Fork a starter and customize to your liking • Build a new starter from scratch

Resources • https://packagist.org • https://website101podcast.com • https://caffeinecreations.slack.com/ • https://github.com/CreateSean/craft-starter