{"id":17353046,"url":"https://github.com/gmartins-dev/react-mblabs","last_synced_at":"2025-09-14T15:01:56.047Z","repository":{"id":104004869,"uuid":"502400098","full_name":"gmartins-dev/react-mblabs","owner":"gmartins-dev","description":"React + TypeScript + MaterialUi","archived":false,"fork":false,"pushed_at":"2022-06-14T19:59:57.000Z","size":187,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-03-27T13:14:18.199Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","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/gmartins-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}},"created_at":"2022-06-11T16:28:26.000Z","updated_at":"2022-06-15T15:56:57.000Z","dependencies_parsed_at":"2023-11-08T11:34:36.334Z","dependency_job_id":"7bd5124d-ce00-4cf6-8f38-3cb0559fef7b","html_url":"https://github.com/gmartins-dev/react-mblabs","commit_stats":null,"previous_names":["gmartins-dev/react-mblabs"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/gmartins-dev/react-mblabs","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gmartins-dev%2Freact-mblabs","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gmartins-dev%2Freact-mblabs/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gmartins-dev%2Freact-mblabs/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gmartins-dev%2Freact-mblabs/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/gmartins-dev","download_url":"https://codeload.github.com/gmartins-dev/react-mblabs/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gmartins-dev%2Freact-mblabs/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":267905797,"owners_count":24163971,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-07-30T02:00:09.044Z","response_time":70,"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":[],"created_at":"2024-10-15T17:15:26.265Z","updated_at":"2025-07-30T17:04:59.931Z","avatar_url":"https://github.com/gmartins-dev.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\n  \n\n\u003cp  align=\"center\"\u003e\n\n\u003cimg  alt=\"MB Labs cover poster\"  src=\"https://images2.imgbox.com/23/83/BsKlUhhW_o.png\" /\u003e\n\n\u003c/p\u003e\n\n  \n\n\u003ch1  align=\"center\"\u003e\n\nTeste Front-end - React - MB Labs\n\n\u003c/h1\u003e\n\n  \n  \n  \n\n## 🗃 Projeto\n\n  \n\n**Escopo do projeto:**\n\n  \n\nSingle Page Application(SPA) que recebe os dados de uma Api externa simulando um backend com a lista de eventos disponíveis.\n\n  \n\n**Elementos:**\n\n  \n\n- Lista dos eventos em forma de tabela.\n\n- Barra de busca (que filtra pelo título do evento)\n\n- Botão select #1 (que dá opções de buscar somente eventos de Empresas ou Universidades ou por padrão ambos)\n\n- Botão select #2 (que dá opções de buscar somente eventos Online ou Presenciais ou por padrão ambos)\n\n- Botão de compra do ingresso de um evento especifico\n\n  \n\n**Dados:**\n\n  \n\nFoi criada uma API mock/faker com campos similares aos que podem ser usados na etapa de produção apenas para testes.\n\nOs dados usados na tabela foram gerados aleátoriamente pela ferramenta faker.js.\n\nEsses dados são conectados ao front-end atraves de requisição http utilizando o axios.\n\n  \n\nAPI endpoint\n\nhttps://62a5c330430ba53411cc191f.mockapi.io/api/v1/tickets\n\n  \n\nAPI schema:\n\n\u003cp  align=\"center\"\u003e\n\n\u003cimg  alt=\"API schema\"  width=\"600px\"  src=\"https://images2.imgbox.com/32/6c/SMR7QkbY_o.jpeg\" /\u003e\n\n\u003c/p\u003e\n\nJSON retornado pela API:\n\n\u003cp  align=\"center\"\u003e\n\n\u003cimg  alt=\"API schema\" width=\"600px\"  src=\"https://images2.imgbox.com/8a/f0/LGnyWNZE_o.png\" /\u003e\n\n\u003c/p\u003e\n\n## 🛠 Possiveis melhorias/upgrades:\n\n  \n\n1. Tela de login antes da aplicação principal\n\n2. Tela de confirmação do pedido/pagamento\n\n3. Dashboard para gerenciamento e criação de eventos\n\n4. Melhorias de UI/UX\n\n5. Melhorias na responsividade/acessibilidade\n\n6. Criar design/select de modo \"light/dark\"\n\n## 🧪 Tecnologias\n\n  \n\nEsse projeto foi desenvolvido principalmente com as seguintes tecnologias:\n\n  \n\n- \u003cimg  align=\"center\"  alt=\"React\"  height=\"30\"  width=\"30\"  src=\"https://raw.githubusercontent.com/devicons/devicon/master/icons/react/react-original.svg\"\u003e **React**\n\n  \n\n- \u003cimg  align=\"center\"  alt=\"Ts\"  height=\"30\"  width=\"30\"  src=\"https://raw.githubusercontent.com/devicons/devicon/master/icons/typescript/typescript-plain.svg\"\u003e **TypeScript**\n\n- \u003cimg  align=\"center\"  alt=\"Ts\"  height=\"30\"  width=\"30\"  src=\"https://v4.mui.com/static/logo.png\"\u003e **Material Ui**\n\n  \n  \n  \n\n## 📕 Bibliotecas\n\n  \n\nEsse projeto foi utilizou das seguintes libs:\n\n  \n\n- vitejs\n\n- axios\n\n- material-ui\n\n\n\n## 💻 Demonstração\n\n  \n\n\u003cp  align=\"center\"\u003e\n\n\u003cimg  alt=\"Print1\" width=\"1200px\" src=\"https://images2.imgbox.com/cf/1b/md8r7Ja3_o.png\" /\u003e\n\n\u003c/p\u003e\n\n\u003cp  align=\"center\"\u003e\n\n\u003cimg  alt=\"Print2\" width=\"1200px\" src=\"https://images2.imgbox.com/09/90/AIMYw3Pw_o.png\" /\u003e\n\n\u003c/p\u003e\n\n\u003cp  align=\"center\"\u003e\n\n\u003cimg  alt=\"Print3\" width=\"1200px\" src=\"https://images2.imgbox.com/cb/cd/N7NwfRfO_o.png\" /\u003e\n\n\u003c/p\u003e\n\n\u003cp  align=\"center\"\u003e\n\n\u003cimg  alt=\"Print4\" width=\"1200px\" src=\"https://images2.imgbox.com/9a/7e/blkrY5Eg_o.png\" /\u003e\n\n\u003c/p\u003e\n\n  \n  \n  \n\n\n  \n  \n  \n  \n\n## 🔖 Layout\n\n  \n\n- **Fonte**: **[Roboto](https://fonts.google.com/specimen/Roboto)**\n\n  \n  \n\n- **Principais cores utilizadas:**\n\n  \n\nBody background: \"aliceblue\" #F0F8FF\n\n  \n\nTabela\n\nHeader: #1976D2\n\nBody cinza: #F5F5F5\n\nBody branco: #FFFFFF\n\n  \n\nFonte\n\nCor primária: #202020\n\nCor secundária: #FFFFFF\n\n  \n  \n\n  \n  \n\n\n\n  \n\n## 🚀 Como executar\n\n  \n\nClone o projeto e acesse a pasta do mesmo.\n\n  \n\n```bash\n\n$ git clone https://github.com/guilhermemm-dev/react-mblabs\n\n$ cd react-mblabs\n\n```\n\n  \n\nPara iniciá-lo, siga os passos abaixo:\n\n```bash\n\n# Instalar as dependências\n\n$ yarn ou npm install\n\n  \n\n# Iniciar o projeto\n\n$ yarn start ou npm run dev\n\n```\n\nO app estará disponível no seu browser pelo endereço http://localhost:3000.\n\n  \n  \n  \n\n## 📝 License\n\n  \n\nEsse projeto está sob a licença MIT.\n\n  \n\n\u003cimg  src=\"https://img.shields.io/static/v1?label=license\u0026message=MIT\u0026color=8257E5\u0026labelColor=000000\"  alt=\"License\"\u003e\n\n\u003c/p\u003e\n\n  \n  \n\n\u003chr/\u003e\n\n  \n\n  \n\n\u003ch3\u003e Feito por Guilherme Martins - @guilhermemm-dev \u003c/h3\u003e\n\n  \n\n  \n\n1. LinkedIn: https://www.linkedin.com/in/guilhermemm-dev/\n\n  \n\n2. GitHub: https://github.com/guilhermemm-dev\n\n  \n\n3. Portfolio: https://guilhermemm-dev.github.io/portifolio/\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgmartins-dev%2Freact-mblabs","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fgmartins-dev%2Freact-mblabs","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgmartins-dev%2Freact-mblabs/lists"}