게이츠비와 만족--머리 없는 CMS를 어떻게 사용하는지


무엇이 만족을 아는 것입니까?


Contentful은 컨텐츠 관리 시스템을 의미하는 CMS입니다.이런 시스템은 사람들을 허용한다
컨텐츠 관리아마도 가장 유명한 CMS는WordPress일 것이다.WordPress에 비해 Contentful은 끝이 없다.
이것은 무엇을 의미합니까?이는 CMS에서 제공하는 데이터만 제공하고 다른 데이터는 제공하지 않는다는 뜻이다.정상적인 CMS는
예를 들어 시각적인 부분도 제공해야 한다.왜 이렇게 좋아요?개발자로서 사용할 수 있기 때문에.
헤더 없는 CMS의 데이터는 어디에나 있습니다.우리 응용 프로그램, 사이트 등에서페이지가 완전히 달라 보일 수도 있지만,
데이터가 변경되지 않습니다.

어떻게 게이츠비와 함께 지족을 사용합니까?


게이츠비처럼 우리는 플러그인 하나만 사용할 수 있다.이 플러그인의 이름은 gatsby-source-contentful입니다.
이렇게 하면 Contentful에서 데이터를 쉽게 얻을 수 있습니다.이 데이터를 사용하기 전에 새 계정이 없으면 새 계정을 만들어야 합니다.
무료 등록here만 하면 됩니다.기본적으로 모두 무료이다. 캐릭터가 필요하지 않으면, 나는 네가 무료 계획을 받아들일 수 있다고 생각한다.
그리고 너는 너의 첫 번째 공간을 만들어야 한다.너는 이 공간을 네가 콘텐츠를 만들고 있는 프로젝트로 상상할 수 있다.
이후에 당신은 당신의 공간 ID와accessToken을 얻을 수 있습니다.설정 > API 키에서 만든 다음
새 것을 생성합니다.첫 번째 단계는 이미 완성되었다.🥳

설치 프로그램


다음은 게이츠비 페이지의 설정입니다.새로운 게이츠비 프로젝트를 만들거나 원하는 기존 프로젝트를 사용하십시오
Contentful에서 에 데이터를 추가합니다.그리고gatsby 프로필에 설정을 추가합니다.
// In your gatsby-config.js
module.exports = {
  plugins: [
    {
      resolve: `gatsby-source-contentful`,
      options: {
        spaceId: `your_space_id`,
        // Learn about environment variables: https://gatsby.dev/env-vars
        accessToken: process.env.CONTENTFUL_ACCESS_TOKEN,
      },
    },
  ],
}
환경 변수를 사용하는 것을 기억하세요.이것은 매우 중요하다. 왜냐하면 누군가가 당신의accessToken을 얻을 수 있다면
그는 너의 모든 내용을 얻을 수 있다.가장 좋은 것은 안전한 것이다.😉

첫 번째 컨텐트 유형


현재, 우리가 이륙을 준비할 때, 우리는 첫 번째 내용 유형을Contentful에 추가할 것이다.근데 콘텐츠타입이 무슨 뜻이죠?
ContentType은 기본적으로 내용의 레이아웃입니다. 예를 들어 블로그 게시물은 하나일 수 있습니다.모든 문장에는 제목, 문자, 그림이 있다.
그것들은 함께 하나의 내용 유형이다.첫 번째까지 합시다.
따라서 ContentModel로 이동하고 AddContentType을 클릭해야 합니다.컨텐트 유형에 이름을 지정하려는 새 창이 나타납니다.
자동으로 생성된 식별자입니다.내용 편집기에 대한 유용한 설명도 제공할 수 있습니다. 왜냐하면 그들은 모를 수도 있기 때문입니다
특정 ContentType의 용도입니다.
이 단계를 마치면첫 번째 필드를 추가할 준비가 되어 있습니다.add field를 클릭하고 원하는 유형을 선택합니다.예를 들어, 텍스트를 선택할 수 있습니다.
그런 다음 필드를 추가로 구성해야 합니다.자동으로 생성된 필드가 사용자에게 적합하지 않으면 이름을 지정하고 필드 ID를 변경하십시오.그런 다음 생성 및 구성을 클릭하면
구성을 더욱 최적화할 수 있는 기회가 있습니다.이것은 서로 다른 상황에서 의미가 있을 수 있지만 본문의 일부분이 되어서는 안 된다.
그런 다음 ContentType에 원하는 모든 필드를 추가하고 변경 사항을 게시합니다.이제 첫 번째 ContentType을 추가했지만 컨텐트가 없습니다.ContentType은 무용지물입니다.
내용이 없다.컨텐트를 추가합니다.컨텐츠 탭으로 이동하여 컨텐츠 추가 버튼을 마우스 오른쪽 버튼으로 클릭합니다.버튼 이름은 ContentType pre에 따라 다를 수 있습니다.
골라냈어그러나 둘 이상의 ContentType이 있는 경우 추가할 ContentType을 선택할 수 있습니다.
ContentType을 선택하고 미리 정의된 필드에 내용을 추가합니다.ContentType 에서 설명한 대로 변경해야 합니다.그 다음에 잊지 마세요.
컨텐트를 저장하고 게시합니다.
현재, 우리는 우리의 첫 번째 내용 블록을 사용할 준비가 되어 있다.🚀
개츠비 서버 시작
gatsby develop
몇 초 후에 서버가 구축되었습니다. 이제 데이터를 사용할 수 있는지 확인할 수 있습니다.이렇게 하려면 http://localhost:8000/\_\_\_graphql를 방문하십시오.
GraphiQL 놀이공원은 모든 데이터를 보는 데 매우 유용하다.'내용이 있는 것' 이라는 데이터 형식을 검색합니다.이름은 allContentfulDataType과 유사해야 합니다.
데이터Type은 Contentful에서 새로 만든 ContentType의 이름입니다.만약 모든 것이 정상이라면, 지금 페이지 조회에서 콘텐츠풀의 데이터를 사용할 수 있습니다.
그건 쉬워요, 그렇죠?

