Curious about what makes our website tick? Read all about it
Running a website in 2021 can be quite involved. Here's a rundown of the different things that are at play.
Content Management System
The CMS underpins the whole website. To manage all website content, we use the excellent Craft CMS. This system runs on PHP and gives us unlimited flexibility to create just about any kind of web page you can imagine.
We've modelled the CMS in such a way that allows non-coders to build feature-rich web pages without coding knowledge.
We've implemented a series of reusable block elements that can be dragged onto a page and the content in those blocks edited with ease.
We use a handful of third-party plugins to extend the functionality a little
- Solspace Calendar to manage multiple calendars for the church
- Solspace Freeform to provide a form builder for whatever purpose we need
- nystudio107 Image Optimiser to make our images work best on screens of all sizes
- nystudio107 SEOMatic to facilitate modern SEO best practices & implementation. It is a turnkey SEO system that is comprehensive, powerful, and flexible
- nystudio107 Web Perf helps you build & maintain high-quality websites through Real User Measurement of your website's performance
- Rias Scout to sync our sermon archive to Algolia search
We have 2 types of search on the site. The main site search comes courtesy of Craft CMS.
Our sermon browser is a lot more refined.
I think we have a world-class sermon browser thanks to Algolia. Algolia is a search-as-a-service platform; when we publish a sermon, the metadata from that sermon is passed to Algolia and we can then run advanced ranking measurements on the metadata from Algolia.
What you see as a user on the front-end is a search tool that is similar to the one you might see on an e-commerce website with filters of speakers and books of the Bible.
I don't do a lot of design work these days but this was my first approach to "designing in the browser". Breaking each site element (like site header/footer, heroes, image lockups, content block etc) into its own "thing" and then viewing that piece in the browser at different screen sizes until I'm happy.
We use the excellent Tailwind CSS utility library for styling our "things". Tailwind allows us to keep our styles lean, our site fast - by not repeating styles - and enables us to tweak design elements without the risk of those style changes leaking to other elements of the site.
Our pretty font is Canada Gibson in a variety of weights delivered by the Adobe Fonts web service.
Craft CMS runs out of an NGINX web server and MySQL database on Amazon Web Services. Our assets (images, video and audio) are delivered from another AWS service known as S3.
The server itself is managed using a service called Laravel Forge. Forge is hooked up to a GitHub repository (where we keep the website code). When one of us pushes a change to the code, Laravel Forge kicks off a deployment to implement the change.
Forge is also responsible for running our database backup schedule every night for disaster recovery.
For things that take time, generating images of varying sizes, we pass these to a queue so that you don't wait for them to process before you get the page returned. For this we use Redis.
Content Delivery Network
Our AWS sits behind Cloudflare to protect us from the dark side of the Internet and help make the site fast regardless of where in the world you're visiting from.
Any emails that the website sends is delivered by Mailgun.
Our code is backed up to GitHub where we can grant access to whoever needs it. It means we can work on the site on our own machines without impacting the live site. When a feature is ready to be deployed, we store it in a feature branch to be reviewed. When a review is complete, we merge the change or continue the change locally.
There's likely something we've not covered but if there's something specific you'd like to know, drop me an email [email protected] and I can answer and update this page.