https://github.com/maurodesouza/marvel-explorer

🦸‍♀️ Busque pelo seus heróis favoritos com o Marvel Explorer
https://github.com/maurodesouza/marvel-explorer

jest marvel nextjs testing-library tests typescript

Last synced: 3 months ago
JSON representation

🦸‍♀️ Busque pelo seus heróis favoritos com o Marvel Explorer

• Host: GitHub
• URL: https://github.com/maurodesouza/marvel-explorer
• Owner: maurodesouza
• License: mit
• Created: 2021-05-28T21:38:34.000Z (over 3 years ago)
• Default Branch: master
• Last Pushed: 2021-08-02T17:09:20.000Z (over 3 years ago)
• Last Synced: 2024-04-09T15:05:52.238Z (10 months ago)
• Topics: jest, marvel, nextjs, testing-library, tests, typescript
• Language: TypeScript
• Homepage: https://marvel-explorer.vercel.app
• Size: 4.86 MB
• Stars: 21
• Watchers: 2
• Forks: 3
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE.md

Awesome Lists containing this project

README

        


  


   

  


    💻 Site   |  

    📚 Stories   |  

    🎨 Design

  



Marvel Explorer




  

  

  

  

  





  Sobre   |  

  Tecnologias   |  

  Pré requisitos   |  

  Começando   |  

  Licença   |  

  Autor






## :dart: Sobre ##

O Marvel Explorer é um projeto que foi desenvolvido para o desafio front end da [FPass](https://fpass.com.br)!

O desafio consiste em criar um pequeno app utilizando a [API da Marvel](https://developer.marvel.com) para que no mínimo pesquise/liste os heróis pelo nome.

Para fazer o app utilizei o [Nextjs](https://nextjs.org) para criar toda a interface, [Storybook](https://storybook.js.org) para fazer a documentação dos componentes, e para os teste, [Jest](https://jestjs.io) com [Testing Library](https://testing-library.com/docs/dom-testing-library/intro/), e tudo isso com [Typescript](https://www.typescriptlang.org) ❤

## :rocket: Principais tecnologias ##



  

    



  

    



  

    



  

    



  

    



  

    



  

    



  



 

  Ver mais

  


  * [Styled Media Query](https://github.com/morajabi/styled-media-query)

  * [Styled Icons](https://styled-icons.js.org)

  * [Axios](https://github.com/axios/axios)

  * [Plop](https://plopjs.com)

## :white_check_mark: Pré requisitos ##

Antes de começar :checkered_flag:, você precisa ter o [Git](https://git-scm.com) e o [Node](https://nodejs.org/en/) instalados em sua maquina.

Também vai precisar ter uma conta de desenvolvedor na [Marvel](https://developer.marvel.com) para poder obter a sua chave da API.

## :checkered_flag: Começando ##

```bash

# Clone este repositório

$ git clone https://github.com/maurodesouza/marvel-explorer

# Entre na pasta

$ cd marvel-explorer

# Crie um arquivo .env.local e preencha as seguintes variavéis

MARVEL_API_URL=https://gateway.marvel.com:443/v1/public

MARVEL_API_KEY=

## https://developer.marvel.com/documentation/authorization - Authentication for Server-Side Applications

MARVEL_HASH=

MARVEL_TS=

## Você pode seguir o arquivo .env.example também se preferir!

# Instale as dependências

$ yarn

# Para iniciar o projeto

$ yarn dev

# O app vai inicializar em 

```

## :video_game: Comandos

- `dev`: inicia a aplicação em `localhost:3000`

- `build`: cria a build para produção

- `start`: inicia um server com o código da build

- `lint`: roda o eslint na pasta src

- `test`: roda os testes

- `test:watch`: roda os testes no watch mode

- `storybook`: inicia o storybook em `localhost:6006`

- `build-storybook`: cria a build do storybook

- `generate`: cria a estrutura padrão de um componente

 

## :memo: Licença ##

Este projeto está sob licença MIT. Veja o arquivo [LICENSE](LICENSE.md) para mais detalhes.

Feito com :heart: por Mauro de Souza

 

Voltar para o topo