CMS recommendation?

[vital socket]

Hello everyone,

A few months back, I (junior dev) built my first website for an acquaintance.
One of its initial requests was to be able to add/modify content without technical knowledge.
During our initial discussion, he also mentioned the possibility of using Wordpress (since it was included with the hosting package he subscribed to) but after a bit of digging into the Astro documentation, I learned about CMS and thought DecapCMS might be a good fit.
So I went ahead and developed the site with Astro but in the end, as I wasn't sure that the CMS would meet my/its needs, I temporarily gave up on integrating one and ended up creating the pages for the existing projects myself.

I'd now like to tackle this integration, but I'm still not sure which (if any) would fit.

here's some information to consider:

• The repo relies on a GitHub Actions to automatically handle the deployment on the hosting provider's platform via SSH
• Ideally, project pages shouldnt be restricted to a single template, but enable various layout capabilities.
  e.g. one project page could have [text block][2 images side-by-side][text block (bottom of the page)]while another could have [text block (top-left) & image (top-right)][text block][image (bottom-left) & text block (bottom-right)] and so on
• Every project page is accompanied by one or more albums (ranging from a few dozen to a hundred or so photos)

Note that those albums are currently stored on the server directly and arranged by project and by album somewhere in the /src/assets/ so that I could relatively easily include entire albums.
e.g. for project1 I would have the following import statements in the frontmatter:

const album1 = import.meta.glob<{ default: ImageMetadata }>("/src/assets/projects/project1/album1/*.{png,jpg,jpeg,webp}");
const album2 = import.meta.glob<{ default: ImageMetadata }>("/src/assets/projects/project1/album2/*.{png,jpg,jpeg,webp}");

and use the following logic to include them on the page:

{Object.keys(album1).map((filePath) => ( <Picture src={album1[filePath]()} /> ) )}

which means I can't get by with .md files (most likely?)

I saw the mega-thread and will obviously give it a read. Still, I thought it deserved its own post so as not to pollute the existing discussion.

Note that I'm also open to any advice regarding code adjustment if necessary, to make CMS integration easier/feasible

Don't hesitate to ask for further details or clarification if required.

Thanks for your time, have a nice week-end

[real trellis]

See the pinned post! 😄

[serene compass]

Hello!

I had the same goals as you, started with Astro to help non-techies with their websites.

I decided to go with Cloudinary to store images and figured out how to optimise images finally.

My project is not complete, but I suspect you will be deeply interested to see the direction I've taken.

v0 using cloudflare, notion as cms, GH actions to upload images
v1 moved to tinacms
v2 moved to vercel
v3 tailwind, cloudinary

My recommendations

I use TinaCMS, but im cautiously optimistic today on investing heavily into content managers because there are great ones around the corner (studioCMS) and also there's keystatic.

Why I use TinaCMS

The key features I like about TinaCMS are

• visual editing
• markdown processing
• looks good on mobile
• tinafield links

I haven't figured out how to do some things like Safari's built in screen reader to work.

Why not use TinaCMS

Seems there has been slowing development than in 2022, as it matures. This also shows up in discontinuity of documentation, due to breaking changes some time between 2022-2023. I suspect the team structure has changed. They may be focusing on another project in parallel.

I think Next.js receives first class support and documentation, Astro not so much.

[vital socket]

Hi @serene compass , thanks for your feedback

I had also considered Cloudinary as it has integration with Decap CMS, but the only pros I could see from the outset is the time saved during build process (as it currently have to generate each images in the different formats each time). I generated all project images upfront (2 or 3 versions for each, to fit in gallery/mosaic/etc views) and optimizations such as file format & lazy loading are made within Astro directly.
But I guess Cloudinary may provide advanced features in this regard, and my current solution relying on the user to manually create various version of the same image does not seem viable at all now that I think of it.. Hopefully Cloudinary will make this trivial.

what I can't figure out tho is how I could effectively setup the whole thing to match my use case. Regardless of the CMS, it seems to me that most doc/video tutorials illustrate relatively basic cases with a blog post scheme similar to [title, publish date, hero image, description].
What if I want to allow the user to create a new project page with not only a single image, but rather a few albums, each containing dozens photos ? Looking at Tina's docs, I guess the way to go would be to rely on nested fields with list: true but if I get it right, this will still require the user to add only one image at a time, which doesn't seem reasonable at scale.
Randomly came across the following blog post which mentions a custom-made Tina field that allows for bulk image upload (could not find much more info about it) so the good news is: it's definitely possible