nextjs starter kit

Começando

Pré -requisitos

• Node.js e fios/pão instalados
• Contas e chaves da API para:
  • Supabase
  • Faixa (se estiver usando pagamentos)
  • Funcionário (se estiver usando autenticação)

Configurar

1. Clone o repositório:

    git clone <repository-url>
   cd <project-directory>
   

2. Instale dependências:

    yarn
   

3. Configurar variáveis de ambiente: Crie um arquivo .env no diretório raiz com as seguintes variáveis:

    SUPABASE_URL=<your-supabase-project-url>
   SUPABASE_SERVICE_KEY=<your-supabase-service-key>
   
   # If using Stripe
   STRIPE_SECRET_KEY=<your-stripe-secret-key>
   NEXT_PUBLIC_STRIPE_PRICE_ID=<your-stripe-price-id>
   
   # If using Clerk
   NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=<your-clerk-publishable-key>
   CLERK_SECRET_KEY=<your-clerk-secret-key>
   NEXT_PUBLIC_CLERK_SIGN_IN_URL=/sign-in
   NEXT_PUBLIC_CLERK_SIGN_UP_URL=/sign-up
   NEXT_PUBLIC_CLERK_AFTER_SIGN_IN_URL=/
   NEXT_PUBLIC_CLERK_AFTER_SIGN_UP_URL=/
   

4. Configurar recursos: no config.ts , defina os recursos desejados:

    const config = {
     auth : {
       enabled : true , // Set to false if not using Clerk
     } ,
     payments : {
       enabled : true , // Set to false if not using Stripe
     }
   } ;

5. Configure o banco de dados: execute migrações de prisma:

    npx prisma migrate dev
   

6. Inicie o servidor de desenvolvimento:

    yarn dev
   

7. Abra o navegador e navegue para http://localhost:3000 para ver seu aplicativo em execução.

Configuração adicional

• WebHooks: Configure webhooks para funcionário (se estiver usando auth) em /api/auth/webhook e para stripe (se estiver usando pagamentos) em /api/payments/webhook .
• Personalize a página de destino, o painel e outros componentes, conforme necessário.
• Modifique o esquema PRISMA no prisma/schema.prisma se você precisar alterar a estrutura do banco de dados.

Notas de segurança importantes

• Habilite a segurança do nível da linha (RLS) em seu projeto Supabase para garantir a proteção de dados no nível do banco de dados.
• Sempre faça as chamadas Supabase no lado do servidor (em rotas de API ou componentes do servidor) para manter sua chave de serviço segura.

Saber mais

Consulte a documentação das tecnologias individuais usadas neste projeto para obter informações mais detalhadas:

• Documentação next.js
• Documentação CSS do Tailwind
• Documentação Supabase
• Documentação do prisma
• Documentação do funcionário (se estiver usando auth)
• Documentação de faixa (se estiver usando pagamentos)