Descrição • Tecnologias • Pré-requisitos • Como usar • Demonstração

Visite o site

ℹ Descrição

Projeto desenvolvido ao longo do capítulo 3 do Ignite. 👨‍🚀🚀

Ignews é um blog de notícias sobre o ecossistema React. O projeto, feito com base na JAMStack, conta com diversas funcionalidades e integrações, através de várias APIs, como:

• Na página Home:
  • Acessar preview de posts, conteúdo completo será exibido apenas quando o usuário estiver inscrito no plano pago;
  • Login usando o Github através do NextAuth.js;
  • Inscrever-se no plano pago através do checkout com Stripe e sincronizando o status no banco de dados do FaunaDB.
• Na página Post:
  • Listagem de todos os posts através do Prismic CMS;
  • Se o usuário não está inscrito, ao clicar num post, o usuário será redirecionado para Home;
  • Se o usuário está inscrito, acesso completo ao conteúdo do post pelo seu ID.
• Na página Post/[id]:
  • O usuário pode ler todo o conteúdo caso esteja inscrito. Entre outros…

⚒ Tecnologias

• React
• Typescript
• Next.js
• SCSS
• React-Icons
• Axios
• NextAuth.js
• FaunaDB
• Stripe
• Prismic CMS

⚙ Pré-requisitos

• Git
• Yarn
• Cadastro no FaunaDB
• Cadastro no Stripe
• Cadastro no Prismic CMS
• Editor de código.

🖥 Como usar

1. Clone o projeto e acesse a pasta

$ git clone https://github.com/EduardoReisUX/world-trip.git && cd world-trip

2. Siga os passos seguintes

# Instale as dependências
$ yarn

# Crie um arquivo ".env.local" que será a cópia de
# ".env.example" e atribua as variáveis de ambiente
$ cp .env.example .env

# Rode a aplicação
$ yarn dev

3. Faça login com a conta do Github clicando em "Sign in with Github"

4. Inscreva-se clicando em "Subscribe now"

5. Na tela de pagamento, coloque esses dados

• Número do cartão: 4242 4242 4242 4242
• CEP: 01001-000
• Preencha o restante das informações com dados fictícios.

6. Pronto, acesse o conteúdo completo dos posts.

👀 Demonstração

---

Feito com 💜 por Eduardo dos Reis

Deployed by ▲ Vercel