https://github.com/jveiiga/project-jamstack-blog

🚀⠀Projeto criado na maratona @Rocketseat com @diego3g.
https://github.com/jveiiga/project-jamstack-blog

css3 git graphcms html5 nextjs reactjs tailwind-css

Last synced: 3 months ago
JSON representation

🚀⠀Projeto criado na maratona @Rocketseat com @diego3g.

• Host: GitHub
• URL: https://github.com/jveiiga/project-jamstack-blog
• Owner: jveiiga
• Created: 2022-02-21T21:57:11.000Z (over 3 years ago)
• Default Branch: main
• Last Pushed: 2022-02-22T04:26:52.000Z (over 3 years ago)
• Last Synced: 2025-01-02T07:21:07.648Z (5 months ago)
• Topics: css3, git, graphcms, html5, nextjs, reactjs, tailwind-css
• Language: TypeScript
• Homepage: https://project-jamstack-blog.vercel.app
• Size: 125 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
Project Jamstack Blog - Projeto criado na maratona Rocketseat 🚀



  



A maratona Rocketseat é gratuita, voltada para profissionais, estudantes e para todo mundo que quer aprender mais sobre front-end e programação. O projeto é um Blog, criado com Nextjs, Graphcms e tailwindcss. 


Clique aqui para ver meu projeto final!


## 📺 Imagem

  

Clique para ver imagens do projeto

  

![preview](https://user-images.githubusercontent.com/57195630/155034143-773e985e-cb57-4e69-a31a-ff42c1b745fe.png)

![preview](https://user-images.githubusercontent.com/57195630/155034152-bcc62434-0d2c-40be-a08c-5b72dc18f4a9.png)

![preview](https://user-images.githubusercontent.com/57195630/155034158-bac00419-9119-4b95-98ce-4d8b42c9f4c0.png)

 

## 💻 Linguagens e tecnologias utilizadas

 

   

  



   



   

   

   

## Funcionalidades da pagina

  - Projeto seguindo parâmetros Jamstack de construção de sites modernos,

  - Página Home, 

  - Página Blog, 

  - Intregração feita por cache, os dados só serão recarregados após determinado período.  

## Instalação

    - Clonar repositorio

    $ git clone https://github.com/jveiiga/project-jamstack-blog && cd project-jamstack-blog

    - Instalar dependencias

    $ yarn add 

    @yarn typescript 

    @types/node 

    @types/react 

    $ yarn add 

    @urql 

    @graphql

    $ yarn add 

    @graphql-codegen/cli 

    @graphql-codegen/import-types-preset 

    @graphql-codegen/typescript 

    @graphql-codegen/typescript-operations 

    @graphql-codegen/typescript-urql  

    $ yarn add  

    @tailwindcss postcss autoprefixer 

    @tailwindcss init -p

    $ yarn add 

    @tailwindcss/forms

    @tailwindcss/typography -D

    $ yarn add 

    @headlessui/react

    @heroicons/react

    - Rodar aplicativo

    $ yarn dev

## 👨‍🏫 Instrutor

- Diego Fernandes 

## 📚 Pesquisar/Aprender

  - Entender melhor como funciona o graphql e o graphcms(Cmss no geral),

  - Aprender sobre queries.

  - Estudar documentação codegen,

  - Aprender mais sobre as configurações iniciais de busca no cms,

  

## 📚 Desafios

    - [x] Pegar os dados da API do graphcms;

    - [x] Usar Static, Slug e params;

    - [x] Separar e organizar o código;

    - [x] Publicar projeto;

## 📂 Referencias

  

    Decode #011

      - Jamstack 


      - graphcms 


      - codegen 


      - tailwindcss