Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/kenmarcos/battle-of-heroes

nextjs radix-ui react-hook-form react-query reactjs shadcn-ui tailwindcss typescript zod zustand

Last synced: 5 days ago
JSON representation

Host: GitHub
URL: https://github.com/kenmarcos/battle-of-heroes
Owner: kenmarcos
Created: 2023-11-01T20:17:56.000Z (about 1 year ago)
Default Branch: main
Last Pushed: 2023-11-01T21:30:47.000Z (about 1 year ago)
Last Synced: 2024-11-21T03:43:09.652Z (2 months ago)
Topics: nextjs, radix-ui, react-hook-form, react-query, reactjs, shadcn-ui, tailwindcss, typescript, zod, zustand
Language: TypeScript
Homepage:
Size: 696 KB
Stars: 1
Watchers: 1
Forks: 0
Open Issues: 0
Metadata Files:
- Readme: README.md

Awesome Lists containing this project

README

        


    

        🦸 Battle of Heroes 🦸

    

    

        Sobre o Projeto •

        Funcionalidades •

        Instalação •

        Tecnologias •

        Autor

    





       



## 🖥️ Sobre o Projeto

Este projeto é uma aplicação web de um jogo de batalha de heróis.

A aplicação exibe uma lista de heróis que pode ser filtrada de acordo com o nome pesquisado. O usuário então escolhe dois personagens para uma batalha. O vencedor do combate será o personagem com a maior soma dos valores de cada poder que possui.

## 💡 Funcionalidades

- [x] Listagem de heróis

- [x] Filtragem de heróis

- [x] Sistema de combate

## ⚙️ Instalação

> Esse é um projeto Next.js inicializado com `create-next-app`

- Faça o fork desse repositório

- Abra o terminal e clone o repositório:

```Bash

$ git clone [email protected]:/battle-of-heroes.git

```

- Entre no diretório do projeto:

```Bash

$ cd battle-of-heroes/

```

- Adicione o arquivo `.env.local` na raiz do projeto com o seguinte conteúdo:

```Bash

NEXT_PUBLIC_API_URL=http://homologacao3.azapfy.com.br/api/ps

```

- Instale as dependências:

```Bash

$ npm install

# or

$ yarn install

```

- Execute o servidor de desenvolvimento:

```Bash

$ npm run dev

# or

$ yarn dev

```

Pronto! A aplicação, agora, pode ser acessada em um navegador através da url https://localhost:3000/.

## 🛠️ Tecnologias

Para o desenvolvimento desse projeto, as seguintes ferramentas foram utilizadas:

- **[React.js](https://pt-br.reactjs.org/)**

- **[Next.js](https://nextjs.org/)**

- **[TypeScript](https://www.typescriptlang.org/)**

- **[Zustand](https://zustand-demo.pmnd.rs/)**

- **[Tailwind](https://tailwindcss.com/)**

- **[Shadcn UI](https://ui.shadcn.com/)**

- **[Radix UI](https://www.radix-ui.com/)**

- **[React Query](https://tanstack.com/query/latest/)**

- **[React Hook Form](https://react-hook-form.com/)**

- **[Zod](https://zod.dev/)**

## 👨‍💻 Autor



Marcos Kenji Kuribayashi

[![Linkedin Badge](https://img.shields.io/badge/-LinkedIn-blue?style=flat&logo=Linkedin&logoColor=white)](https://www.linkedin.com/in/marcos-kuribayashi/) [![Gmail Badge](https://img.shields.io/badge/[email protected]?style=flat&logo=Gmail&logoColor=white)](mailto:[email protected])

---

Desenvolvido por Marcos Kenji Kuribayashi 😉