onedarnleyroad / craftcms Goto Github PK
View Code? Open in Web Editor NEWA Craft CMS starter project using DDEV for local hosting and Vite for front-end bundling and HMR.
License: MIT License
A Craft CMS starter project using DDEV for local hosting and Vite for front-end bundling and HMR.
License: MIT License
Add this to .ddev/config.yaml
:
hooks:
post-start:
- exec: composer install
- exec: npm install
And then our Makefile up
command only needs to concern itself with DDEV.
On occasion, we need to take a site offline in front of Craft. For instance, if a big deployment is required, and we need to be able to respond to the visitor with an "offline" message without hitting Craft. With a simple, static "offline" HTML file available in /web
, it's easy to create a symlink of index.php
and point to this offline file during the deployment.
https://github.com/mmikkel/Retcon-Craft
Handy to have in every install.
Instead of hard-coding to Postmark, we should use generic SMTP_
environment variables, e.g.:
SMTP_HOST=""
SMTP_PORT=""
SMTP_USERNAME=""
SMTP_PASSWORD=""
Then in our .env.example
we can put in place the Mailhog values that are automatic from DDEV: https://ddev.readthedocs.io/en/latest/users/developer-tools/#email-capture-and-review
If we upgrade to the latest way that Craft does it, be sure to also:
web/index.php
craft
boostrap.php
We should remove this:
"platform": {
"php": "7.0"
}
It creates issues when attempting to install the Async Queue plugin.
@web
shouldn't be dynamically set in production, so the accepted convention right now is:
DEFAULT_SITE_URL
environment variable; and@web
alias to that in general.php, e.g.'aliases' => [
'@web' => env('DEFAULT_SITE_URL') ?? null
]
This thing is amazing and I can't believe we've never discovered it before:
We should start with boilerplate error template(s) that give us a better-than-default error page. Centre the logo & text, use tailwind, remove any content that might come from the DB.
Another useful utility when doing development: https://plugins.craftcms.com/templatecomments
There are .gitignore
rules within storage/
so we should remove it from ours.
Our general.php
config has this:
'allowAdminChanges' => false
Which seems wrong. It makes sense using project config, but we do not use projectConfig, and I can't see us using it any time soon, so we just end up being unable to administer the Production database, which is always supposed the single source of truth in the long run.
I don't know if this is something we code, can add as part of our (currently non-existent) setup script, or just document in the comments...
As outlined here:
https://nystudio107.com/blog/tips-for-using-seomatic-effectively#customized-setup
It is possible to use config/
to set some SEOmatic values, and since our "creater" type details (about 1DR) never change, we should just bake it into this boilerplate.
It's a minor issue, but during HMR dev, Vite won't re-copy contents of src/public
. So using something like chokidar to set up a simple watcher, run via concurrently, might be nice.
Among others we like to set environment, site version, and google analytics ID to a site-specific config file (so keep general.php clean).
That's our convention now.
Version-controlling the .ddev
folder is a Bad Idea, since the config's contents will change, depending on what version of DDEV is installed locally.
We often need to password-protect a site during development, and while there is this: https://github.com/verbb/knock-knock/
It has some shortcomings, namely that the login template is not at all customisable. And while it isn't too difficult to spin up a basic front-end login form for Craft users, it requires sharing a username/email and password, but typically during the development phase it's preferred to share a memorable and simple password only (so no username/email combo and no need to have a system user).
The boilerplate version could use cdn-hosted Tailwind that could likely be swapped out for a real site's tailwind with little customising necessary. It might also pair nicely with some boilerplate error pages... perhaps there is a possibility of sharing layouts?
Right now it's Craft's default install, but it might be nice to put our own spin on it.
Rather than:
// @var $isProduction boolean
$isProduction = env('ENVIRONMENT') == 'production';
We should just be doing traditional multi-environment config.
Change from using $PRIMARY_SITE_URL
to @web
, which I believe is more like the Craft convention. We do explicitly set @web
in our general/config.php
which is the important thing.
At a minimum something like this:
install: up build
ddev exec php craft setup/app-id \
$(filter-out $@,$(MAKECMDGOALS))
ddev exec php craft setup/security-key \
$(filter-out $@,$(MAKECMDGOALS))
ddev import-db --src=seed.sql
ddev exec php craft up
But it might be cool to modify install
to accept a flag? e.g. install --seed=snapshot.sql
Very cool Project!
have you tried to include critical css? I am currently working on a similar project and have an issue connected to puppeteer on my Mac M1 Max in ddev web container.
This are the containers specs
Linux craftcms-web 5.10.104-linuxkit #1 SMP PREEMPT Thu Mar 17 17:05:54 UTC 2022 aarch64 GNU/Linux
I used the rollup-plugin-critical https://github.com/nystudio107/rollup-plugin-critical Plugin which works perfekt in an MAMP Environment. Did all the necessary configs for ddev/docker described here https://nystudio107.com/docs/vite/#local-development-environment-setup
Turbo does this quite smartly:
https://turbo.hotwired.dev/handbook/drive#reloading-when-assets-change
As of 3.1.18, Craft::parseEnv() will now cast "true" and "false" to boolean values (see craftcms/cms@d2cd439#diff-d8ddf65622d053c914bb35ebd32ae05c). This largely satisfies the needs we were trying to address with the function env()
found within modules/onedarnleyroad/functions.php
.
This is a must-have in our toolset: https://github.com/marionnewlevant/craft-agnostic_fetch
Great to see someone's ddev Craft CMS setup!
I tried it out, installing via Composer, and immediately hit #38. Saw the fix was merged, so tried again following your instructions for installing with Git.
My impression: two changes would make it even easier for people to start from the unreleased bleeding edge
make init
?) would reduce 4 steps to 1I can make a pull request if you like the idea.
Brilliant Craft 3 starter—one of the few that actually works as expected!
When spinning it up on my machine, I noticed two simple typos that prevented successful building, however.
I have a branch on my fork with these changes fixed if you'd like a pull-request.
Installed already a couple of times following your instructions. But I keep getting the following issue.
` VITE v4.5.2 ready in 329 ms
➜ Local: http://localhost:3000/
➜ Network: http://172.27.0.3:3000/
➜ Network: http://192.168.208.3:3000/
➜ press h to show help
Shortcuts
press r to restart the server
press u to show server url
press o to open in browser
press c to clear console
press q to quit
node:events:491
throw er; // Unhandled 'error' event
^
Error: spawn xdg-open ENOENT
at Process.ChildProcess._handle.onexit (node:internal/child_process:285:19)
at onErrorNT (node:internal/child_process:485:16)
at processTicksAndRejections (node:internal/process/task_queues:83:21)
Emitted 'error' event on ChildProcess instance at:
at Process.ChildProcess._handle.onexit (node:internal/child_process:291:12)
at onErrorNT (node:internal/child_process:485:16)
at processTicksAndRejections (node:internal/process/task_queues:83:21) {
errno: -2,
code: 'ENOENT',
syscall: 'spawn xdg-open',
path: 'xdg-open',
spawnargs: [ 'http://localhost:3000/' ]
}
Failed to execute command npm run serve: exit status 1
make: *** [dev] Error 1`
Instead of this:
{% set element = craft.app.elements().getElementByUri(craft.app.request.getFullUri() ?: '__home__') %}
We should be doing this:
{% set element = craft.app.getUrlManager().getMatchedElement() %}
The URL Manager already has a memoized copy of the element.
What the title says...
Contents of templates/_layouts/base.twig
should be updated to:
{% for key, message in flashes|filter((v,k) => key in ['notice', 'error']) %}
console.log('{{ key }}:', '{{ message }}');
{% endfor %}
We should ensure that imagerUrl
is always absolute, so that image transforms in things like HTML emails use absolute URLs:
<?php
return [
// absolute URLs so that transformed images in emails work
'imagerUrl' => '@web/imager/'
];
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.