[v6] New content collections guide includes live collections

src/content/docs/en/guides/cms/keystatic.mdx

@@ -183,7 +183,7 @@ Visit `http://127.0.0.1:4321/keystatic` in the browser to see the Keystatic Admi
 
 ## Rendering Keystatic content
 
-Use Astro's Content Collections API to [query and display your posts and collections](/en/guides/content-collections/#querying-collections), just as you would in any Astro project.
+[Query and display your posts and collections](/en/guides/content-collections/#querying-build-time-collections), just as you would in any Astro project.
 
 ### Displaying a collection list
 

src/content/docs/en/guides/imports.mdx

@@ -344,7 +344,7 @@ Additionally, glob patterns must begin with one of the following:
 
 ### `import.meta.glob()` vs `getCollection()`
 
-[Content collections](/en/guides/content-collections/) provide a [`getCollection()` API](/en/reference/modules/astro-content/#getcollection) for loading multiple files instead of `import.meta.glob()`. If your content files (e.g. Markdown, MDX, Markdoc) are located in collections within the `src/content/` directory, use `getCollection()` to [query a collection](/en/guides/content-collections/#querying-collections) and return content entries.
+[Content collections](/en/guides/content-collections/) provide [performant, content-focused APIs](/en/reference/modules/astro-content/) for loading multiple files instead of `import.meta.glob()`. Use `getCollection()` and `getLiveCollection()` to query your collections and return content entries.
 
 ## WASM
 

src/content/docs/en/guides/integrations-guide/markdoc.mdx

@@ -113,7 +113,7 @@ Markdoc files can only be used within content collections. Add entries to any co
       - quick-start.mdoc
 </FileTree>
 
-Then, query your collection using the [Content Collection APIs](/en/guides/content-collections/#querying-collections):
+Then, [query and display your posts and collections](/en/guides/content-collections/#querying-build-time-collections):
 
 ```astro title="src/pages/why-markdoc.astro"
 ---

src/content/docs/en/guides/integrations-guide/mdx.mdx

@@ -96,9 +96,9 @@ It also adds extra features to standard MDX, including support for Markdown-styl
 
 `.mdx` files must be written in [MDX syntax](https://mdxjs.com/docs/what-is-mdx/#mdx-syntax) rather than Astro’s HTML-like syntax.
 
-### Using MDX with content collections
+### Using local MDX with content collections
 
-To include MDX files in a content collection, make sure that your [collection loader](/en/guides/content-collections/#defining-the-collection-loader) is configured to load content from `.mdx` files:
+To include your local MDX files in a content collection, make sure that your [collection loader](/en/guides/content-collections/#build-time-collection-loaders) is configured to load content from `.mdx` files:
 
 ```js title="src/content.config.ts" ins="mdx"
 import { defineCollection, z } from 'astro:content';

src/content/docs/en/guides/markdown-content.mdx

@@ -399,7 +399,7 @@ When using the frontmatter `layout` property, you must include the `<meta charse
 
 Astro's internal Markdown processor is not available for processing remote Markdown.
 
-To fetch remote Markdown for use in [content collections](/en/guides/content-collections/), you can [build a custom loader](/en/guides/content-collections/#building-a-custom-loader) with access to a [`renderMarkdown()` function](/en/reference/content-loader-reference/#rendermarkdown).
+To fetch remote Markdown for use in [content collections](/en/guides/content-collections/), you can [build a custom loader](/en/guides/content-collections/#custom-build-time-loaders) with access to a [`renderMarkdown()` function](/en/reference/content-loader-reference/#rendermarkdown).
 
 To fetch remote Markdown directly and render it to HTML, you will need to install and configure your own Markdown parser from NPM. This will not inherit from any of Astro's built-in Markdown settings that you have configured.
 

src/content/docs/en/guides/media/cloudinary.mdx

@@ -134,7 +134,7 @@ export const collections = {
 }
 ```
 
-You can then use the [`getCollection()` or `getEntry()` query functions](/en/guides/content-collections/#querying-collections) to select one or many images or videos from your collection.
+You can then use the [`getCollection()` or `getEntry()` query functions](/en/guides/content-collections/#querying-build-time-collections) to select one or many images or videos from your collection.
 
 See [Cloudinary's `cldAssetsLoader` documentation](https://astro.cloudinary.dev/cldassetsloader/basic-usage) for more information.
 

src/content/docs/en/guides/migrate-to-astro/from-create-react-app.mdx

@@ -349,7 +349,7 @@ const randomUser = data.results[0];
 ---
 ```
 
-See more about local files imports with [`import.meta.glob()`](/en/guides/imports/#importmetaglob), [querying using the Collections API](/en/guides/content-collections/#querying-collections) or [fetching remote data](/en/guides/data-fetching/).
+See more about local files imports with [`import.meta.glob()`](/en/guides/imports/#importmetaglob), [querying with content collections](/en/guides/content-collections/#querying-build-time-collections) or [fetching remote data](/en/guides/data-fetching/).
 
 ### CRA Styling to Astro
 

src/content/docs/en/guides/migrate-to-astro/from-gatsby.mdx

@@ -36,7 +36,7 @@ When you rebuild your Gatsby site in Astro, you will notice some important diffe
 
 - [Astro components](/en/basics/astro-components/) are not written as exported functions that return page templating. Instead, you'll split your code into a "code fence" for your JavaScript and a body exclusively for the HTML you generate.
 
-- [Local file data](/en/guides/imports/): Gatsby uses GraphQL to retrieve data from your project files. Astro uses ESM imports and top-level await functions (e.g. [`import.meta.glob()`](/en/guides/imports/#importmetaglob), [`getCollection()`](/en/guides/content-collections/#querying-collections)) to import data from your project files. You can manually add GraphQL to your Astro project but it is not included by default.
+- [Local file data](/en/guides/imports/): Gatsby uses GraphQL to retrieve data from your project files. Astro uses ESM imports and top-level await functions (e.g. [`import.meta.glob()`](/en/guides/imports/#importmetaglob), [`getCollection()`](/en/guides/content-collections/#querying-build-time-collections)) to import data from your project files. You can manually add GraphQL to your Astro project but it is not included by default.
 
 ## Convert your Gatsby Project
 

src/content/docs/en/guides/migrate-to-astro/from-nextjs.mdx

@@ -405,7 +405,7 @@ const randomUser = data.results[0];
 ---
 ```
 
-See more about local files imports with [`import.meta.glob()`](/en/guides/imports/#importmetaglob), [querying using the Collections API](/en/guides/content-collections/#querying-collections) or [fetching remote data](/en/guides/data-fetching/).
+See more about local files imports with [`import.meta.glob()`](/en/guides/imports/#importmetaglob), [querying with content collections](/en/guides/content-collections/#querying-build-time-collections) or [fetching remote data](/en/guides/data-fetching/).
 
 ### Next Styling to Astro
 

src/content/docs/en/guides/upgrade-to/v6.mdx

@@ -194,7 +194,7 @@ If you have [content collections errors](/en/reference/error-reference/#content-
 
 <details>
 <summary>no content collections configuration file</summary>
-Create `src/content.config.ts` and [define your collections](/en/guides/content-collections/#defining-collections) in it.
+Create `src/content.config.ts` and [define your collections](/en/guides/content-collections/#build-time-content-collections) in it.
 </details>
 
 <details>
@@ -205,7 +205,7 @@ Rename and move this file to `src/content.config.ts`
 <details>
 <summary>a collection that does not define a `loader`/ ([`ContentCollectionMissingALoaderError`](/en/reference/errors/content-collection-missing-loader/))</summary>
 
-Import [Astro's built-in `glob()` loader](/en/guides/content-collections/#built-in-loaders) and define the `pattern` and `base` for your collection entries:
+Import [Astro's built-in `glob()` loader](/en/guides/content-collections/#the-glob-loader) and define the `pattern` and `base` for your collection entries:
 
 ```ts ins={3,6}
 // src/content.config.ts

src/content/docs/en/reference/cli-reference.mdx

@@ -410,7 +410,7 @@ astro --config config/astro.config.mjs dev
 
 <p><Since v="5.0.0" /></p>
 
-Clear the [content layer cache](/en/guides/content-collections/#defining-the-collection-loader), forcing a full rebuild.
+Clear the content layer cache, forcing a full rebuild.
 
 ### `--mode <string>`
 

src/content/docs/en/reference/content-loader-reference.mdx

@@ -5,14 +5,15 @@ sidebar:
 i18nReady: true
 ---
 import Since from '~/components/Since.astro';
+import ReadMore from '~/components/ReadMore.astro';
 
 Astro's  Content Loader API allows you to load your data from any source, local or remote, and interact with Astro's content layer to manage your [content collections](/en/guides/content-collections/).
 
 ## What is a loader?
 
-Astro loaders allow you to load data into [content collections](/en/guides/content-collections/), which can then be used in pages and components. The [built-in `glob()` and `file()` loaders](/en/guides/content-collections/#built-in-loaders) are used to load content from the file system, and you can create your own loaders to load content from other sources.
+Astro loaders allow you to load data into [content collections](/en/guides/content-collections/), which can then be used in pages and components. The [built-in `glob()` and `file()` loaders](/en/guides/content-collections/#build-time-collection-loaders) are used to load content from the file system, and you can create your own loaders to load content from other sources.
 
-Each collection needs [a loader defined in its schema](/en/guides/content-collections/#defining-the-collection-loader). You can define a loader inline in your project's `src/content.config.ts` file, share one loader between multiple collections, or even [publish your loader to NPM as a package](/en/reference/publish-to-npm/) to share with others and be included in our integrations library.
+Each collection needs a loader defined in its schema. You can define a loader inline in your project's `src/content.config.ts` file, share one loader between multiple collections, or even [publish your loader to NPM as a package](/en/reference/publish-to-npm/) to share with others and be included in our integrations library.
 
 ## Built-in loaders
 
@@ -176,7 +177,7 @@ const countries = defineCollection({
 
 ### Object loaders
 
-A loader is an object with a `load()` method that is called at build time to fetch data and update the data store. It allows entries to be updated incrementally, or for the store to be cleared only when necessary. It can also define a schema for the entries, which can be used to validate the data and generate static types. 
+A loader is an object with a [`load()` method](#load) that is called at build time to fetch data and update the data store. It allows [entries](#dataentry) to be updated incrementally, or for the store to be cleared only when necessary. It can also define a schema for the entries, which can be used to validate the data and generate static types. 
 
 The recommended pattern is to define a function that accepts configuration options and returns the loader object, in the same way that you would normally define an Astro integration or Vite plugin. 
 
@@ -222,9 +223,78 @@ const blog = defineCollection({
 });  
 ```
 
+### Live loaders
+
+A live loader is an object with two methods: `loadCollection()` and `loadEntry()` that should handle errors gracefully and return either data or an `Error` object.
+
+```ts title="src/article-loader.ts"
+import type { LiveLoader } from 'astro/loaders';
+import { fetchFromCMS } from './cms-client.js';
+
+interface Article {
+  id: string;
+  title: string;
+  content: string;
+  author: string;
+}
+
+export function articleLoader(config: { apiKey: string }): LiveLoader<Article> {
+  return {
+    name: 'article-loader',
+    loadCollection: async ({ filter }) => {
+      try {
+        const articles = await fetchFromCMS({
+          apiKey: config.apiKey,
+          type: 'article',
+          filter,
+        });
+
+        return {
+          entries: articles.map((article) => ({
+            id: article.id,
+            data: article,
+          })),
+        };
+      } catch (error) {
+        return {
+          error: new Error(`Failed to load articles: ${error.message}`),
+        };
+      }
+    },
+    loadEntry: async ({ filter }) => {
+      try {
+        // filter will be { id: "some-id" } when called with a string
+        const article = await fetchFromCMS({
+          apiKey: config.apiKey,
+          type: 'article',
+          id: filter.id,
+        });
+
+        if (!article) {
+          return {
+            error: new Error('Article not found'),
+          };
+        }
+
+        return {
+          id: article.id,
+          data: article,
+        };
+      } catch (error) {
+        return {
+          error: new Error(`Failed to load article: ${error.message}`),
+        };
+      }
+    },
+  };
+}
+```
+
+<ReadMore>[See the `Content Collection` guide](/en/guides/content-collections/#creating-a-live-loader) for more information about creating a live loader and example usage.</ReadMore>
+
 ## Object loader API
 
-The API for [inline loaders](#inline-loaders) is very simple, and is shown above. This section shows the API for defining an object loader.
+The API for [inline loaders](#inline-loaders) is very simple, and is shown above. This section shows the API for defining an [object loader](#object-loaders).
 
 ### The `Loader` object
 
@@ -670,3 +740,67 @@ The format of the `RenderedContent` object is:
 ```
 
 If the entry has Markdown content then you can use the [`renderMarkdown()`](#rendermarkdown) function to generate this object from the Markdown string.
+
+## Live loader API
+
+This section shows the API for defining a [live loader](#live-loaders).
+
+### The `LiveLoader` object
+
+A generic type to provide [type safety in your loader](/en/guides/content-collections/#type-safety-in-live-loaders). This describes an object and accepts four type parameters to describe, in this order: your data structure, your filters when querying a collection, your filters when querying a single entry, and errors.
+
+This object contains the following properties:
+
+#### `name`
+
+<p>
+
+**Type:** `string`
+</p>
+
+
+A unique name for the loader, used in logs.
+
+#### `loadCollection()`
+
+<p>
+
+**Type:** `(context: LoadCollectionContext<TCollectionFilter>) => Promise<LiveDataCollection<TData> | { error: TError; }>`
+</p>
+
+Defines a method to load a collection of entries. This function receives a [context object](#loadcollectioncontext) containing an optional `filter` property and must return a the data associated to this collection or the errors.
+
+#### `loadEntry()`
+
+<p>
+
+**Type:** `(context: LoadEntryContext<TEntryFilter>) => Promise<LiveDataEntry<TData> | undefined | { error: TError; }>`
+</p>
+
+Defines a method to load a single entry. This function receives a [context object](#loadentrycontext) containing a `filter` property and returns either the data associated to the requested entry, `undefined` when the entry cannot be found, or the errors.
+
+### `LoadCollectionContext`
+
+This object is passed to the [`loadCollection()` method](#loadcollection) of the loader and contains the following properties:
+
+#### `filter`
+
+<p>
+
+**Type:** `Record<string, any>`
+</p>
+
+An object describing the filters supported by your loader.
+
+### `LoadEntryContext`
+
+This object is passed to the [`loadEntry()` method](#loadentry) of the loader and contains the following properties:
+
+#### `filter`
+
+<p>
+
+**Type:** `Record<string, any>`
+</p>
+
+An object describing the filters supported by your loader.

src/content/docs/en/reference/errors/content-collection-missing-loader.mdx

@@ -21,4 +21,4 @@ import DontEditWarning from '~/components/DontEditWarning.astro'
 A content collection is missing a loader definition. Make sure that each collection in your content config file has a loader.
 
 **See Also:**
--  [Content collections configuration](/en/guides/content-collections/#defining-the-collection-loader)
+-  [Content collections configuration](/en/guides/content-collections/)

src/content/docs/en/reference/errors/file-glob-not-supported.mdx

@@ -19,6 +19,6 @@ import DontEditWarning from '~/components/DontEditWarning.astro'
 The `file` loader must be passed a single local file. Glob patterns are not supported. Use the built-in `glob` loader to create entries from patterns of multiple local files.
 
 **See Also:**
--  [Astro's built-in loaders](/en/guides/content-collections/#built-in-loaders)
+-  [Astro's built-in `file()` loader](/en/guides/content-collections/#the-file-loader)
 
 

src/content/docs/en/reference/errors/legacy-content-config-error.mdx

@@ -23,4 +23,4 @@ A legacy content config file was found. Move the file to `src/content.config.ts`
 See the [Astro 6 migration guide](/en/guides/upgrade-to/v6/#removed-legacy-content-collections) for more information.
 
 **See Also:**
--  [Content collections configuration](/en/guides/content-collections/#the-collection-config-file)
+-  [Content collections configuration](/en/guides/content-collections/#build-time-content-collections)