{"id":26910243,"url":"https://github.com/brunotxrs/dev-links","last_synced_at":"2026-04-10T17:02:30.523Z","repository":{"id":258701244,"uuid":"873346114","full_name":"brunotxrs/dev-links","owner":"brunotxrs","description":"Este projeto está passando por uma reestruturação completa para aprimorar a organização, separar os estilos corretamente e refatorar toda a estrutura de código. Além disso, a nova versão será construída do zero, aplicando meus próprios conhecimentos e garantindo total autoria do desenvolvimento.","archived":false,"fork":false,"pushed_at":"2025-03-12T15:22:33.000Z","size":22463,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-03-12T16:31:20.349Z","etag":null,"topics":["css3","figma","git","github","html5","javascript"],"latest_commit_sha":null,"homepage":"https://brunotxrs.github.io/dev-links/","language":"CSS","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/brunotxrs.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"License","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}},"created_at":"2024-10-16T02:30:05.000Z","updated_at":"2025-03-12T12:45:48.000Z","dependencies_parsed_at":"2025-03-12T22:31:21.905Z","dependency_job_id":null,"html_url":"https://github.com/brunotxrs/dev-links","commit_stats":null,"previous_names":["brunotxrs/projeto-devlinks","brunotxrs/devlinks","brunotxrs/dev-links"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/brunotxrs%2Fdev-links","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/brunotxrs%2Fdev-links/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/brunotxrs%2Fdev-links/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/brunotxrs%2Fdev-links/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/brunotxrs","download_url":"https://codeload.github.com/brunotxrs/dev-links/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":246647508,"owners_count":20811323,"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","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":["css3","figma","git","github","html5","javascript"],"created_at":"2025-04-01T13:32:00.719Z","updated_at":"2025-12-30T22:55:09.357Z","avatar_url":"https://github.com/brunotxrs.png","language":"CSS","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003ch1 align=\"center\"\u003e\u003cstrong\u003eDevLinks\u003c/strong\u003e\u003c/h1\u003e\n\n## Transformando HTML, CSS e JS em React com Estilo! \n\nEste projeto é uma reimaginação do desafio DevLinks do curso **Discover** da \u003ca href=\"https://app.rocketseat.com.br/journey/discover/overview\"\u003eRocketseat\u003c/a\u003e, originalmente desenvolvido em **HTML**, **CSS** e **JavaScript** puro. Decidi dar um passo além e reconstruí-lo em **React** para aprimorar minhas habilidades e mergulhar no mundo dos componentes reutilizáveis e estados gerenciados.\n\n## ✨ O Que Há de Novo?\n\n* **React Power:** A estrutura do projeto foi completamente transformada em componentes React, permitindo maior modularidade e reutilização de código.\n* **Context API:** Implementei um sistema de temas dinâmico usando a Context API do React, permitindo aos usuários alternar entre os modos claro e escuro com um simples clique.\n* **Ionicons:** Adicionei ícones de redes sociais elegantes e modernos com a biblioteca \u003ca href=\"https://ionic.io/ionicons\"\u003eIonicons\u003c/a\u003e, elevando a experiência visual do projeto.\n* **Responsividade:** O projeto foi otimizado para funcionar perfeitamente em dispositivos móveis e desktops, garantindo uma experiência consistente em qualquer tela.\n\n## ️ 🛠️ Tecnologias Utilizadas\n\n\u003cdiv align=\"center\"\u003e\n  \u003ca href=\"https://reactjs.org/\" target=\"_blank\"\u003e\u003cimg style=\"margin: 10px\" src=\"https://profilinator.rishav.dev/skills-assets/react-original-wordmark.svg\" alt=\"React\" height=\"30\" /\u003e\u003c/a\u003e\n  \u003ca href=\"https://www.w3schools.com/css/\" target=\"_blank\"\u003e\u003cimg style=\"margin: 10px\" src=\"https://profilinator.rishav.dev/skills-assets/css3-original-wordmark.svg\" alt=\"CSS3\" height=\"35\" /\u003e\u003c/a\u003e\n\u003c/div\u003e\n\n* **React** → A base da nossa aplicação, oferecendo componentes reutilizáveis e um fluxo de dados unidirecional.\n\n* **CSS3** → Estilização personalizada para criar uma interface atraente e responsiva.\n\n* **Context API →** Para o gerenciamento global do tema, permitindo a fácil alternância entre os modos claro e escuro.\n\n* **Ionicons →** Biblioteca de ícones para adicionar um toque especial aos links sociais.\n\n##  📦 Estrutura de Pastas\n\n```plaintext\ndevlinks/\n├── build/\n│   └── ...\n├── public/\n│   ├── index.html\n│   └── ...\n├── src/\n│   ├── assets/\n│   │   └── ...\n│   ├── Container/\n│   │   ├── profile/\n│   │   ├── switch/\n│   │   ├── links/\n│   │   ├── social-links/\n│   │   └── footer/\n│   ├── App.css\n│   ├── App.js\n│   ├── ...\n│   ├── index.js\n│   ├── index.css\n│   └── ...\n├── License\n├── package.json\n└── README.md\n\n```\n\n##  🧩 Componentes\n\n* **Profile:** Exibe o avatar e o nome de usuário.\n* **Switch:** Permite alternar entre os modos claro e escuro.\n* **Links:** Lista de links externos personalizados.\n* **SocialLinks:** Ícones de links para perfis de redes sociais.\n* **Footer:** Rodapé com mensagem de agradecimento e link para o perfil do autor.\n\n## 📷 Preview\nAqui estão algumas capturas de tela do projeto em diferentes dispositivos:\n\n\u003cp align=\"center\"\u003e\u003cstrong\u003eMobile\u003c/strong\u003e\u003c/p\u003e\n\u003cp align=\"center\"\u003e\n  \u003cimg alt=\"Projeto DevLinks versão mobile\" src=\"./src/assets/img/mobile.gif\" width=\"20%\"\u003e\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\u003cstrong\u003eDesktop\u003c/strong\u003e\u003c/p\u003e\n\u003cp align=\"center\"\u003e\n  \u003cimg alt=\"Projeto DevLinks versão desktop\" src=\"./src/assets/img/desktop.gif\" width=\"50%\"\u003e\n\u003c/p\u003e\n\n## 🔖 Layout\n\nVocê pode visualizar o layout do projeto [Clicando aqui](https://www.figma.com/community/file/1187422022288947321). É necessário ter conta no [Figma](https://figma.com) para acessá-lo.\n\n### 📜 Licença\n\nEste projeto está sob a licença MIT. Consulte o arquivo [Licença MIT](./License) para obter mais informações.\n\n## ✨ Developer\n👨‍💻 Este projeto foi desenvolvido por \u003cstrong\u003eBruno Teixeira\u003c/strong\u003e como parte do meu portfólio de desenvolvimento Front-End. Sinta-se à vontade para entrar em contato ou contribuir com o projeto!\n\n- [![LinkedIn](https://custom-icon-badges.demolab.com/badge/LinkedIn-0A66C2?logo=linkedin-white\u0026logoColor=fff)](https://www.linkedin.com/in/brunotxrs/)\n\n- [![GitHub](https://img.shields.io/badge/GitHub-%23121011.svg?logo=github\u0026logoColor=white)](https://github.com/brunotxrs)\n\n**Divirta-se explorando o DevLinks em React!**","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbrunotxrs%2Fdev-links","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbrunotxrs%2Fdev-links","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbrunotxrs%2Fdev-links/lists"}