ferramentas-gratuitas 🧑‍💻

Melhores ferramentas para ajudar quem é Front-End Developer e não sabe na hora de criar projeto onde buscar recursos gratuitos.

Sites e documentações para Desenvolvedores Front-End. ☕

1. CSS Tricks - CSS Tricks é um site com artigos, tutoriais e dicas sobre CSS, HTML e JavaScript.

2. Smashing Magazine - Smashing Magazine é um site que abrange tópicos como design web, desenvolvimento front-end, UX e UI.

3. CodePen - CodePen é uma comunidade de desenvolvedores que compartilham e colaboram em projetos de front-end.

4. CSS Grid Garden - CSS Grid Garden é um jogo que ensina CSS Grid.

5. CSS-Tricks Almanac - CSS-Tricks Almanac é uma referência rápida para propriedades CSS.

6. Can I Use - Can I Use é uma ferramenta para verificação de compatibilidade do navegador para recursos de HTML, CSS e JavaScript.

7. Frontend Mentor - Desafios do mundo real para desenvolvedores Frontend.

8. A List Apart - A List Apart é um site que cobre tópicos como design responsivo, acessibilidade web e web standards.

9. Web Design Weekly - Web Design Weekly é uma newsletter semanal que traz as últimas notícias, recursos e artigos sobre design e desenvolvimento web.

10. CSS Gradient - CSS Gradient é um gerador de gradientes CSS.

11. W3Schools - W3Schools é um site que oferece tutoriais e referências sobre HTML, CSS, JavaScript e outros tópicos de desenvolvimento web.

12. MDN Web Docs - MDN Web Docs é uma referência abrangente para tópicos de desenvolvimento web, incluindo HTML, CSS e JavaScript.

13. Google Fonts - Google Fonts é uma coleção de fontes gratuitas que podem ser usadas em projetos web.

14. DevDocs - DevDocs é uma plataforma de documentação que reúne documentação de várias tecnologias de desenvolvimento web em um só lugar.

15. FreeCodeCamp - FreeCodeCamp é uma plataforma de aprendizado interativo que oferece cursos gratuitos sobre HTML, CSS, JavaScript e outros tópicos de desenvolvimento web.

16. The Net Ninja - The Net Ninja é um site que oferece cursos em vídeo sobre desenvolvimento web, incluindo HTML, CSS, JavaScript e frameworks como React e Vue.

17. CSS Zen Garden - CSS Zen Garden é um projeto que demonstra o poder do CSS para transformar o mesmo HTML em designs totalmente diferentes.

18. Bootstrap - Bootstrap é um framework de desenvolvimento front-end popular que oferece componentes e estilos prontos para uso.

19. Stack Overflow - Stack Overflow é uma comunidade de desenvolvedores que oferece respostas para perguntas sobre programação, incluindo tópicos de front-end como HTML, CSS e JavaScript.

20. UI Gradients - UI Gradients é um gerador de gradientes com uma biblioteca de gradientes já prontos para usar.

21. The Odin Project - The Odin Project é um currículo gratuito de desenvolvimento web que ensina HTML, CSS, JavaScript e outras tecnologias.

22. Codrops - Codrops é um site que oferece tutoriais, inspiração e recursos para desenvolvedores front-end.

23. The Daily Code - The Daily Code é uma newsletter diária que traz recursos, notícias e tutoriais sobre desenvolvimento web.

24. Codecademy - Codecademy é uma plataforma de aprendizado interativo que oferece cursos gratuitos e pagos sobre HTML, CSS, JavaScript e outras tecnologias.

25. Responsive Web Design Patterns - Responsive Web Design Patterns é um site que mostra exemplos de padrões de design responsivo.

26. Google Developers - Google Developers é uma plataforma que oferece ferramentas, recursos e documentação para desenvolvedores front-end, incluindo tópicos como AMP, PWA e Web Components.

27. CSS Reference - CSS Reference é uma referência abrangente para propriedades CSS, com exemplos e explicações detalhadas.

28. JavaScript30 - JavaScript30 é um desafio de 30 dias que ensina JavaScript puro, sem bibliotecas ou frameworks.

29. Envato Tuts+ - Envato Tuts+ é um site que oferece cursos, tutoriais e recursos sobre design, desenvolvimento e negócios na web.