페이지 생성


게이츠비에서 새 페이지를 만들 수 있는 아주 유용한 기능이 있습니다.만족에는 별다른 점이 없지만 완벽하게 결합됐다.
예를 들어, 각 블로그 게시물 컨텐트 유형에서 페이지를 만들 수 있습니다.따라서 새 게시물을 추가할 때 새 페이지를 추가할 염려가 없습니다.
이게 어떻게 된 일입니까?개츠비 노드 파일을 열어야 합니다.
exports.createPages = ({ graphql, actions }) => {
  const { createPage } = actions

  return new Promise((resolve, reject) => {
    const template = path.resolve("./src/templates/template.js")
    resolve(
      graphql(
        `
          {
            <YOUR_GRAPHQL_CALL>
          }
        `
      ).then(result => {
        if (result.errors) {
          reject(result.errors)
        }

        const { content } = result.data

        content.edges.forEach(edge => {
          const slug = edge.node.slug
          createPage({
            path: `${slug}`,
            component: template,
            context: {
              slug,
            },
          })
        })
        return
      })
    )
  })
}
한 번에 많아.설명 좀 할게요.우선, actions에서createPages 함수를 가져오고, 잠시 후에 사용할 것입니다.
그럼 약속 하나만 해줘야지.왜?Contentful에서api를 호출하고 데이터를 기다려야 하기 때문에 만들려고 합니다
시간이 좀 걸려요.
그리고 약속에서 우리가 만든 파일을 가져옵니다.이 파일은 새로 만든 페이지의 템플릿이 됩니다.그리고 필요한 데이터를 얻기 위해graphql 조회를 진행합니다.
데이터가 되돌아온 후에 우리는 결과를 처리한다.우리는 우선 오류가 있는지 검사합니다. 만약 모든 것이 정상이라면, 그룹의 항목마다createPage 함수를 호출합니다
우리는 서버에서 소식을 얻었다.함수가 가져오는 경로는 매번 교체할 때마다 달라야 합니다. 그렇지 않으면 페이지가 덮어쓰입니다.그다음에 하나.
우리의 틀.마지막으로, 페이지의 도구로 사용할 수 있는 상하문이 필요합니다.
이렇게나는 이것이 불가능하다고 생각한다. 왜냐하면 너는 스스로 비슷한 페이지를 쓸 필요가 없기 때문이다. 너는 CMS를 통해 내용을 추가할 수 있기 때문이다.

무슨 좋은 점이 있습니까?


근데 이 모든 게 뭔데?이게 왜 필요해?개발자로서 우리는 이것을 필요로 하지 않을 수도 있다.편집기에 텍스트를 추가하는 것이 더 쉽기 때문이다.예컨대
나의 블로그 가격 인하는 나의 개인 블로그에서 생성된 것이다.그러나 만약 비기술자가 페이지에 내용을 추가하려고 한다면 콘텐츠는 매우 좋다.
TechLabs에서 콘텐츠풀을 사용하여 페이지를 구축합니다.우리는 우리의 위치의 페이지를 편집하는 간단한 방법을 찾았다.저희가 한 명씩 주고 싶은 방식이 있어요.
포지셔닝은 그들의 하위 페이지를 편집할 기회가 있다.Contentful 은 자신들에게 데이터를 쉽게 추가하고 새로운 내용을 발표할 수 있도록 인터페이스를 제공합니다.

결론


개츠비와 Contentful의 조합은 모든 페이지에 유용할 수 있습니다.그것은 설치하기 쉽고 개발자에게 커다란 유연성을 제공한다.나 자신으로서
경험은 내가 만족하는 사람과 함께 일하는 것을 정말 좋아한다고 말할 수 있을 뿐이다.이 밖에 응용 프로그램과 더 많은 것을 설정할 수 있다
만족으로 너의 시간을 최적화시키다.니가 해봐야 돼.Contentful은 자유롭게 설정할 수 있으며 대부분의 기능을 테스트할 수 있습니다.
무료이었어

좋은 웹페이지 즐겨찾기