davidhellmann / craftcms-unpoly Goto Github PK

A Craft CMS starter project using DDEV for local hosting and Vite for front-end bundling and HMR.

1DR.Starter.Project.mp4

☝️ A 1-min video demo, going from zero to Vite HMR on a fresh Craft install, with only 3 CLI commands:

1. composer create-project...
2. make install
3. make dev

• DDEV for local development
• Vite 2.x for front-end bundling & HMR
• Tailwind 3.x for utility-first CSS
• Alpine 2.x for lightweight reactivity
• DeployHQ for automated deployment
• Postmark for email delivery
• Makefile for common CLI commands

1. Docker
2. DDEV, minimum version 1.19
3. Optional but recommended, Composer

If you have Composer installed on your local machine, you can use create-project to pull the latest tagged release.

Open terminal prompt, and run:

composer create-project onedarnleyroad/craftcms PATH --no-install

Make sure that PATH is a new or existing and empty folder.

Alternatively you can clone the repo via the Git CLI:

git clone [email protected]:onedarnleyroad/craftcms.git PATH

Make sure that PATH is a new or existing and empty folder.

Next, you'll want to discard the existing /.git directory. In the terminal, run:

cd PATH
rm -rf .git

Last, clean up and set some default files for use:

cp .env.example .env
mv -f composer.json.default composer.json
mv -f .gitignore.default .gitignore
rm CHANGELOG.md && rm LICENSE.md && rm README.md

Download a copy of the repo to your local machine and move to where you want to your project to run. Similar to above, you'll then want to clean up and set some default files for use. In the terminal, run:

cd PATH
cp .env.example .env
mv -f composer.json.default composer.json
mv -f .gitignore.default .gitignore
rm CHANGELOG.md && rm LICENSE.md && rm README.md

Note: This section is optional. If you are simply test-driving this project, feel free to skip to the next section. ⚡

To configure your project to operate on a domain other than https://craftcms.ddev.site, run:

ddev config

Follow the prompts.

• Project name: e.g. mysite would result in a project URL of https://mysite.ddev.site (make note of this for later in the installation process)
• Docroot location: defaults to web, keep as-is
• Project Type: defaults to php, keep as-is

To install a clean version of Craft, run:

make install

Follow the prompts.

This command will:

1. Copy your local SSH keys into the container (handy if you are setting up craft-scripts)
2. Start your DDEV project
3. Install Composer
4. Install npm
5. Do a one-time build of Vite
6. Generate APP_ID and save to your .env file
7. Generate SECURITY_KEY and save to your .env file
8. Installing Craft for the first time, allowing you to set the admin's account credentials
9. Install all Craft plugins

Once the process is complete, type ddev launch to open the project in your default browser. 🚀

To begin development with Vite's dev server & HMR, run:

make dev

This command will:

1. Copy your local SSH keys into the container (handy if you are setting up craft-scripts)
2. Start your DDEV project
3. Install Composer
4. Install npm
5. Do a one-time build of Vite
6. Spin up the Vite dev server

Open up a browser to your project domain to verify that Vite is connected. Begin crafting beautiful things. ❤️

A Makefile has been included to provide a unified CLI for common development commands.

• make install - Runs a complete one-time process to set the project up and install Craft.
• make up - Starts the DDEV project, ensuring that SSH keys have been added, and npm & Composer have been installed.
• make dev - Runs a one-time build of all front-end assets, then starts Vite's server for HMR.
• make build - Builds all front-end assets.
• make composer xxx - Run Composer commands inside the container, e.g. make composer install
• make craft xxx - Run Craft commands inside the container, e.g. make craft project-config/touch
• make npm xxx - Run npm commands inside the container, e.g. make npm install
• make pull - Pull remote db & assets (requires setting up craft-scripts

1. Agnostic Fetch
2. Async Queue
3. CP Field Inspect
4. Craft Autocomplete
5. Imager-X
6. Knock Knock
7. Postmark
8. Redactor
9. Seomatic
10. Typed Link Field
11. Vite

1. Aspect Ratio
2. Line Clamp
3. Typography

1. AlpineJS
2. Lazysizes

• Continue to improve docs
• Bugfixes, new features

Aside from the obvious gratitude owed to the entire team at Pixel & Tonic for their tireless work on Craft, a special thanks goes out to Andrew Welch of nystudio107. Not only has he developed some of the most widely used plugins in the Craft ecosystem, he has dedicated countless time and energy to pushing all of us in the community to excel at everything we do. He has an uncanny ability to see through the fog of development war to know what's best - not just for us, but for our future selves, our clients, and the users of the sites we build. His contributions have made all of our sites perform better in SEO, run faster in the browser, and made our development workflow more streamlined and efficient. Hats off to you, sir.