{"id":13492985,"url":"https://github.com/arthurspk/guiadofrontend","last_synced_at":"2025-05-15T11:08:36.040Z","repository":{"id":42013041,"uuid":"471856441","full_name":"arthurspk/guiadofrontend","owner":"arthurspk","description":"Nesse guia você encontrará tudo para se torna um desenvolvedor front-end, dessa maneira, encontrará mapas mentais, cursos, trilhas e outras ferramentas para poder praticar o conhecimento adquirido.","archived":false,"fork":false,"pushed_at":"2023-03-31T20:41:14.000Z","size":3215,"stargazers_count":2853,"open_issues_count":3,"forks_count":261,"subscribers_count":69,"default_branch":"main","last_synced_at":"2025-04-14T19:58:55.977Z","etag":null,"topics":["css","css3","front-end-development","frontend","guia","guia-de-estudos","html","html-css-javascript","html5","javascript","javascript-applications","javascript-framework","javascript-library","roadmap","roadmaps"],"latest_commit_sha":null,"homepage":"","language":null,"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/arthurspk.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}},"created_at":"2022-03-20T02:03:02.000Z","updated_at":"2025-04-14T00:13:34.000Z","dependencies_parsed_at":"2024-01-16T09:51:58.545Z","dependency_job_id":"f8254f07-5da6-4617-87b7-ed2221e6b427","html_url":"https://github.com/arthurspk/guiadofrontend","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/arthurspk%2Fguiadofrontend","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/arthurspk%2Fguiadofrontend/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/arthurspk%2Fguiadofrontend/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/arthurspk%2Fguiadofrontend/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/arthurspk","download_url":"https://codeload.github.com/arthurspk/guiadofrontend/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254328385,"owners_count":22052632,"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":["css","css3","front-end-development","frontend","guia","guia-de-estudos","html","html-css-javascript","html5","javascript","javascript-applications","javascript-framework","javascript-library","roadmap","roadmaps"],"created_at":"2024-07-31T19:01:11.046Z","updated_at":"2025-05-15T11:08:36.016Z","avatar_url":"https://github.com/arthurspk.png","language":null,"funding_links":[],"categories":["Others"],"sub_categories":[],"readme":"\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://github.com/arthurspk/guiadofrontend\"\u003e\n    \u003cimg src=\"./images/guia.png\" alt=\"Guia do Desenvolvedor Front-end\" width=\"160\" height=\"160\"\u003e\n  \u003c/a\u003e\n  \u003ch1 align=\"center\"\u003eGuia do Desenvolvedor Front-end\u003c/h1\u003e\n\u003c/p\u003e\n\n## :dart: O guia para alavancar a sua carreira\n\nAbaixo você encontrará conteúdos para te guiar e ajudar a se torna um desenvolvedor front-end, caso você já atue como front-end confere o repositório para descobrir novas ferramentas para o seu dia-a-dia, os caminhos que você pode tomar e as tecnologias para incorporar na sua stack para se tornar um profissional atualizado e diferenciado em front-end, faça bom uso do guia e bons estudos!\n\n\u003csub\u003e \u003cstrong\u003eSegue nas redes sociais para acompanhar mais conteúdo: \u003c/strong\u003e \u003cbr\u003e\n[\u003cimg src = \"https://img.shields.io/badge/GitHub-100000?style=for-the-badge\u0026logo=github\u0026logoColor=white\"\u003e](https://github.com/arthurspk)\n[\u003cimg src = \"https://img.shields.io/badge/Facebook-1877F2?style=for-the-badge\u0026logo=facebook\u0026logoColor=white\"\u003e](https://www.facebook.com/seixasqlc/)\n[\u003cimg src=\"https://img.shields.io/badge/linkedin-%230077B5.svg?\u0026style=for-the-badge\u0026logo=linkedin\u0026logoColor=white\" /\u003e](https://www.linkedin.com/in/arthurspk/)\n[\u003cimg src = \"https://img.shields.io/badge/Twitter-1DA1F2?style=for-the-badge\u0026logo=twitter\u0026logoColor=white\"\u003e](https://twitter.com/manotoquinho)\n[![Discord Badge](https://img.shields.io/badge/Discord-5865F2?style=for-the-badge\u0026logo=discord\u0026logoColor=white)](https://discord.gg/NbMQUPjHz7)\n[\u003cimg src = \"https://img.shields.io/badge/instagram-%23E4405F.svg?\u0026style=for-the-badge\u0026logo=instagram\u0026logoColor=white\"\u003e](https://www.instagram.com/guiadevbrasil/)\n[![Youtube Badge](https://img.shields.io/badge/YouTube-FF0000?style=for-the-badge\u0026logo=youtube\u0026logoColor=white)](https://www.youtube.com/channel/UCzmXzz_VR0Li8-YOvWN_t3g)\n\u003c/sub\u003e\n\n## 💌 Doações\n\n\u003e Olá! Se você está lendo isso, é porque provavelmente já conhece o meu repositório no GitHub, que oferece conteúdo gratuito para ajudar desenvolvedores a aprimorarem suas habilidades. E se você está aqui, talvez esteja considerando contribuir com uma doação para apoiar a continuação do projeto.\n\n- [Clique aqui para realizar realizar uma doação! 💓](https://beacons.ai/doacoesguiadev)\n\n\u003e Se você quiser contribuir, existem várias opções disponíveis, incluindo PayPal, PagSeguro, Mercado Pago, Buy Me A Coffe, Pic Pay e Pix. Qualquer doação, por menor que seja, é extremamente bem-vinda e será usada com responsabilidade e transparência. Obrigado por considerar apoiar meu projeto! Juntos, podemos continuar a compartilhar conhecimento e ajudar a criar uma comunidade de desenvolvedores mais forte e colaborativa.\n\n## :closed_book: E-Book\n\n\u003e Este repositório é um projeto gratuito para a comunidade de desenvolvedores. Você pode me ajudar comprando o e-book \"e-Front\" se estiver interessado em aprender ou melhorar suas habilidades de desenvolvimento front-end. O e-book é completo e cobre tecnologias essenciais como HTML, CSS, JavaScript, React, TypeScript e mais. O valor é simbólico e sua compra me ajuda a produzir e fornecer mais conteúdo gratuito para a comunidade. Adquira agora e comece sua jornada no desenvolvimento front-end.\n\n- eFront - Estudando Desenvolvimento Front-end do Zero. [Clique aqui para comprar](https://hotm.art/cSMObU)\n\n## 📛 Direitos autorais\n\n\u003e Esse projeto tomou como referência para ser feito os roadmaps feito pelo projeto [roadmap.sh](https://roadmap.sh/roadmaps) você pode conferir todo o projeto original feito pelos autores principais pelos links abaixo, desde já agradecendo a todos eles por fornecer esse conteúdo que serviu de extrema importância e de base para a criação deste repositório.\n\n- [Roadmap.sh](https://roadmap.sh/roadmaps) - Site do roadmap.sh onde você encontrará diversos roadmaps em inglês.\n- [Repositório Oficial do Projeto](https://github.com/kamranahmedse/developer-roadmap/blob/master/license) - Repositório oficial do projeto em inglês.\n\n## :warning: Nossa proposta\n\n\u003e A proposta deste guia é dar uma ideia sobre o atual panorama e guiá-lo se você estiver confuso sobre qual o próximo aprendizado, não influenciar você a seguir os 'hypes' e 'trendys' do momento. Acreditamos que com um \u003cb\u003emaior conhecimento das diferentes estruturas e soluções disponíveis poderá escolher a ferramenta que melhor se aplica às suas demandas.\u003c/b\u003e E lembre-se, 'hypes' e 'trendys' nem sempre são as melhores opções.\n\n## :beginner: Para quem está começando agora\n\n\u003e Não se assuste com a quantidade de conteúdo apresentados neste guia. Mesmo o foco sendo para profissionais já consolidados que desejam se manter atualizados, acredito que quem está começando pode usá-lo não como um objetivo, mas como um apoio para os estudos. \u003cb\u003eNeste momento, dê enfoque no que te dá produtividade e o restante marque como \u003ci\u003eVer depois\u003c/i\u003e\u003c/b\u003e. Ao passo que seu conhecimento se torna mais amplo, a tendência é este guia fazer mais sentido e fácil de ser assimilado. Bons estudos e entre em contato sempre que quiser! :punch:\n\n## 🚨 Colabore\n\n- Abra Pull Requests com atualizações \n- Discuta ideias em Issues\n- Compartilhe o repositório com a sua comunidade\n- Mande feedbacks no [LinkedIn](https://www.linkedin.com/in/arthurspk/)\n\n## 🌍 Tradução\n\u003e Se você deseja acompanhar esse repositório em outro idioma que não seja o Português Brasileiro, você pode optar pelas escolhas de idiomas abaixo, você também pode colaborar com a tradução para outros idiomas e a correções de possíveis erros ortográficos, a comunidade agradece.\n\n\u003cimg src = \"https://i.imgur.com/lpP9V2p.png\" alt=\"Guia Extenso de Programação\" width=\"16\" height=\"15\"\u003e・\u003cb\u003eEnglish — \u003c/b\u003e [Click Here](https://github.com/arthurspk/guiadevbrasil)\u003cbr\u003e\n\u003cimg src = \"https://i.imgur.com/GprSvJe.png\" alt=\"Guia Extenso de Programação\" width=\"16\" height=\"15\"\u003e・\u003cb\u003eSpanish — \u003c/b\u003e [Click Here](https://github.com/arthurspk/guiadevbrasil)\u003cbr\u003e\n\u003cimg src = \"https://i.imgur.com/4DX1q8l.png\" alt=\"Guia Extenso de Programação\" width=\"16\" height=\"15\"\u003e・\u003cb\u003eChinese — \u003c/b\u003e [Click Here](https://github.com/arthurspk/guiadevbrasil)\u003cbr\u003e\n\u003cimg src = \"https://i.imgur.com/6MnAOMg.png\" alt=\"Guia Extenso de Programação\" width=\"16\" height=\"15\"\u003e・\u003cb\u003eHindi — \u003c/b\u003e [Click Here](https://github.com/arthurspk/guiadevbrasil)\u003cbr\u003e\n\u003cimg src = \"https://i.imgur.com/8t4zBFd.png\" alt=\"Guia Extenso de Programação\" width=\"16\" height=\"15\"\u003e・\u003cb\u003eArabic — \u003c/b\u003e [Click Here](https://github.com/arthurspk/guiadevbrasil)\u003cbr\u003e\n\u003cimg src = \"https://i.imgur.com/iOdzTmD.png\" alt=\"Guia Extenso de Programação\" width=\"16\" height=\"15\"\u003e・\u003cb\u003eFrench — \u003c/b\u003e [Click Here](https://github.com/arthurspk/guiadevbrasil)\u003cbr\u003e\n\u003cimg src = \"https://i.imgur.com/PILSgAO.png\" alt=\"Guia Extenso de Programação\" width=\"16\" height=\"15\"\u003e・\u003cb\u003eItalian — \u003c/b\u003e [Click Here](https://github.com/arthurspk/guiadevbrasil)\u003cbr\u003e\n\u003cimg src = \"https://i.imgur.com/0lZOSiy.png\" alt=\"Guia Extenso de Programação\" width=\"16\" height=\"15\"\u003e・\u003cb\u003eKorean — \u003c/b\u003e [Click Here](https://github.com/arthurspk/guiadevbrasil)\u003cbr\u003e\n\u003cimg src = \"https://i.imgur.com/3S5pFlQ.png\" alt=\"Guia Extenso de Programação\" width=\"16\" height=\"15\"\u003e・\u003cb\u003eRussian — \u003c/b\u003e [Click Here](https://github.com/arthurspk/guiadevbrasil)\u003cbr\u003e\n\u003cimg src = \"https://i.imgur.com/i6DQjZa.png\" alt=\"Guia Extenso de Programação\" width=\"16\" height=\"15\"\u003e・\u003cb\u003eGerman — \u003c/b\u003e [Click Here](https://github.com/arthurspk/guiadevbrasil)\u003cbr\u003e\n\u003cimg src = \"https://i.imgur.com/wWRZMNK.png\" alt=\"Guia Extenso de Programação\" width=\"16\" height=\"15\"\u003e・\u003cb\u003eJapanese — \u003c/b\u003e [Click Here](https://github.com/arthurspk/guiadevbrasil)\u003cbr\u003e\n\n## 🗺️ Frontend Roadmap\n\n![Frontend Roadmap](./images/frontend.jpg)\n\n## ◾ HTTP\n\n\u003e O Hypertext Transfer Protocol, sigla HTTP é um protocolo de comunicação utilizado para sistemas de informação de hipermídia, distribuídos e colaborativos. Ele é a base para a comunicação de dados da World Wide Web.\n\n- [MDN - HTTP](https://developer.mozilla.org/pt-BR/docs/Web/HTTP) - O MDN Web Docs é o website oficial de Mozilla para desenvolvimento de padrões web\n\n## ◾ HTML\n\n\u003e HTML (Linguagem de Marcação de HiperTexto) é o bloco de construção mais básico da web. Define o significado e a estrutura do conteúdo da web. Outras tecnologias além do HTML geralmente são usadas para descrever a aparência/apresentação (CSS) ou a funcionalidade/comportamento (JavaScript) de uma página da web, sendo assim HTML é uma linguagem essência para você que quer se tornar desenvolvedor front-end.\n\n- [MDN - HTML](https://developer.mozilla.org/pt-BR/docs/Web/HTML) - O MDN Web Docs é o website oficial de Mozilla para desenvolvimento de padrões web\n- [Cursos de HTML](https://github.com/arthurspk/guiadevbrasil#-cursos-de-html-e-css) - Cursos de HTML do repositório geral do Guia Dev Brasil\n\n## ◾ CSS\n\n\u003e CSS (Cascading Style Sheets) é um mecanismo para adicionar estilo a um documento web. O código CSS pode ser aplicado diretamente nas tags ou ficar contido dentro das tags \u003cstyle\u003e. Também é possível, em vez de colocar a formatação dentro do documento, criar um link para um arquivo CSS que contém os estilos.\n\n- [MDN - CSS](https://developer.mozilla.org/pt-BR/docs/Web/CSS) - O MDN Web Docs é o website oficial de Mozilla para desenvolvimento de padrões web\n- [Cursos de CSS](https://github.com/arthurspk/guiadevbrasil#-cursos-de-html-e-css) - Cursos de CSS do repositório geral do Guia Dev Brasil\n\n## ◾ JavaScript\n\n\u003e JavaScript é uma linguagem de programação interpretada estruturada, de script em alto nível com tipagem dinâmica fraca e multiparadigma. Juntamente com HTML e CSS, o JavaScript é uma das três principais tecnologias da World Wide Web.\n\n- [MDN - JavaScript](https://developer.mozilla.org/pt-BR/docs/Web/CSS) - O MDN Web Docs é o website oficial de Mozilla para desenvolvimento de padrões web\n- [Cursos de JavaScript](https://github.com/arthurspk/guiadevbrasil#-cursos-de-javascript) - Cursos de JavaScript do repositório geral do Guia Dev Brasil\n\n## ◾ Frameworks\n\n\u003e Framework é um conjunto de códigos prontos que podem ser usados no desenvolvimento de aplicativos e sites. O objetivo dessa ferramenta é aplicar funcionalidades, comandos e estruturas já prontas para garantir qualidade no desenvolvimento de um projeto, cada linguagem possi diversos frameworks que podem ser utilizado para te ajudar em umafuncionalidade específica, por configuração, durante a programação de uma aplicação.\n\n- [Frameworks para HTML](https://www.webfx.com/blog/web-design/html5-frameworks/) - 10 frameworks responsivos para ser utilizado no HTML5\n- [Frameworks para CSS](https://rockcontent.com/br/talent-blog/frameworks-css/) - 14 frameworks que podem ser utilizados no seu CSS\n- [Frameworks no front-end](https://mundodevops.com/blog/framework-front-end/) - Frameworks mais utilizados no front-end\n- [Frameworks e bibliotecas JavaScript](https://blog.geekhunter.com.br/frameworks-javascript-e-bibliotecas-java/#:~:text=Um%20framework%20JavaScript%20%C3%A9%20uma,ficar%20reescrevendo%20linhas%20de%20c%C3%B3digo.) - Frameworks e bibliotecas para ser utilizadas no JavaScript\n\n## ◾ APIs\n\n\u003e O conceito de API nada mais é do que uma forma de comunicação entre sistemas. Elas permitem a integração entre dois sistemas, em que um deles fornece informações e serviços que podem ser utilizados pelo outro, sem a necessidade de o sistema que consome a API conhecer detalhes de implementação do software, as APIs permitem que o usuário final utilize um aplicativo, software ou até uma simples planilha, consultando, alterando e armazenando dados de diversos sistemas, sem que o usuário precise acessá-los diretamente.\n\n- [MDN - APIs](https://developer.mozilla.org/pt-BR/docs/Web/API) - O MDN Web Docs é o website oficial de Mozilla para desenvolvimento de padrões web\n- [APIs Públicas](https://github.com/public-apis/public-apis) - Uma lista coletiva de APIs gratuitas para uso em software e desenvolvimento web\n\n## 📚 Recomendação de livros\n\n- [Clean Code - Código Limpo](https://g.co/kgs/62wx9t)\n- [Refactoring - Refatoração](https://g.co/kgs/Hf2eY3)\n- [Clean Archtecture - Arquitertura Limpa](https://g.co/kgs/Hf2eY3)\n- [O programador pragmático](https://g.co/kgs/5nbqB3)\n\n## 🛠️ Ferramentas\n\n\u003e ◾ Sites para desenvolvedor front-end\n\n- [Text Pop 3D](https://textpop3d.web.app/) - Cria efeitos de texto 3D\n- [Shape Dividers](https://shapedividers.com) - Gera divisores de formas verticais, responsivos, e animados facilmente com este gerador de divisores de formas SVG\n- [Couleur](https://couleur.io) - Uma ferramenta de cores simples para ajudá-lo a encontrar uma boa paleta de cores para seu projeto da web)\n- [Baseline CSS Filters](https://baseline.is/tools/css-photo-filters/) - 36 Belos filtros de fotos, com edição simples e CSS para copiar)\n- [UI Deck](https://uideck.com) - Modelo de página de destino HTML gratuitos e premium, temas de bootstrap, modelos de React, modelos de Tailwind, modelos de site HTML, e kits de interface de usúario)\n- [Naevner](https://naevner.com) - Descrição de cores em linguagem natural, gerador de códigos em cores hexadecimais)\n\n\u003e ◾ Templates HTML gratuitos\n\n- [Bootstrap Made](https://bootstrapmade.com/) - Temas HTML5 + CSS3 gratuitos\n- [W3 Layouts](https://w3layouts.com) - Temas HTML5 + CSS3 gratuitos\n- [One Page Love](https://onepagelove.com) - Temas HTML5 + CSS3 gratuitos\n- [ThemeWagon Freebies](https://themewagon.com/theme_tag/free/) - Temas HTML5 + CSS3 gratuitos\n\n\u003e ◾ Sites para aprender ou treinar CSS\n\n- [CSS Grid Garden](http://cssgridgarden.com/) - Ferramenta online para estudos de Grid (CSS)\n- [Flukeout](http://flukeout.github.io/) - Aplicação online para aprender CSS de forma prática\n- [Flex Box Froggy](https://flexboxfroggy.com/) - Desafio de Programação Front-end focados na propriedade flex box. IDE integrada.\n- [Flexbox Defense](http://www.flexboxdefense.com/) - Aprenda flexbox com um game\n- [100 Dias de CSS](https://100dayscss.com) - 100 Desafios de CSS\n- [CSS Battle](https://cssbattle.dev/) - Batalhas temporárias de CSS. IDE integrada\n- [CSS Tricks](https://css-tricks.com/guides/) - Site para treinar\n- [CSS Hell](https://csshell.dev/) - Coleção de erros comuns de CSS e como corrigi-los\n\n\u003e ◾ Geradores de CSS\n\n- [Neumorphism](https://neumorphism.io/) - Tendência aplicação border-radius\n- [Fancy Border-Radius](https://9elements.github.io/fancy-border-radius/) - Gerador de formas com border-radius no CSS\n- [WAIT! Animate](https://waitanimate.wstone.io) - Gerador de animações de CSS\n- [Best CSS Button Generator](https://www.bestcssbuttongenerator.com) - Gerador de butões do CSS\n- [HTML CSS JS Generator](https://html-css-js.com/css/generator/) - Gerador de HTML/CSS/JS\n- [BennettFeely](https://bennettfeely.com/clippy/) - Criador de clip-path\n\n\u003e ◾ Ferramentas de desenvolvimento\n\n- [Internxt](https://internxt.com/) - Internxt Drive é um armazenamento de arquivos de conhecimento zero serviço baseado na melhor privacidade e segurança da classe\n- [Motion](https://motion.dev/) - Uma nova biblioteca de animação, construída na API Web Animations para o menor tamanho de arquivo e o desempenho mais rápido.\n- [Hokusai](https://hokusai.app/) - Conteúdo sobre NFT's\n- [Hidden Tools](https://hiddentools.dev) - Ampla coleção de ferramentas feitas pela comunidade disponiveís para uso\n- [Dev Hints](https://devhints.io) - Coleção de cheatsheets\n- [Bundlephobia](https://bundlephobia.com) - Descubra o custo de adicionar um pacote npm ao seu pacote\n- [Refactoring Guru](https://refactoring.guru/pt-br/design-patterns) - Padrões de projetos \"Design patterns\"\n- [DevDocs](https://devdocs.io/) - DevDocs combina várias documentações de API em uma interface rápida, organizada e pesquisável.\n- [HTML Validator](https://www.freeformatter.com/html-validator.html) - Validação de arquivo HTML\n- [HTML 5 Test](https://html5test.com/index.html) - Testa arquivos HTML5\n- [Image Slide Maker](https://imageslidermaker.com/v2) - Ferramenta de geração gratuita do Image Slider Maker\n- [.NET Fiddle](https://dotnetfiddle.net/) - Codifique e compartilhe projetos C# online\n- [1PageRank](http://www.1pagerank.com/) - Rankeie seu site nos mecanismos de buscas e aprenda com a concorrência\n- [Any API](https://any-api.com/) - Diretório gratuito com APIs públicas\n- [Autoprefixer CSS](http://autoprefixer.github.io/) - Transpile código CSS atual para código CSS com maior cobertura de navegadores antigos\n- [Browser diet](https://browserdiet.com/pt/) - Guia de performance para desenvolvimento web\n- [Can I email...](https://www.caniemail.com/) - Descubra o que do HTML e CSS pode ser usado em estruturas de e-mail\n- [Can I use...](https://caniuse.com/) - Descubra se você pode usar determinadas tecnologias web\n- [CloudFlare](https://www.cloudflare.com/pt-br/) - CDN grátis\n- [CMDER](https://cmder.net/) - Linha de comando simples, consegue rodar comands bash e Shell, alternativa ao Hyper\n- [CodePen](https://codepen.io/) - Rede social de desenvolvedores front-end\n- [CodeSandbox](https://codesandbox.io/) - Caixa de área para desenvolvedores web\n- [Connection Strings](https://www.connectionstrings.com/) - Site com strings de conexão para diversas plataformas\n- [CSS Formatter](https://www.cleancss.com/css-beautify/) - Retire a minificação e formate o código CSS\n- [CSS Minifier](https://cssminifier.com/) - Conversor de código CSS para CSS minificado\n- [CSS W3.org](https://jigsaw.w3.org/css-validator/) - Validar CSS\n- [Debuggex: Online visual regex tester. JavaScript, Python, and PCRE](https://www.debuggex.com) - Construa e teste expressões regulares\n- [docsify](https://docsify.js.org/#/) - Crie docs incríveis de projetos\n- [EasyForms](https://easyforms.vercel.app/) - API open source que permite criação formulários de contato com HTML puro\n- [Editor.md](https://pandao.github.io/editor.md/en.html) - Editor Markdown online e open source\n- [ES6console](https://es6console.com/) - Compilador de JS para Ecmascript\n- [Firebase](https://firebase.google.com/?hl=pt-BR) - Desenvolva aplicativos mobile e web incríveis este serviço da Google\n- [Firefox Developer Edition](https://www.mozilla.org/pt-BR/firefox/developer/) - Navegador web para desenvolvedores web\n- [Full Page Screen Capture](https://chrome.google.com/webstore/detail/full-page-screen-capture/fdpohaocaechififmbbbbbknoalclacl?hl=pt-BR) - Capture páginas inteiras com uma extensão para Chrome\n- [generatedata](http://www.generatedata.com/) - Gerador de dados para testes\n- [Git Command Explorer](https://gitexplorer.com/) - Encontre os comandos certos que você precisa sem vasculhar a web\n- [GitHub Gist](https://gist.github.com/) - Faça pequenas anotações e pequenos códigos no GitHub Gist\n- [Google Transparency Report](https://transparencyreport.google.com/safe-browsing/search) - Verificar segurança de um site\n- [Grader](https://website.grader.com/) - Avaliação de site\n- [How to Center in CSS](http://howtocenterincss.com/) - Gerador de código para divs ou textos que necessitam de centralização\n- [Hyper](https://hyper.is/) - Linha de comando simples, útil e gratuito\n- [Joomla](https://www.joomla.org/) - CMS gratuita\n- [JS Bin](https://jsbin.com/) - Codifique e compartilhe projetos HTML, CSS e JS\n- [JSCompress](https://jscompress.com/) - Conversor de código JS para JS minificado\n- [JSON Editor Online](https://jsoneditoronline.org/) - Ferramenta para visualizar e editar arquivos JSON\n- [JSFiddle](https://jsfiddle.net/) - Codifique projetos JS online\n- [JSONLint](https://jsonlint.com/) - Ferramenta para validar seu JSON\n- [JSON Generator](https://app.json-generator.com/) - Ferramenta para gerar JSON com base em template\n- [KeyCDN Tools](https://tools.keycdn.com/) - Faça uma análise das suas aplicações web\n- [Liveweave](https://liveweave.com/) - Codifique projetos HTML, CSS e JS\n- [Lorem Ipsum](https://br.lipsum.com/) - Gerador de texto fictício\n- [Mapbox](https://www.mapbox.com/) - Mapas e localização para desenvolvedores\n- [Memcached](https://memcached.org/) - Melhore o desempenho de seu website com cache\n- [Mockaroo](https://www.mockaroo.com/) - Gerador de dados para testes\n- [Mussum Ipsum](https://mussumipsum.com/) - Gerador de texto fictício\n- [NPM HTTP-Server](https://www.npmjs.com/package/http-server) - Rode um servidor local com um pacote npm\n- [Password Generator](https://danieldeev.github.io/password-generator/) - Um gerador de senhas simples com foco na segurança\n- [Online C Compiler](https://www.onlinegdb.com/online_c_compiler) - Ferramenta para compilar C online\n- [React Dev Tools](https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi) - Ferramenta para debug do ReactJS\n- [React Hook Form](https://react-hook-form.com/) - Valide seus formulários de projetos que utilizam React ou React Native\n- [RelaX](http://dbis-uibk.github.io/relax/index.htm) - Crie expressões algébricas relacionais de consultas\n- [Responsive](http://www.codeorama.com/responsive/) - Teste a responsividade do seu site\n- [Shields.io](https://shields.io/) - Gerador de badges para markdown\n- [SSL Server Test](https://www.ssllabs.com/ssltest/) - Testar SSL de sites\n- [StreamYard](https://streamyard.com/) - O StreamYard é um estúdio de transmissões ao vivo no seu navegador\n- [Swagger](https://swagger.io/) - Ferramenta para projetar, construir, documentar e usar serviços da Web RESTful\n- [Tabela ASCII](https://web.fe.up.pt/~ee96100/projecto/Tabela%20ascii.htm) - Tabela completa com caracteres ASCII\n- [Telegram](https://telegram.org/) - Mensageiro criptografado\n- [TinyJPG](https://tinyjpg.com/) - Comprima imagem do formato JPG\n- [TinyPNG](https://tinypng.com/) - Comprima imagem do formato PNG\n- [Creately](https://creately.com/) - Crie e altere lindos diagramas em tempo real com a sua equipe\n- [Carbon](https://carbon.now.sh/) - Crie Snippets de codigo clean e bonitos\n- [DbDiagram](https://dbdiagram.io/home) - Crie elegrantes diagramas de banco de dados e gere script ddl\n- [SqlDesigner](https://ondras.zarovi.cz/sql/demo/) - Crie Diagramas de banco de dados de maneira rapida e gere script ddl\n- [W3.org](https://validator.w3.org/) - Validar HTML\n- [WakaTime](https://wakatime.com/) - Gerencie seu tempo de desenvolvimento\n- [Web Developer](https://chrome.google.com/webstore/detail/web-developer/bfbameneiokkgbdmiekhjnmfkcnldhhm?hl=pt-BR) - Extensão para Chrome com multi-funções\n- [Web.dev](https://web.dev/) - Testar website (criado pela Google)\n- [WebPageTest](https://www.webpagetest.org/) - Testar perfomance de site\n- [Wedsites](https://wedsites.com/) - Liste suas atividades e acompanhe seu progresso\n- [WordPress](https://wordpress.org/) - Criação de blogs\n- [XML Sitemaps](https://www.xml-sitemaps.com/) - Criador de sitemaps.xml\n- [Minimamente](https://www.minimamente.com/project/magic/) - Efeitos para utilizar no CSS\n- [Hamburgers](https://jonsuh.com/hamburgers/) - Menu de hamburgers para utilizar em CSS\n- [Hover Effects](https://ianlunn.github.io/Hover/) - Hover effects para utilizar no CSS\n\n\u003e ◾ Design front-end\n\n- [Adobe XD](https://www.adobe.com/br/products/xd.html) - Software de design para projetos\n- [Awwwards](https://www.awwwards.com) - Inspiração para interfaces e templates com o que há de mais novo em questão de design de interfaces\n- [Bootstrap](https://www.getbootstrap.com/) - Framework CSS\n- [BuildBootstrap](https://buildbootstrap.com/) - Crie layout responsivo para o framework Bootstrap na versão 3 e 4\n- [Bulma CSS](https://bulma.io/) - Estrutura CSS gratuita baseada no Flexbox\n- [Canva](https://www.canva.com/) - Ferramenta de design online\n- [Chart.js](https://www.chartjs.org/) - Biblioteca JavaScript de criação de gráficos\n- [Colors and Fonts](https://www.colorsandfonts.com/) - Apresenta paletas de cores e tipografia\n- [Coolors](https://coolors.co/) - Palhetas de cores e monte a sua própria\n- [Colors lol](https://colors.lol) - Repositório de paletas de cores\n- [Cruip](https://cruip.com/) - Recursos de templates\n- [CSS Effects Snippets](https://emilkowalski.github.io/css-effects-snippets/) - Animações CSS prontas para usar\n- [CSS Layout](https://csslayout.io/) - Layouts e padrões populares feitos com CSS\n- [CSS Reference](https://cssreference.io/) - Guia visual para CSS com referencias de uso\n- [CSS Tricks](https://css-tricks.com/) - Blog com vários tutoriais frontend\n- [DevSamples](https://www.devsamples.com/) - Exemplos de códigos fáceis de usar para HTML, CSS e JavaScript\n- [Excalidraw](https://excalidraw.com) - Desenhe diagramas como se tivessem sido feitos a mão\n- [Fancy Border-Radius](https://9elements.github.io/fancy-border-radius/) - Gerador de formas com border-radius no CSS\n- [Figma](https://www.figma.com/) - Desenhe projetos online de apps, softwares e websites\n- [Flatui Color Picker](http://www.flatuicolorpicker.com/) - Paleta de cores interativa de forma harmonizar o front\n- [Font Flipper](https://fontflipper.com/) - Ferramenta para testar fontes\n- [FontPair](https://fontpair.co/) - Ferramenta para combinações de fontes\n- [FontSpark](https://fontspark.app/) - Gera fontes aleatórias de uma lista de fontes famosas usadas na web\n- [Foundation](https://foundation.zurb.com/) - Framework responsivo\n- [Framer](https://www.framer.com/) - Ferramenta de criação de interfaces interativas\n- [FreeFrontEnd](https://freefrontend.com/) - Exemplos de códigos, tutoriais e artigos de HTML, CSS, Javascript (Angular, JQuery, React, Vue)\n- [Gravit Designer](https://www.designer.io) - Ferramenta de design online com suporte a ilustração vetorial\n- [Grid Layoutit](https://grid.layoutit.com/) - Gerador de grid para código CSS\n- [HTML DOM](https://htmldom.dev/) - Gerenciar o DOM HTML com JavaScript vanilla\n- [Interfacer](https://interfacer.xyz/) - Recursos para criação de interfaces\n- [Interfaces.pro](https://interfaces.pro/) - Inspiração para interfaces\n- [Invision](https://www.invisionapp.com/) - Software de design para projetos\n- [Lottie](https://lottiefiles.com/) - Animações em after effects via json\n- [Luna](https://github.com/OfficialMarinho/luna) - Framework CSS brasileiro\n- [Material-UI](https://material-ui.com/) - Um framework de interface de usuário para React\n- [Mockup](https://mockup.io/about/) - Visualize e colabore no design de aplicativos para dispositivos móveis\n- [Nes.css](https://nostalgic-css.github.io/NES.css/) - Framework CSS estilo NES\n- [Neumorphism](https://neumorphism.io/) - Tendência aplicação border-radius\n- [Normalize CSS](https://necolas.github.io/normalize.css/) - Normaliza estruturas entre navegadores\n- [Pixilart](https://www.pixilart.com/draw) - Desenhe pixel arts online\n- [Pixlr](https://pixlr.com/br/) - Conjunto de ferramentas e utilitários de edição de imagem baseado em nuvem\n- [PSD-To-CSS-Shadow](http://psd-to-css-shadows.com/) - Gera o script para uma sombra (box-shadow \u0026 text-shadow) no CSS baseado nas configurações de sombra no Photoshop\n- [Pure.css](https://purecss.io/) - Framework CSS responsivo\n- [Remove.bg](https://www.remove.bg/) - Remove fundos de imagens automaticamente\n- [Sketch](https://www.sketch.com/) - Desenvolvimento de layouts em alta qualidade\n- [Squoosh.app](https://squoosh.app/) - Compressor de imagens e comparador, via navegador\n- [SweetAlert2](https://sweetalert2.github.io/) - Biblioteca JavaScript de alertas responsivos e customizáveis\n- [Tailwind CSS](https://tailwindcss.com/) - Framework de estilo CSS\n- [UI Gradients](https://uigradients.com/) - UI gradientes para utilizar\n- [Vectorizer](https://www.vectorizer.io/) - Converta imagens como PNGs, BMPs e JPEGs em gráficos vetoriais ​​(SVG, EPS, DXF)\n- [Whimsical](https://whimsical.com/) - Flowchart, Wireframe, Sticky Notes e Mind Map\n- [X-Icon Editor](http://www.xiconeditor.com/) - Gerador de favicon com alta resolução a partir de imagens\n\n\u003e ◾ Desafios\n\n- [Ace Front End](https://www.acefrontend.com/) - Desafios de programação Front-end. Resultados via texto. IDE integrada\n- [AdventoOfCode](https://adventofcode.com/) - Desafios de programação por temporada. Sem IDE integrada. Validação manual feita pelo usuário\n- [App Ideas](https://github.com/florinpop17/app-ideas) - Compilado de desafios para você testar seus conhecimentos e aumentar seu portfólio\n- [CodePen Challenges](https://codepen.io/challenges) - Desafios de Programação Front-end. IDE integrada\n- [Codier](https://codier.io/challenge) - Desafios de Programação Front-end, análise dos resultados feita pela comunidade. IDE integrada\n- [CSS Battle](https://cssbattle.dev/) - Batalhas temporárias de CSS. IDE integrada\n- [DevChallenge](https://www.devchallenge.com.br/) - Site com desafios de front-end, back-end e mobile\n- [Flex Box Defense](http://www.flexboxdefense.com/) - Desafio de Programação Front-end focados na propriedade flex box. IDE integrada.\n- [Flex Box Froggy](https://flexboxfroggy.com/) - Desafio de Programação Front-end focados na propriedade flex box. IDE integrada.\n- [Front End Challanged Club](https://piccalil.li/category/front-end-challenges-club) - Bogs com desafios de programação front-end\n- [Frontend Challengens](https://github.com/felipefialho/frontend-challenges) - Repositório no GitHub com vários desafios solicitados reais solicitados por empresas\n- [Frontend Mentor](https://www.frontendmentor.io/) - Desafios de Programação Front-end, análise dos resultados feita pela comunidade, sem IDE integrada\n- [Code Well](https://codewell.cc/) - Treine suas habilidade de HTML e CSS com alguns templates\n\n\u003e ◾ Bibliotecas para JavaScript\n\n- [Lax.js](https://github.com/alexfoxy/lax.js)\n- [Swiper](https://swiperjs.com/)\n- [WOW](https://wowjs.uk/)\n- [Animate](https://animate.style/)\n- [ApexCharts](https://apexcharts.com/)\n- [Particles.js](https://vincentgarreau.com/particles.js/)\n- [ScrollMagic](https://scrollmagic.io/)\n\n\u003e ◾ Ferramentas para hospedar seu site\n\n- [Github Pages](https://pages.github.com/) - Hospedado diretamente de seu repositório GitHub. Basta editar, enviar e suas alterações entrarão em vigor\n- [Award Space](https://www.awardspace.com/) - Hospedagem gratuita na web + um subdomínio gratuito, PHP, MySQL, instalador de aplicativo, envio de e-mail e sem anúncios\n- [Byet](https://byet.host/) - Hospedagem Gratuita e Serviços de Hospedagem Premium.\n- [Infinity Free](https://infinityfree.net/) - Free Unlimited Web Hosting\n- [1FreeHosting](http://www.1freehosting.com/) - Hospedagem de sites grátis com 100GB de largura de banda\n- [Amazon Web Services](https://aws.amazon.com/pt/) - Serviço de aluguel de servidores e outros serviços\n- [BlueHost](https://www.bluehost.com/) - Empresa americana de hospedagem de sites\n- [DigitalOcean](https://www.digitalocean.com/) - Aluguel de servidores dedicados e compartilhados\n- [DreamHost](https://www.dreamhost.com/) - Hospedagem de sites de alta disponibilidade\n- [Embratel](https://www.embratel.com.br/cloud/hospedagem-de-sites) - Hospedagem de sites nacional\n- [GoDaddy](https://br.godaddy.com/hosting/web-hosting) - Hospedagem de sites internacional\n- [GoDaddy](https://br.godaddy.com/) - Empresa de aluguel de servidores compartilhados, dedicados e registro de domínio\n- [Google Cloud](https://cloud.google.com/solutions/smb/web-hosting/) - Serviço de aluguel de servidores da Google\n- [Heroku](https://www.heroku.com/) - Hospedagem de sites grátis com suporte à NodeJS, Java, Ruby, PHP, Python, Go, Scala e Clojure\n- [HostGator](https://www.hostgator.com/) - Hospedagem compartilhada e dedicada para sites e serviços\n- [Hostinger](https://www.hostinger.com.br/) - Hospedagem de sites\n- [Hostoo](https://hostoo.io/) - Hospedagem de sites em cloud computing dedicado\n- [iPage](https://www.ipage.com/) - Hospedagem de sites gringa com descontos para anúncios\n- [KingHost](https://king.host/) - Hospedagem compartilhada e dedicada para sites e serviços de marketing por e-mail\n- [Netlify](https://www.netlify.com/) - Hospedagem para sites estáticos que combina implantação global, integração contínua e HTTPS automático\n- [One.com](https://www.one.com/pt-BR/) - Serviços gerais digitais (incluindo hospedagem de sites)\n- [Surge](https://surge.sh/) - Hospedagem gratuita para páginas estáticas\n- [Umbler](https://www.umbler.com/br) - Hospedagem compartilhada, cloud computing sob taxação de uso\n- [Vercel](https://vercel.com/) - Hospedagem grátis de sites estáticos e serveless\n\n\u003e ◾ Sites para inspirar o seu desenvolvimento\n\n- [Product Hunt](https://www.producthunt.com/)\n- [Namify](https://namify.tech/?ref=producthunt)\n- [Dribbble](https://dribbble.com/)\n- [Pinterest](https://br.pinterest.com/)\n- [Deviant Art](https://www.deviantart.com/)\n- [Lapa](https://www.lapa.ninja/)\n- [Hyper Pixel](https://hyperpixel.io/)\n- [One Page Love](https://onepagelove.com/)\n- [One Page Love Avatars](https://onepagelove.com/boring-avatars)\n- [Land Book](https://land-book.com/)\n- [Awwwards](https://www.awwwards.com)\n- [Best Folios](https://www.bestfolios.com/home)\n- [Sitesee](https://sitesee.co/)\n- [Httpster](https://httpster.net/2021/jun/)\n- [Builders Club](https://builders-club.com/)\n- [CSS Nectar](https://cssnectar.com/)\n- [Collect UI](https://collectui.com)\n- [Best Web Site](https://bestwebsite.gallery)\n\n\u003e ◾ Banco de imagens gratuitas\n\n- [500px](https://500px.com/creativecommons) - Banco de imagens gratuitas\n- [Burst](https://pt.shopify.com/burst) - Plataforma de imagens do serviço de ecommerce Shopify\n- [Cupcake](http://cupcake.nilssonlee.se/) - Imagens gratuitas para uso comercial\n- [Banco De Imagens Com Diversidade](https://github.com/JulianaHelena5/BancoDeImagensComDiversidade) - Banco de imagens com pessoas diversas\n- [DrawKIT](https://www.drawkit.io/) - Ilustrações para qualquer um usar\n- [FlatIcon](https://www.flaticon.com) - Banco de ícones vetoriais\n- [Flickr](https://flickr.com/) - Rede social de fotógrafos\n- [FreeImages](https://pt.freeimages.com/) - Banco de imagens gratuitas\n- [FreePik Stories](https://stories.freepik.com/) - Banco de ilustrações gratuitas\n- [Freerange](https://freerangestock.com/index.php) - Banco de imagens gratuitas\n- [Glaze](https://www.glazestock.com) - Banco de ilustrações, sem direitos autorais\n- [Gratisography](https://gratisography.com/) - Banco de imagens gratuitas\n- [Humaaans](https://www.humaaans.com/) - Ilustrações de humanóides\n- [Icons8](https://icons8.com.br/) - Ícones em diversos estilos\n- [Imgur](https://imgur.com/) - Plataforma com milhões de imagens\n- [IraDesign](https://iradesign.io/illustrations) - Ilustrações editáveis de cores e objetos\n- [Life of Pix](https://www.lifeofpix.com/) - Banco de imagens gratuitas\n- [Little Visuals](https://littlevisuals.co/) - Banco de imagens gratuitas\n- [Lorempixel](http://lorempixel.com/) - Banco de imagens para uso como template\n- [Lukas Zadam](https://lukaszadam.com/illustrations) - Ilustrações SVG em diferentes tamanhos e estilos\n- [ManyPixels](https://www.manypixels.co/gallery/) - Galeria de ilustrações com direito a edição de cores\n- [Morguefile](https://morguefile.com/) - Banco de imagens gratuitas\n- [Nappy](https://www.nappy.co) - Banco de imagens gratuitas (atribuição recomendada)\n- [Nos.twnsnd](https://nos.twnsnd.co/) - Arquivo público de fotos antigas\n- [OpenMoji](https://openmoji.org/) - Banco de emojis para uso\n- [Pexels](https://www.pexels.com/) - Banco de imagens gratuitas\n- [PhotoPin](http://photopin.com/) - Banco de imagens gratuitas no estilo criativo\n- [Picjumbo](https://picjumbo.com/) - Banco de imagens gratuitas\n- [Picsum](https://picsum.photos/) - Banco de imagens para uso como template\n- [Pixabay](http://www.pixabay.com) - Banco de imagens gratuitas (não requer atribuição)\n- [Public domain archive](https://www.publicdomainarchive.com/) - Banco de imagens gratuitas\n- [RemixIcon](https://remixicon.com/) - Banco de Ícones para uso gratuito\n- [StockSnap](https://stocksnap.io/) - Banco de imagens gratuitas (não requer atribuição)\n- [unDraw](https://undraw.co/) - Ilustrações livres para usar\n- [Unsplash](https://unsplash.com/) - Banco de imagens gratuitas\n- [Visual Hunt](https://visualhunt.com/) - Banco de imagens gratuitas\n- [Wikimedia Commons](https://commons.wikimedia.org/wiki/Main_Page) - Banco de imagens mundial\n\n\u003e ◾ Sites para baixar e encontrar fontes\n\n- [Adobe Fonts](https://fonts.adobe.com/)\n- [Google fonts](https://fonts.google.com/)\n- [Dafont](https://www.dafont.com/pt/)\n- [NetFontes](https://www.netfontes.com.br/)\n- [Urbanfonts](https://www.urbanfonts.com/pt/)\n- [Befonts](https://befonts.com/)\n- [Fonts space](https://www.fontspace.com/)\n- [1001 fonts](https://www.1001fonts.com/)\n- [Abstract fonts](https://www.abstractfonts.com/)\n- [Fontget](https://www.fontget.com/)\n- [Material Design Icons](https://materialdesignicons.com/)\n\n\u003e ◾ Sites de paletas de cores\n\n- [Paletton](https://paletton.com/)\n- [Adobe Color](https://color.adobe.com/pt/create/color-wheel/)\n- [Color Hunt](https://colorhunt.co/)\n- [Happy Hues](https://www.happyhues.co/)\n- [Coolors](https://coolors.co/)\n- [Gradient Hunt](https://gradienthunt.com/)\n- [Flat UI Colors](https://flatuicolors.com/)\n- [Grabient](https://www.grabient.com/)\n- [Pigment](https://pigment.shapefactory.co/)\n- [WebGradient](https://webgradients.com/)\n- [Color.lol](https://colors.lol/)\n\n◾ Lista de ilustrações\n\n- [DrawKIT](https://www.drawkit.io/)\n- [Humaaans](https://www.humaaans.com/)\n- [Open Doodle](https://www.opendoodles.com/)\n- [Storyset](https://storyset.com/)\n- [unDraw](https://undraw.co/)\n- [404 Illustrations (by kapwing)](https://www.kapwing.com/404-illustrations/)\n- [404 Illustrations](https://error404.fun/)\n- [Ouch](https://icons8.com.br/illustrations/)\n- [Delesing](https://delesign.com/free-designs/graphics/)\n- [Pixeltru](https://www.pixeltrue.com/free-illustrations/)\n- [Iconscout](https://iconscout.com/)\n\n\u003e ◾ Site de icones\n\n- [DrawKIT](https://www.drawkit/free-icons/)\n- [Eva Icons](https://akveo.github.io/eva-icons/#/)\n- [Feather Icons](https://feathericons.com/)\n- [Font Awesome](https://fontawesome.com)\n- [Heroicons](https://heroicons.dev/)\n- [Iconsvg](https://iconsvg.xyz/)\n- [Icons8 Line Awesome](https://icons8.com/line-awesome/)\n- [Icons8](https://icons8.com.br/)\n- [Shape](https://shape.so/)\n- [Flaticon](https://www.flaticon.com/br/)\n- [Bootstrap icons](https://icons.getbootstrap.com/)\n- [devicon](https://devicon.dev/)\n\n\u003e ◾ Extensões para o seu navegador\n\n- [File Icons for GitHub and GitLab](https://chrome.google.com/webstore/detail/file-icons-for-github-and/ficfmibkjjnpogdcfhfokmihanoldbfe)\n- [GoFullPage](https://chrome.google.com/webstore/detail/gofullpage-full-page-scre/fdpohaocaechififmbbbbbknoalclacl)\n- [Web Developer](https://chrome.google.com/webstore/detail/web-developer/bfbameneiokkgbdmiekhjnmfkcnldhhm?hl=pt-BR)\n- [React Developer Tools](https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi)\n- [Window Resizer](https://chrome.google.com/webstore/detail/window-resizer/kkelicaakdanhinjdeammmilcgefonfh?hl=pt-BR)\n- [Vue Devtools](https://chrome.google.com/webstore/detail/vuejs-devtools/nhdogjmejiglipccpnnnanhbledajbpd?hl=pt-BR)\n- [Dark Reader](https://chrome.google.com/webstore/detail/dark-reader/eimadpbcbfnmbkopoojfekhnkhdbieeh?hl=pt-BR)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Farthurspk%2Fguiadofrontend","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Farthurspk%2Fguiadofrontend","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Farthurspk%2Fguiadofrontend/lists"}