content collections 다운로드 - content collections 소스 코드 다운로드

content collections

AI 소스 코드

@content-collections

다운로드

컨텐츠 컬렉션

콘텐츠를 유형 안전 데이터 컬렉션으로 변환하십시오. 수동 데이터 가져 오기 및 구문 분석이 필요하지 않습니다. 콘텐츠를 가져 와서 시작하십시오. 내장 유효성 검사는 데이터의 정확성을 보장합니다. 데이터가 앱을 입력하기 전에 전처리하십시오.

특징

Beautiful DX : Content Collections는 즐거운 사용자 경험을 제공하도록 설계되었습니다. 서버를 다시 시작하거나 브라우저를 새로 고침 할 필요없이 원활한 개발자 경험을 제공합니다. 콘텐츠 컬렉션은 콘텐츠를 변경할 때 자동으로 업데이트됩니다.
유형-안전 : 빌드 프로세스 중에 콘텐츠가 구문 분석 및 검증되어 정확성과 통화를 보장합니다. 컨텐츠 컬렉션은 컨텐츠에 액세스 할 수있는 유형 안전 API를 제공합니다.
사용하기 간단 : 더 이상 콘텐츠를 수동으로 가져 와서 구문 분석 할 필요가 없습니다. 가져 와서 콘텐츠 컬렉션을 사용하기 만하면됩니다. 간단한 API를 제공하여 앱 구축에 집중할 수 있습니다.
변환 : 컨텐츠 컬렉션을 사용하면 앱을 입력하기 전에 콘텐츠를 변환 할 수 있습니다. 이를 사용하여 컨텐츠를 수정하거나 두 개의 컬렉션에 가입하거나 서버에서 데이터를 가져올 수 있습니다.

설치

컨텐츠 컬렉션은 인기있는 웹 프레임 워크와 완벽하게 통합되는 다양한 어댑터를 제공합니다. 설치 프로세스는 선택한 어댑터에 따라 다릅니다.

다음 .js
QWIK
리믹스 (vite)
견고한 시작
Sveltekit
vite

프레임 워크가 나열되지 않은 경우 CLI를 사용하여 컨텐츠 컬렉션을 사용할 수 있습니다. 프레임 워크가 표시되면 티켓을 열어주십시오.

용법

프로젝트의 루트에서 Content-Collections.ts 파일을 만듭니다.

 import { defineCollection , defineConfig } from "@content-collections/core" ;

const posts = defineCollection ( {
  name : "posts" ,
  directory : "src/posts" ,
  include : "**/*.md" ,
  schema : ( z ) => ( {
    title : z . string ( ) ,
    summary : z . string ( ) ,
  } ) ,
} ) ;

export default defineConfig ( {
  collections : [ posts ] ,
} ) ;

src/posts 에서 콘텐츠 작성을 시작하십시오.

 ---
title : Hello World
summary : This is my first post
---

# Hello World

This is my first post.

앱에서 콘텐츠를 사용하십시오.

 import { allPosts } from "content-collections" ;

export function Posts ( ) {
  return (
    < ul >
      { allPosts . map ( ( post ) => (
        < li key = { post . _meta . path } >
          < a href = { `/posts/ ${ post . _meta . path } ` } >
            < h3 > { post . title } </ h3 >
            < p > { post . summary } </ p >
          </ a >
        </ li >
      ) ) }
    </ ul >
  ) ;
}