Video Belajar
Tonton dan pelajari berbagai topik menarik melalui video pembelajaran eksklusif dari Channel Learn With Jason.
Learn With Jason
5998
Typesafe Markdown With Astro Content Collections
Written version of this video: https://lwj.dev/blog/typesafe-markdown-astro-content-collections
Astro 2.0 introduces content collections, which allow developers to create typesafe Markdown by defining frontmatter fields with Zod. This is extremely useful for debugging and autocomplete when writing Markdown content in Astro sites.
Resources:
- Repo: https://github.com/learnwithjason/astro-content-collections
- Docs: https://docs.astro.build/en/guides/content-collections/
- Astro 2.0 announcement: https://astro.build/blog/astro-2/?utm_source=jason-lengstorf&utm_medium=link&utm_term=2.0+launch&utm_campaign=blog
Chapters:
00:00 - Typesafe Markdown?
00:13 - What are Astro content collections?
00:44 - Create a new Astro site from the command line
01:40 - Set up a layout file
01:53 - Use the layout on the home page
02:25 - Intro to Astro content collections
03:15 - What is Zod?
03:37 - Define the content collection schema
05:19 - Zod methods and customizations
06:21 - Load posts from content collections in Astro
08:29 - Create a dynamic route for blog posts
09:18 - Dynamic routes with Astro content collections
11:21 - Validating new posts and schema errors
Astro 2.0 introduces content collections, which allow developers to create typesafe Markdown by defining frontmatter fields with Zod. This is extremely useful for debugging and autocomplete when writing Markdown content in Astro sites.
Resources:
- Repo: https://github.com/learnwithjason/astro-content-collections
- Docs: https://docs.astro.build/en/guides/content-collections/
- Astro 2.0 announcement: https://astro.build/blog/astro-2/?utm_source=jason-lengstorf&utm_medium=link&utm_term=2.0+launch&utm_campaign=blog
Chapters:
00:00 - Typesafe Markdown?
00:13 - What are Astro content collections?
00:44 - Create a new Astro site from the command line
01:40 - Set up a layout file
01:53 - Use the layout on the home page
02:25 - Intro to Astro content collections
03:15 - What is Zod?
03:37 - Define the content collection schema
05:19 - Zod methods and customizations
06:21 - Load posts from content collections in Astro
08:29 - Create a dynamic route for blog posts
09:18 - Dynamic routes with Astro content collections
11:21 - Validating new posts and schema errors