30. jQuery - jQuery é uma biblioteca JavaScript popular que simplifica o trabalho com HTML, eventos e animações.

31. CSS Specificity Calculator - CSS Specificity Calculator é uma ferramenta que ajuda a entender como a especificidade funciona no CSS.

32. The Odin Project - The Odin Project é um currículo de desenvolvimento web completo que oferece cursos gratuitos em HTML, CSS, JavaScript e outras tecnologias de desenvolvimento web.

33. Flexbox Froggy - Flexbox Froggy é um jogo que ensina Flexbox, uma técnica de layout em CSS.

34. Google Web Fundamentals - Google Web Fundamentals é um guia abrangente para o desenvolvimento web moderno.

35. React - React é uma biblioteca JavaScript popular para a construção de interfaces de usuário.

36. Mozilla Hacks - Mozilla Hacks é um blog que cobre tópicos de desenvolvimento web, incluindo HTML, CSS, JavaScript e tecnologias web modernas.

37. TypeScript - TypeScript é uma linguagem de programação que adiciona recursos de tipagem estática ao JavaScript.

38. CSS Diner - CSS Diner é um jogo que ensina seletores CSS.

39. ESLint - ESLint é uma ferramenta de análise de código estático para identificar problemas em código JavaScript.

40. Vue.js - Vue.js é um framework JavaScript progressivo para construir interfaces de usuário.

41. Codewell - Oferece diversos desafios do mundo real focado em Frontend.

42. Dev Challenges - Outro site que oferece muitos desafios Frontend.

43. Dev Front Challenges - Um site desenvolvido por mim para ajudar quem está iniciando na área de desenvolvimento frontend com desafios do mundo real para você treinar e compartilhar com nossa comunidade.

Sites para buscar inspirações para seus futuros projetos Front-End. 🔥

1. Dribbble - Dribbble é uma plataforma online para designers compartilharem seus trabalhos e projetos. Você pode encontrar muitas inspirações para design de interface de usuário aqui.

2. Awwwards - Awwwards é uma plataforma de premiação para design de sites. Você pode encontrar muitas inspirações para design de sites aqui.

3. Behance - Behance é uma plataforma online para designers compartilharem seus trabalhos e projetos. Você pode encontrar muitas inspirações para design de interface de usuário e design gráfico aqui.

4. CodePen - CodePen é uma plataforma de compartilhamento de código, onde você pode encontrar muitos exemplos de código interessantes e criativos. Você pode usar isso para encontrar inspirações para projetos de front-end.

5. Pinterest - Pinterest é uma rede social onde os usuários podem salvar e compartilhar imagens e ideias em seus "boards". Você pode procurar por ideias de design de interface de usuário ou de sites aqui.

6. Site Inspire - Site Inspire é um diretório de sites que apresentam design excepcional. Você pode procurar por inspirações em design de sites aqui.

7. The Best Designs - The Best Designs é um diretório de sites com design excepcional e inspirador. Você pode encontrar muitas ideias para projetos de front-end aqui.

8. Webdesign Inspiration - Webdesign Inspiration é um diretório de sites com design inspirador. Você pode procurar por inspirações em design de sites aqui.

9. Collect UI - Collect UI é uma plataforma que apresenta desafios de design diários para designers. Você pode usar isso para praticar suas habilidades de design e obter inspiração para projetos de front-end.

10. UI Movement - UI Movement é um diretório de animações e transições de interface de usuário. Você pode procurar por inspirações em animações e transições aqui.

Ferramentas para usar em seus projetos. ✌️

1. Scroll Reveal - O Scroll Reveal é uma ferramenta que ajuda a implementar animações no seu projeto Frontend de maneira fácil.

2. Cursor Library - Te ajuda a construir estilos diferentes e inovadores para o cursor padrão do mouse.

3. UIverse - É um sistema de compartilhamento de componentes feito com HTML, CSS e JS para usar em seus projetos.

4. Lordicon - Icones animados para seus projetos Frontend.

5. Font Awesome - Uma lib que oferece diversos icones visuais para usar em seus projetos, oferece o plano gratuito e o pago também.

Licença

Este projeto está licenciado sob a MIT - veja o arquivo LICENSE para obter detalhes.