A text based, structured content manager, for edition and consumption β AstroJS integration
ISC License
~
Documentation / Live demo website
ββΏβ πππππ
π·π»ββοΈΒ Β Under heavy development, use it at your own risk! Β Β π§
~ Contributions are welcome π
Think of it as an hybrid of Wordpress + ACF, Obsidian and Ulysses, with a sprinkle of tRPC and nuxt/content.
β¨Β Β Adds a thin layer between Astro and your templates, bringing automatic typings, runtime validation and a handful of DX goodies.
πΒ Β Brings evolved authoring assistance, in a full-fledged back-office, inside your IDE or with CLI, as you prefer.
Being content centric, this set of tools will give you:
Warning: This is an
alpha
product β Heavy changes are on-going β Suggestions are welcome π
With yarn
, npm
or pnpm
, run this in your existing Astro project:
# If you want a fresh start ββv
# pnpm create astro && cd ./my-astro-site
pnpm astro add astro-content
pnpm content setup
Follow the promptsβ¦ π
Shallow clone this minimal Astro starter, which comes with dummy content for you to play with:
pnpx degit JulianCataldo/astro-content/demo ./ac-demo
cd ./ac-demo && pnpm install
# Clone dummy content
pnpx degit JulianCataldo/astro-content/docs/content/@dummy ./content
# βORβ setup a minimal content base with Astro Content CLI
pnpm content setup
# Open project in VS Code
code .
Warning: Only Node 17 or higher is actually supported by Astro Content.
OK, project is ready. It's time to:
pnpm run dev
Now head over to http://localhost:3000/__content to take a deep dive in Astro Content.
It's OK to use an absolute path, so you don't have to do tedious relative imports:
import { get } from '../../content';
// Versus:
import { get } from '/content';
Astro / Vite resolve absolute paths from project root. That's cool, but TypeScript language server (in your IDE) will likely break, while showing red squiggles π€¨.
A very simple fix is adding this to your tsconfig.json
> compilerOptions.paths
:
{
"compilerOptions": {
// β¦
"paths": {
// Make TS happy with absolute path
"/content": ["./content"]
}
}
}
Note:
pnpm
is the package manager of choice for developing this mono-repo. macOS / Node >= 17 is the most tested environment. Please note that end-user can use anything recommended for a typical Astro project while using Astro Content distributables.
git clone [email protected]:JulianCataldo/astro-content.git
cd astro-content
pnpm -r i
# ββββ Watch / build mono-repo. (turbo)
pnpm run dev
# ββββ Doc. website (astro)
cd docs && pnpm run dev
Role | Notes | Name | Artefact |
---|---|---|---|
Integration (Entrypoint) | Extends Astro / Vite capabilities | astro-content |
|
Server | Data handlers, API provider, helpers generator | @astro-content/server |
|
Command line | Project setups and content manipulation | @astro-content/cli |
|
Web app (Optional) | Full-fledge content editor / monitor | @astro-content/gui |
|
TypeScript typings | Internal types for development use | @astro-content/types |
|
Docs (Private) | Using and demonstrating all tools above | astro-content.netlify.app |
|
Demo (Clonable) | Minimal boilerplate | ./demo |
@astro-content/*
are all internal dependencies of the main astro-content
integration package, which act as a bridge for them.
Web GUI can be opted out by user settings.
Branch | Description | Deployment URL |
---|---|---|
Feature (<feat_branch> ) |
Preview experiments or future additions in isolation. | [branch]--astro-content.netlify.app/__content |
Production (master ) |
Stable release. | astro-content.netlify.app/__content |
πΒ Β Next! (develop ) |
All future features. | develop--astro-content.netlify.app/__content |
πΒ Β JulianCataldo.com