Content collection types (content, data) in Astro - Cheat Sheet & Quick Revision

Recall & Review

beginner

What is a content collection in Astro?

A content collection in Astro is a way to organize and manage related content files, like markdown or JSON, so you can easily query and display them in your website.

beginner

What is the difference between content and data collections in Astro?

content collections usually hold rich content files like markdown with frontmatter, while data collections hold structured data files like JSON or YAML without markdown formatting.

beginner

How do you define a content collection in Astro?

You define a content collection by creating a folder inside the src/content directory and adding markdown files with frontmatter metadata inside it.

beginner

What type of files are typically stored in a data collection?

Data collections typically store JSON, YAML, TOML, or other structured data files that do not contain markdown formatting but hold data to be used in the site.

beginner

Why use content collections instead of hardcoding data in Astro?

Content collections let you separate content from code, making it easier to update, manage, and reuse content without changing your site’s code.

Which file type is most common in a content collection in Astro?

A JavaScript (.js)

B Markdown (.md)

C JSON (.json)

D CSS (.css)

Content collections usually contain markdown files with frontmatter metadata.

What folder do you place content collections in Astro?

A src/content

B src/data

C public/assets

D src/components

Content collections are placed inside the src/content folder.

Which collection type is best for storing structured data like site settings?

A data

B content

C components

D assets

Data collections hold structured data files like JSON or YAML.

What is a key benefit of using content collections in Astro?

A Writing CSS styles

B Hardcoding all data in components

C Separating content from code for easier updates

D Running server-side scripts

Content collections separate content from code, making updates easier.

Which of these is NOT a typical file format for a data collection?

A JSON

B YAML

C TOML

D Markdown

Markdown is usually used in content collections, not data collections.

Explain the difference between content and data collections in Astro and when you might use each.

Think about the file types and purpose of each collection.

Describe how content collections help in managing website content in Astro.

Consider how content collections improve workflow and site maintenance.

Practice

1. What is the main difference between a content collection and a data collection in Astro?

easy

A. Content collections hold visitor-facing content, while data collections store internal information.

B. Content collections are only for images, data collections are only for text.

C. Content collections require no schema, data collections always require a schema.

D. Content collections are faster to load than data collections.

Solution

1. Step 1: Understand content collections

   Content collections are designed to hold content that visitors see, like blog posts or articles.

2. Step 2: Understand data collections

   Data collections store internal or site-related information, such as settings or configuration data.

3. Final Answer:

   Content collections hold visitor-facing content, while data collections store internal information. -> Option A

4. Quick Check:

   Content = visitor content, Data = internal info [OK]

Hint: Remember: content = visitor content, data = internal info [OK]

Common Mistakes:

• Thinking content collections are only for images
• Assuming data collections are visible to visitors
• Believing schemas are only for data collections

2. Which of the following is the correct way to define a schema field for a content collection in Astro?

easy

A. "title: String"

B. "title: Text"

C. "title = String"

D. "title: string"

Solution

1. Step 1: Recall Astro schema syntax

   Astro schemas use lowercase types like string to define fields.

2. Step 2: Check each option

   "title: string" uses "title: string" which matches the correct syntax. Others use incorrect capitalization or assignment.

3. Final Answer:

   "title: string" -> Option D

4. Quick Check:

   Schema fields use lowercase types like string [OK]

Hint: Use lowercase type names in schema fields [OK]

Common Mistakes:

• Using uppercase types like String
• Using equals sign instead of colon
• Using undefined types like Text

3. Given this Astro content collection schema snippet:

{ title: 'string', published: 'boolean' }

And this content file:

---
title: "Hello World"
published: true
---

What will be the value of published when queried?

medium

A. true

B. "true"

C. 1

D. null

Solution

1. Step 1: Understand schema field type

   The schema defines published as a boolean, so the value should be a true boolean, not a string.

2. Step 2: Check content file value

   The content file sets published: true (boolean true), matching the schema type.

3. Final Answer:

   true -> Option A

4. Quick Check:

   Boolean field returns boolean value true [OK]

Hint: Match schema types exactly for correct data values [OK]

Common Mistakes:

• Confusing boolean true with string "true"
• Expecting numeric 1 for true
• Assuming missing or null value

4. You wrote this schema for a data collection:

{ siteName: 'string', maxUsers: 'number' }

But when querying, maxUsers is always null. What is the likely error?

medium

A. The schema uses 'number' instead of 'int' for numeric fields.

B. The field name maxUsers is misspelled in the data files.

C. Data collections cannot have numeric fields.

D. The schema must use uppercase type names.

Solution

1. Step 1: Check schema type usage

   Astro supports 'number' as a valid type, so 'number' is correct.

2. Step 2: Consider data file consistency

   If maxUsers is null, likely the data files have a different field name or missing value.

3. Final Answer:

   The field name maxUsers is misspelled in the data files. -> Option B

4. Quick Check:

   Field name mismatch causes null values [OK]

Hint: Check field names match exactly in schema and data [OK]

Common Mistakes:

• Assuming 'number' is invalid type
• Thinking data collections disallow numbers
• Using uppercase type names incorrectly

5. You want to create a content collection for blog posts with fields: title (string), tags (array of strings), and published (boolean). Which schema definition is correct?

hard

A. { title: 'string', tags: 'string[]', published: 'boolean' }

B. { title: 'string', tags: ['string'], published: 'boolean' }

C. { title: 'string', tags: { type: 'array', items: 'string' }, published: 'boolean' }

D. { title: 'string', tags: 'array<string>', published: 'boolean' }

Solution

1. Step 1: Understand array field syntax in Astro schemas

   Astro uses an object with type: 'array' and items to define arrays.

2. Step 2: Evaluate each option

   { title: 'string', tags: { type: 'array', items: 'string' }, published: 'boolean' } correctly uses { type: 'array', items: 'string' }. Others use invalid or unsupported syntax.

3. Final Answer:

   { title: 'string', tags: { type: 'array', items: 'string' }, published: 'boolean' } -> Option C

4. Quick Check:

   Arrays use type: 'array' with items field [OK]

Hint: Use object with type 'array' and items for arrays [OK]

Common Mistakes:

• Using 'string[]' as type string
• Using array literal syntax in schema
• Assuming 'array<string>' is valid