{"id":26235856,"url":"https://github.com/sub-dev/blizzard-br-challenges","last_synced_at":"2026-05-01T20:31:19.433Z","repository":{"id":246102001,"uuid":"819545430","full_name":"Sub-Dev/blizzard-br-challenges","owner":"Sub-Dev","description":"Landing page responsiva da Blizzard, desenvolvida para o desafio da BRChallenges. Utiliza HTML5, CSS3, JavaScript, React.js, Material-UI, Sass, TypeScript e Axios para apresentar os principais jogos da Blizzard de forma dinâmica.","archived":false,"fork":false,"pushed_at":"2024-07-16T18:43:18.000Z","size":86880,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-12-27T05:56:04.495Z","etag":null,"topics":["axios","blizzard","brchallenges","material-ui","react","reactjs"],"latest_commit_sha":null,"homepage":"https://sub-dev.github.io/blizzard-br-challenges/","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Sub-Dev.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2024-06-24T18:13:13.000Z","updated_at":"2024-07-16T18:43:22.000Z","dependencies_parsed_at":"2024-07-16T22:51:13.223Z","dependency_job_id":null,"html_url":"https://github.com/Sub-Dev/blizzard-br-challenges","commit_stats":null,"previous_names":["sub-dev/blizzard-br-challenges"],"tags_count":1,"template":false,"template_full_name":null,"purl":"pkg:github/Sub-Dev/blizzard-br-challenges","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Sub-Dev%2Fblizzard-br-challenges","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Sub-Dev%2Fblizzard-br-challenges/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Sub-Dev%2Fblizzard-br-challenges/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Sub-Dev%2Fblizzard-br-challenges/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Sub-Dev","download_url":"https://codeload.github.com/Sub-Dev/blizzard-br-challenges/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Sub-Dev%2Fblizzard-br-challenges/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":32512662,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-30T13:12:12.517Z","status":"online","status_checked_at":"2026-05-01T02:00:05.856Z","response_time":64,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["axios","blizzard","brchallenges","material-ui","react","reactjs"],"created_at":"2025-03-13T03:18:12.178Z","updated_at":"2026-05-01T20:31:19.225Z","avatar_url":"https://github.com/Sub-Dev.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003ch1 align=\"center\"\u003e\n  \u003cimg src=\".github/logo.png\" height=\"60px\" /\u003e\n\u003c/h1\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003cimg src=\".github/demo.png\" width=\"100%\" /\u003e\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003cimg src=\".github/demo2.gif\" width=\"100%\" /\u003e\n\u003c/p\u003e\n\n## 💻 Projeto\n\nEsse projeto é uma landing page da empresa **Blizzard**, ela é composta por um menu de navegação, um banner hero com as informações dos principais jogos da empresa(Diablo, HearthStone e World of Warcraft), a listagem dos jogos exclusivos e um rodapé com informações do download do app battle.net.\n\nPara facilitar a codificação do projeto foi usado um protótipo do figma como base, o autor do layout é o design [**Gilberto Prado**](https://www.linkedin.com/in/gilberto-insanydesign/), [clique aqui](https://www.brchallenges.com/desafio/blizzard) para saber mais detalhes do desafio.\n\n## Descrição\n\nO objetivo deste desafio é criar uma landing page que apresente os principais jogos da empresa Blizzard, conforme detalhado na página do desafio no site BRChallenges. Utilizarei as tecnologias listadas abaixo para garantir que todas as funcionalidades e requisitos propostos pelo desafio sejam contemplados.\n\n## 🎨 Tecnologias utilizadas\n- \u003cimg align=\"center\" alt=\"HTML\" height=\"30\" width=\"40\" src=\"https://cdn.jsdelivr.net/gh/devicons/devicon@latest/icons/html5/html5-original.svg\"\u003e HTML5: Para a estrutura e layout da interface do jogo.\n- \u003cimg align=\"center\" alt=\"CSS\" height=\"30\" width=\"40\" src=\"https://cdn.jsdelivr.net/gh/devicons/devicon@latest/icons/css3/css3-original.svg\"\u003e CSS3: Para estilizar e tornar o jogo visualmente atraente com animações e transições.\n- \u003cimg align=\"center\" alt=\"Js\" height=\"30\" width=\"40\" src=\"https://cdn.jsdelivr.net/gh/devicons/devicon@latest/icons/javascript/javascript-original.svg\"\u003e JavaScript: Para adicionar funcionalidade e lógica ao jogo.\n- \u003cimg align=\"center\" alt=\"ReactJS\" height=\"30\" width=\"40\" src=\"https://cdn.jsdelivr.net/gh/devicons/devicon@latest/icons/react/react-original-wordmark.svg\"\u003e [React.js](https://pt-br.reactjs.org/): Para criar uma experiência de usuário responsiva e interativa.\n-  \u003cimg align=\"center\" alt=\"Material-UI\" height=\"30\" width=\"40\" src=\"https://cdn.jsdelivr.net/gh/devicons/devicon@latest/icons/materialui/materialui-original.svg\" /\u003e[Material-UI](https://mui.com/material-ui/): Biblioteca de componentes React utilizada para implementar o design com base no Material Design da Google, proporcionando uma UI consistente e moderna.\n-  \u003cimg align=\"center\" alt=\"Saas\" height=\"30\" width=\"40\" src=\"https://cdn.jsdelivr.net/gh/devicons/devicon@latest/icons/sass/sass-original.svg\" /\u003e[Saas](https://sass-lang.com/): Utilizado para escrever estilos CSS de forma mais eficiente e organizada, aproveitando recursos como variáveis e aninhamento.\n-  \u003cimg align=\"center\" alt=\"Saas\" height=\"30\" width=\"40\" src=\"https://cdn.jsdelivr.net/gh/devicons/devicon@latest/icons/typescript/typescript-original.svg\" /\u003e[Typescript](https://www.typescriptlang.org/): Adicionado para adicionar tipagem estática opcional ao JavaScript, aumentando a robustez e a escalabilidade do código.\n-  \u003cimg  align=\"center\" alt=\"Axios\" height=\"30\" width=\"40\" src=\"https://cdn.jsdelivr.net/gh/devicons/devicon@latest/icons/axios/axios-plain.svg\" /\u003e[Axios](https://axios-http.com/):  Cliente HTTP baseado em Promise utilizado para fazer requisições HTTP de forma simplificada e eficiente para a conexão com a API.\n\n## 📝 Requisitos do desafio\n\n### Nível Fácil\n\n- [x] Criar as seções: **Menu**, **Banner hero**, **Footer**.\n\n- [x]  O texto e o ícone do botão “Baixar jogo” devem ser alterados conforme o sistema operacional do usuário que estiver acessando a página. ( [material de apoio](https://developer.mozilla.org/en-US/docs/Web/API/Navigator/userAgent))\n\n- [x]  Aplicar efeito de *hover* nas opções do menu de navegação.\n\n- [x]  Aplicar responsividade para as seguintes resoluções: [x] 1920px, [x] 1440px, [x] 768px e [x] 375px.\n\n### Nível Médio\n### \n\n- [x]  Todos os requisitos do nivel fácil.\n\n- [x]  Criar as seções: **Menu**, **Banner hero**, **Jogos Exclusivo**, **Footer**.\n\n- [x]  Buscar a lista de jogos via api. ([acessar endpoint](https://api-brchallenges.vercel.app/api/blizzard/games))\n\n- [x]  Aplicar efeito de hover nas imagens dos jogos da seção **Jogos Exclusivos**.\n\n- [x]  Alterar as informações da seção **Banner Hero** ao selecionar uma opção no menu lateral. Os jogos disponíveis são **Diablo**, **HearthStone** e **World of Warcraft**.\n\n### Nível Difícil\n\n- [x]  Todos os requisitos do nivel fácil e médio.\n\n- [x]  Ao clicar no botão **Logar** do menu de navegação, deverá ser exibido o modal de login.\n\n- [x]  Criar componente de *dropdown* para as opções **Jogos** e **Esportes** do menu de navegação.\n\n- [x]  Deverá ser executado um *gif* do jogo quando ocorrer o evento de *hover* na capa do trailer\n\n\n## 👥 Autores\n\n\u003ctable\u003e\n \u003ctr\u003e\n \u003ctd alinhar=\"centro\"\u003e\n \u003ca href=\"https://github.com/Sub-Dev\" target=\"_blank\"\u003e\n \u003cimg src=\"https://avatars.githubusercontent.com/u/68450692?v=4\" alt=\"Anthony-Marin\" height=\"30\" width=\"30\"/\u003e\n \u003c/a\u003e\n \u003c/td\u003e\n \u003ctd\u003e\n \u003cstrong\u003eAnthony Marin\u003c/strong\u003e (Sub-Dev) - \u003ca href=\"https://github.com/Sub-Dev\"\u003ePerfil no GitHub\u003c/a\u003e\n \u003c/td\u003e\n \u003c/tr\u003e\n\u003c/table\u003e\n\n## 💬 Obrigado\nObrigado ao [**BRChallenges**](https://www.brchallenges.com/) pelo desafio envolvente que inspirou este projeto e ao [**Gilberto Prado**](https://www.linkedin.com/in/gilberto-insanydesign/) pelo design base Agradecimentos especiais à comunidade de código aberto pelos recursos e ferramentas inestimáveis ​​que tornaram este projeto possível.\n\n## 🌐 Links\n- Live Demo: [Veja o Projeto aqui](https://sub-dev.github.io/blizzard-br-challenges/)\n- Link do desafio: [Desafio BRChallenges](https://www.brchallenges.com/desafio/blizzard)\n- Repositório: [Repositório no GitHub](https://github.com/Sub-Dev/blizzard-br-challenges)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsub-dev%2Fblizzard-br-challenges","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsub-dev%2Fblizzard-br-challenges","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsub-dev%2Fblizzard-br-challenges/lists"}