@egvelho/next-cms

Descrição

O objetivo deste projeto é provisionar uma camada de abstração entre Next.js e NetlifyCMS, de forma a proporcionar uma melhor experiência para o desenvolvedor. Além disso, também estão disponíveis ferramentas para gerenciar assets (gerador de sitemap, otimização de imagens, criação automática de PWA) e metadados das páginas. O projeto não é mantido ativamente, e também não possui documentação. Para utilizar esse código, sugiro realizar um fork ao invés de adicioná-lo diretamente como dependência no package.json. Para um exemplo de utilização, existe um projeto demo que pode ser utilizado como ponto de partida.

Funcionalidades gerais

• Gerar ícones para PWA baseados em um arquivo SVG;
• Experiência de desenvolvimento otimizada para NetlifyCMS e Next.js;
• Utilitários para trabalhar com arquivos JSON.

Exemplo de utilização

import {
  collectionFolder,
  GetCollectionType,
} from "@egvelho/next-meta/cms/collection";

export type BlogPost = GetCollectionType<typeof blogPost>;

export const blogPost = collectionFolder({
  folder: "app/blog/posts",
  label: "Blog posts",
  labelSingular: "post",
  slug: "{{title}}",
  sortableFields: ["publishDate"],
}).fields((data) => ({
  title: data.string({
    label: "Title",
  }),
  description: data.string({
    label: "Description",
  }),
  image: data.image({
    label: "Image",
  }),
  publishDate: data.datetime<"optional">({
    label: "Publish date",
    dateFormat: "MM/YYYY",
    timeFormat: "HH:mm",
    required: false,
  }),
  tags: data.keywords({
    label: "Tags",
    min: 1,
    max: 5,
  }),
  authorName: data.string<"optional">({
    label: "Author name",
    required: false,
  }),
  authorDescription: data.string<"optional">({
    label: "Author description",
    required: false,
  }),
  authorPicture: data.image<"optional">({
    label: "Author picture",
    required: false,
  }),
  titleColor: data.color<"optional">({
    label: "Title color",
    required: false,
    allowInput: true,
  }),
  backgroundColor: data.color<"optional">({
    label: "Background color",
    required: false,
    allowInput: true,
  }),
  backgroundImage: data.image<"optional">({
    label: "Background image",
    required: false,
  }),
  content: data.markdown({
    label: "Content",
  }),
}));

Código-fonte

Esse projeto é software livre e de código aberto, estando disponível no GitHub (@egvelho/next-cms) sob licença GPL 3.0. Também está disponível na plataforma NPM para ser utilizado como dependência em projetos Node.js.