Skip to content

Gabriel-Monteiro7/ignite-labs

Repository files navigation

Vite logo

Ignite Labs ⚡️

Gabriel Monteiro Repository size GitHub last commit Stargazers

Aplicação é uma plataforma de eventos, sendo possível consumir os conteúdos e se cadastrar por meio da conexão com o GraphCMS.

link da aplicação web: Ignite Labs

link para acessar o storyBook da aplicação: StoryBook

📌 Tecnologias e Ferramentas Usadas

  • ⚛️ React Ts — Uma biblioteca Javascript para construção de interfaces.
  • 💅 Styled Components — Tecnologia para componentizar estilização CSS no React através do Javascript.
  • 💎: Tailwind Css — É basicamente um framework CSS utilitário para construir rapidamente interfaces de usuário personalizadas.
  • 📕 Storybook — É uma ferramenta de código aberto para criar componentes de interface do usuário e páginas isoladamente.
  • 🎭 Jest — É um poderoso Framework de Testes em JavaScript com um foco na simplicidade.
  • 🔺GraphQL — É uma linguagem de consulta para APIs e um tempo de execução para atender a essas consultas com seus dados existentes..
  • 👨‍🚀Apollo Client — É uma biblioteca de gerenciamento de estado que simplifica o gerenciamento de dados remotos e locais com o GraphQL.
  • 📋React Hook Form — É uma biblioteca que ajuda a validar formulários no React. É uma biblioteca mínima sem quaisquer outras dependências.

🚀 Execução

# Clone o repositório
	git clone git@github.com:Gabriel-Monteiro7/ignite-labs.git

# Vá para o diretório do arquivo
	cd ignite-labs

# Instale as dependências
	yarn 

# Inicie o servidor do FrontEnd
	yarn dev
	
# Roda na porta 3000

# Inicie o servidor do Storybook
	yarn storybook
	
# Roda na porta 6006

# Executa os testes
	yarn test

# Vai precisar criar um arquivo .env.local com essas variáveis de ambiente 
para abrir conexão com o GraphCMS:

	VITE_API_URL_GRAPHCMS
	VITE_ACCESS_TOKEN_GRAPHCMS

# Executar codegen
	yarn codegen

💻 Visualização

Tela de Subscribe

Tela de Subscribe

Mobile

Tela de Subscribe Mobile

Tela do Evento

Tela do Evento

Mobile

Tela do Evento Mobile

🔖 Layout

Você pode visualizar o layout do projeto e gerar uma copia privada através desse link. É necessário ter conta no Figma para acessá-lo.

👨‍💻 Autor

Criado por Gabriel Monteiro

Coloque uma ⭐️ caso esse projeto tenha lhe servido para algo.

Releases

No releases published

Packages

No packages published

Languages