Connect and use CMS about astro-paper HOT 3 CLOSED

Hello @SahilFruitwala!
You can you AstroPaper with any Headless CMS. However, AstroPaper is developed with file-system-based contents in mind. I've written a blog post about using AstroPaper with git-based HeadlessCMS.

In order to connect AstroPaper with an API-driven CMS, you have to update the data fetching logic.
For example:

// From this
const posts = await Astro.glob<Frontmatter>("../contents/**/*.md");

// To this
const response = await fetch("https://your-cms-url.com/posts");
const posts = await response.json();

Besides, you might have to replace frontmatter properties with your API data.
For example, if your API response is something like this,

[
  {
  "userId": 1,
  "id": 1,
  "slug": "some-dummy-post",
  "title": "sunt aut facere repellat provident occaecati excepturi optio reprehenderit",
  "body": "quia et suscipit\nsuscipit recusandae consequuntur expedita et cum\nreprehenderit molestiae ut ut quas totam\nnostrum rerum est autem sunt rem eveniet architecto"
  },
  // some more data
]

You need to update the post displaying code too.

// from this
sortedPosts.map(
  ({ frontmatter }, index) =>
    index < 4 && (
      <Card
        href={`/posts/${slugify(frontmatter)}`}
        post={frontmatter}
        secHeading={false}
      />
    )
)

// to this
sortedPosts.map(
  (post, index) =>
    index < 4 && (
      <Card
        href={`/posts/${slugger(post.slug)}`}
        post={post}
        secHeading={false}
      />
    )
)

from astro-paper.

Got it Thanks. 🙌🏼

from astro-paper.

@SahilFruitwala did you ever get it to work with the CMS? Curious to see if you had to make any additional changes

from astro-paper.