JS Dev Course - Cursor Rules
@emersonbraun/js-dev-course
•
Course designed to teach javascript through projects, starting from scratch and advancing, taught by *EmersonBraun*
prpm install @emersonbraun/js-dev-course%0A%20%20%20%20%E2%94%9C%E2%94%80%E2%94%80%20class.gif%0A%20%20%20%20%E2%94%9C%E2%94%80%E2%94%80%20challenge-1.gif%0A%20%20%20%20%E2%94%94%E2%94%80%E2%94%80%20challenge-2.gif%0A%60%60%60%0A%0A%23%23%20Padr%C3%B5es%20de%20C%C3%B3digo%0A%0A%23%23%23%20HTML%0A-%20Use%20%60%3C!DOCTYPE%20html%3E%60%20e%20estrutura%20HTML5%20sem%C3%A2ntica%0A-%20Inclua%20meta%20tags%20para%20charset%2C%20viewport%20e%20compatibilidade%0A-%20Use%20fonte%20Roboto%20do%20Google%20Fonts%3A%20%60%3Clink%20href%3D%22https%3A%2F%2Ffonts.googleapis.com%2Fcss%3Ffamily%3DRoboto%22%20rel%3D%22stylesheet%22%3E%60%0A-%20Estrutura%20b%C3%A1sica%3A%0A%20%20%60%60%60html%0A%20%20%3C!DOCTYPE%20html%3E%0A%20%20%3Chtml%20lang%3D%22en%22%3E%0A%20%20%3Chead%3E%0A%20%20%20%20%20%20%3Cmeta%20charset%3D%22UTF-8%22%3E%0A%20%20%20%20%20%20%3Cmeta%20http-equiv%3D%22X-UA-Compatible%22%20content%3D%22IE%3Dedge%22%3E%0A%20%20%20%20%20%20%3Cmeta%20name%3D%22viewport%22%20content%3D%22width%3Ddevice-width%2C%20initial-scale%3D1.0%22%3E%0A%20%20%20%20%20%20%3Ctitle%3EProject%20Name%3C%2Ftitle%3E%0A%20%20%20%20%20%20%3Clink%20href%3D%22https%3A%2F%2Ffonts.googleapis.com%2Fcss%3Ffamily%3DRoboto%22%20rel%3D%22stylesheet%22%3E%0A%20%20%20%20%20%20%3Clink%20rel%3D%22stylesheet%22%20type%3D%22text%2Fcss%22%20href%3D%22style.css%22%20%2F%3E%0A%20%20%3C%2Fhead%3E%0A%20%20%3Cbody%3E%0A%20%20%20%20%20%20%3C!--%20Conte%C3%BAdo%20--%3E%0A%20%20%20%20%20%20%3Cscript%20src%3D%22index.js%22%3E%3C%2Fscript%3E%0A%20%20%3C%2Fbody%3E%0A%20%20%3C%2Fhtml%3E%0A%20%20%60%60%60%0A%0A%23%23%23%20CSS%0A-%20Use%20reset%20CSS%20b%C3%A1sico%20com%20%60box-sizing%3A%20border-box%60%0A-%20Implemente%20gradientes%20modernos%20como%20background%0A-%20Use%20sistema%20de%20cores%20consistente%3A%0A%20%20-%20Background%3A%20gradiente%20%60%230f2027%60%20%E2%86%92%20%60%232c5364%60%20%E2%86%92%20%60%23203a43%60%0A%20%20-%20Bot%C3%B5es%3A%20%60%232e647a%60%20com%20hover%20effects%0A%20%20-%20Texto%3A%20branco%20(%60%23fff%60)%0A-%20Estrutura%20de%20classes%3A%0A%20%20-%20%60.row%60%20para%20containers%0A%20%20-%20%60.input%60%20para%20campos%20de%20entrada%0A%20%20-%20%60.btn%60%20para%20bot%C3%B5es%0A%20%20-%20%60.btn-group%60%20para%20grupos%20de%20bot%C3%B5es%0A-%20Use%20unidades%20rem%20para%20responsividade%0A-%20Implemente%20transi%C3%A7%C3%B5es%20suaves%20(%60transition%3A%20all%200.3s%60)%0A%0A%23%23%23%20JavaScript%0A-%20Use%20ES6%2B%20features%20quando%20apropriado%0A-%20Implemente%20event%20listeners%20para%20interatividade%0A-%20Use%20%60document.getElementById()%60%20e%20%60document.querySelector()%60%20para%20manipula%C3%A7%C3%A3o%20do%20DOM%0A-%20Mantenha%20fun%C3%A7%C3%B5es%20simples%20e%20focadas%0A-%20Use%20template%20literals%20para%20strings%20din%C3%A2micas%0A-%20Implemente%20valida%C3%A7%C3%A3o%20de%20entrada%20quando%20necess%C3%A1rio%0A%0A%23%23%20Padr%C3%B5es%20de%20Documenta%C3%A7%C3%A3o%0A%0A%23%23%23%20README.md%20(Ingl%C3%AAs)%0A-%20T%C3%ADtulo%20do%20projeto%0A-%20Link%20para%20vers%C3%A3o%20em%20portugu%C3%AAs%0A-%20Se%C3%A7%C3%A3o%20%22CLASS%22%20com%20instru%C3%A7%C3%B5es%20b%C3%A1sicas%0A-%20Se%C3%A7%C3%A3o%20%22CHALLENGE%2001%22%20com%20requisitos%20espec%C3%ADficos%0A-%20Se%C3%A7%C3%A3o%20%22CHALLENGE%2002%22%20com%20requisitos%20avan%C3%A7ados%0A-%20GIFs%20demonstrativos%20para%20cada%20vers%C3%A3o%0A-%20Links%20de%20navega%C3%A7%C3%A3o%20entre%20desafios%0A%0A%23%23%23%20README-PTBR.md%20(Portugu%C3%AAs)%0A-%20Tradu%C3%A7%C3%A3o%20completa%20do%20README.md%0A-%20Manter%20mesma%20estrutura%20e%20formata%C3%A7%C3%A3o%0A-%20Adaptar%20linguagem%20t%C3%A9cnica%20para%20portugu%C3%AAs%20quando%20necess%C3%A1rio%0A%0A%23%23%20Conven%C3%A7%C3%B5es%20de%20Nomenclatura%0A%0A-%20**Arquivos**%3A%20lowercase%20com%20h%C3%ADfens%20(ex%3A%20%60switch-light%60%2C%20%60tic-tac-toe%60)%0A-%20**IDs**%3A%20camelCase%20(ex%3A%20%60calculateBtn%60%2C%20%60resultDisplay%60)%0A-%20**Classes**%3A%20kebab-case%20(ex%3A%20%60btn-group%60%2C%20%60input-field%60)%0A-%20**Fun%C3%A7%C3%B5es**%3A%20camelCase%20(ex%3A%20%60calculateBMI%60%2C%20%60clearInputs%60)%0A%0A%23%23%20Funcionalidades%20Comuns%0A%0A%23%23%23%20Bot%C3%B5es%0A-%20Sempre%20implemente%20bot%C3%B5es%20%22Calculate%22%20e%20%22Clear%22%0A-%20Use%20%60.btn-group%60%20para%20agrupar%20bot%C3%B5es%20relacionados%0A-%20Implemente%20hover%20effects%20consistentes%0A%0A%23%23%23%20Inputs%0A-%20Use%20%60type%3D%22number%22%60%20para%20valores%20num%C3%A9ricos%0A-%20Defina%20%60min%60%20e%20%60max%60%20apropriados%0A-%20Use%20placeholders%20descritivos%0A-%20Implemente%20valida%C3%A7%C3%A3o%20de%20entrada%0A%0A%23%23%23%20Output%0A-%20Use%20elementos%20sem%C3%A2nticos%20para%20exibir%20resultados%0A-%20Implemente%20formata%C3%A7%C3%A3o%20adequada%20(decimais%2C%20unidades)%0A-%20Considere%20cores%20para%20diferentes%20estados%20(sucesso%2C%20erro%2C%20etc.)%0A%0A%23%23%20Progression%20Pattern%0A%0A1.%20**CLASS**%3A%20Implementa%C3%A7%C3%A3o%20b%C3%A1sica%20funcional%0A2.%20**CHALLENGE%2001**%3A%20Adicionar%20l%C3%B3gica%20de%20neg%C3%B3cio%20e%20categoriza%C3%A7%C3%A3o%0A3.%20**CHALLENGE%2002**%3A%20Melhorar%20UX%20com%20cores%2C%20informa%C3%A7%C3%B5es%20adicionais%20e%20feedback%20visual%0A%0A%23%23%20Boas%20Pr%C3%A1ticas%0A%0A-%20Mantenha%20c%C3%B3digo%20limpo%20e%20bem%20comentado%0A-%20Use%20nomes%20descritivos%20para%20vari%C3%A1veis%20e%20fun%C3%A7%C3%B5es%0A-%20Implemente%20tratamento%20de%20erros%20b%C3%A1sico%0A-%20Teste%20funcionalidades%20em%20diferentes%20navegadores%0A-%20Mantenha%20responsividade%20para%20diferentes%20tamanhos%20de%20tela%0A-%20Use%20acessibilidade%20b%C3%A1sica%20(labels%2C%20alt%20text%2C%20etc.)%0A%0A%23%23%20Exemplo%20de%20Implementa%C3%A7%C3%A3o%0A%0ASiga%20sempre%20o%20padr%C3%A3o%20estabelecido%20no%20projeto%20BMI%3A%0A-%20Estrutura%20HTML%20consistente%0A-%20CSS%20com%20gradientes%20e%20design%20moderno%0A-%20JavaScript%20funcional%20e%20bem%20estruturado%0A-%20Documenta%C3%A7%C3%A3o%20clara%20e%20completa%0A-%20Progress%C3%A3o%20l%C3%B3gica%20dos%20desafios%20){kind=link}
%0A%20%20%20%20%E2%94%9C%E2%94%80%E2%94%80%20class.gif%0A%20%20%20%20%E2%94%9C%E2%94%80%E2%94%80%20challenge-1.gif%0A%20%20%20%20%E2%94%94%E2%94%80%E2%94%80%20challenge-2.gif%0A%60%60%60%0A%0A%23%23%20Padr%C3%B5es%20de%20C%C3%B3digo%0A%0A%23%23%23%20HTML%0A-%20Use%20%60%3C!DOCTYPE%20html%3E%60%20e%20estrutura%20HTML5%20sem%C3%A2ntica%0A-%20Inclua%20meta%20tags%20para%20charset%2C%20viewport%20e%20compatibilidade%0A-%20Use%20fonte%20Roboto%20do%20Google%20Fonts%3A%20%60%3Clink%20href%3D%22https%3A%2F%2Ffonts.googleapis.com%2Fcss%3Ffamily%3DRoboto%22%20rel%3D%22stylesheet%22%3E%60%0A-%20Estrutura%20b%C3%A1sica%3A%0A%20%20%60%60%60html%0A%20%20%3C!DOCTYPE%20html%3E%0A%20%20%3Chtml%20lang%3D%22en%22%3E%0A%20%20%3Chead%3E%0A%20%20%20%20%20%20%3Cmeta%20charset%3D%22UTF-8%22%3E%0A%20%20%20%20%20%20%3Cmeta%20http-equiv%3D%22X-UA-Compatible%22%20content%3D%22IE%3Dedge%22%3E%0A%20%20%20%20%20%20%3Cmeta%20name%3D%22viewport%22%20content%3D%22width%3Ddevice-width%2C%20initial-scale%3D1.0%22%3E%0A%20%20%20%20%20%20%3Ctitle%3EProject%20Name%3C%2Ftitle%3E%0A%20%20%20%20%20%20%3Clink%20href%3D%22https%3A%2F%2Ffonts.googleapis.com%2Fcss%3Ffamily%3DRoboto%22%20rel%3D%22stylesheet%22%3E%0A%20%20%20%20%20%20%3Clink%20rel%3D%22stylesheet%22%20type%3D%22text%2Fcss%22%20href%3D%22style.css%22%20%2F%3E%0A%20%20%3C%2Fhead%3E%0A%20%20%3Cbody%3E%0A%20%20%20%20%20%20%3C!--%20Conte%C3%BAdo%20--%3E%0A%20%20%20%20%20%20%3Cscript%20src%3D%22index.js%22%3E%3C%2Fscript%3E%0A%20%20%3C%2Fbody%3E%0A%20%20%3C%2Fhtml%3E%0A%20%20%60%60%60%0A%0A%23%23%23%20CSS%0A-%20Use%20reset%20CSS%20b%C3%A1sico%20com%20%60box-sizing%3A%20border-box%60%0A-%20Implemente%20gradientes%20modernos%20como%20background%0A-%20Use%20sistema%20de%20cores%20consistente%3A%0A%20%20-%20Background%3A%20gradiente%20%60%230f2027%60%20%E2%86%92%20%60%232c5364%60%20%E2%86%92%20%60%23203a43%60%0A%20%20-%20Bot%C3%B5es%3A%20%60%232e647a%60%20com%20hover%20effects%0A%20%20-%20Texto%3A%20branco%20(%60%23fff%60)%0A-%20Estrutura%20de%20classes%3A%0A%20%20-%20%60.row%60%20para%20containers%0A%20%20-%20%60.input%60%20para%20campos%20de%20entrada%0A%20%20-%20%60.btn%60%20para%20bot%C3%B5es%0A%20%20-%20%60.btn-group%60%20para%20grupos%20de%20bot%C3%B5es%0A-%20Use%20unidades%20rem%20para%20responsividade%0A-%20Implemente%20transi%C3%A7%C3%B5es%20suaves%20(%60transition%3A%20all%200.3s%60)%0A%0A%23%23%23%20JavaScript%0A-%20Use%20ES6%2B%20features%20quando%20apropriado%0A-%20Implemente%20event%20listeners%20para%20interatividade%0A-%20Use%20%60document.getElementById()%60%20e%20%60document.querySelector()%60%20para%20manipula%C3%A7%C3%A3o%20do%20DOM%0A-%20Mantenha%20fun%C3%A7%C3%B5es%20simples%20e%20focadas%0A-%20Use%20template%20literals%20para%20strings%20din%C3%A2micas%0A-%20Implemente%20valida%C3%A7%C3%A3o%20de%20entrada%20quando%20necess%C3%A1rio%0A%0A%23%23%20Padr%C3%B5es%20de%20Documenta%C3%A7%C3%A3o%0A%0A%23%23%23%20README.md%20(Ingl%C3%AAs)%0A-%20T%C3%ADtulo%20do%20projeto%0A-%20Link%20para%20vers%C3%A3o%20em%20portugu%C3%AAs%0A-%20Se%C3%A7%C3%A3o%20%22CLASS%22%20com%20instru%C3%A7%C3%B5es%20b%C3%A1sicas%0A-%20Se%C3%A7%C3%A3o%20%22CHALLENGE%2001%22%20com%20requisitos%20espec%C3%ADficos%0A-%20Se%C3%A7%C3%A3o%20%22CHALLENGE%2002%22%20com%20requisitos%20avan%C3%A7ados%0A-%20GIFs%20demonstrativos%20para%20cada%20vers%C3%A3o%0A-%20Links%20de%20navega%C3%A7%C3%A3o%20entre%20desafios%0A%0A%23%23%23%20README-PTBR.md%20(Portugu%C3%AAs)%0A-%20Tradu%C3%A7%C3%A3o%20completa%20do%20README.md%0A-%20Manter%20mesma%20estrutura%20e%20formata%C3%A7%C3%A3o%0A-%20Adaptar%20linguagem%20t%C3%A9cnica%20para%20portugu%C3%AAs%20quando%20necess%C3%A1rio%0A%0A%23%23%20Conven%C3%A7%C3%B5es%20de%20Nomenclatura%0A%0A-%20**Arquivos**%3A%20lowercase%20com%20h%C3%ADfens%20(ex%3A%20%60switch-light%60%2C%20%60tic-tac-toe%60)%0A-%20**IDs**%3A%20camelCase%20(ex%3A%20%60calculateBtn%60%2C%20%60resultDisplay%60)%0A-%20**Classes**%3A%20kebab-case%20(ex%3A%20%60btn-group%60%2C%20%60input-field%60)%0A-%20**Fun%C3%A7%C3%B5es**%3A%20camelCase%20(ex%3A%20%60calculateBMI%60%2C%20%60clearInputs%60)%0A%0A%23%23%20Funcionalidades%20Comuns%0A%0A%23%23%23%20Bot%C3%B5es%0A-%20Sempre%20implemente%20bot%C3%B5es%20%22Calculate%22%20e%20%22Clear%22%0A-%20Use%20%60.btn-group%60%20para%20agrupar%20bot%C3%B5es%20relacionados%0A-%20Implemente%20hover%20effects%20consistentes%0A%0A%23%23%23%20Inputs%0A-%20Use%20%60type%3D%22number%22%60%20para%20valores%20num%C3%A9ricos%0A-%20Defina%20%60min%60%20e%20%60max%60%20apropriados%0A-%20Use%20placeholders%20descritivos%0A-%20Implemente%20valida%C3%A7%C3%A3o%20de%20entrada%0A%0A%23%23%23%20Output%0A-%20Use%20elementos%20sem%C3%A2nticos%20para%20exibir%20resultados%0A-%20Implemente%20formata%C3%A7%C3%A3o%20adequada%20(decimais%2C%20unidades)%0A-%20Considere%20cores%20para%20diferentes%20estados%20(sucesso%2C%20erro%2C%20etc.)%0A%0A%23%23%20Progression%20Pattern%0A%0A1.%20**CLASS**%3A%20Implementa%C3%A7%C3%A3o%20b%C3%A1sica%20funcional%0A2.%20**CHALLENGE%2001**%3A%20Adicionar%20l%C3%B3gica%20de%20neg%C3%B3cio%20e%20categoriza%C3%A7%C3%A3o%0A3.%20**CHALLENGE%2002**%3A%20Melhorar%20UX%20com%20cores%2C%20informa%C3%A7%C3%B5es%20adicionais%20e%20feedback%20visual%0A%0A%23%23%20Boas%20Pr%C3%A1ticas%0A%0A-%20Mantenha%20c%C3%B3digo%20limpo%20e%20bem%20comentado%0A-%20Use%20nomes%20descritivos%20para%20vari%C3%A1veis%20e%20fun%C3%A7%C3%B5es%0A-%20Implemente%20tratamento%20de%20erros%20b%C3%A1sico%0A-%20Teste%20funcionalidades%20em%20diferentes%20navegadores%0A-%20Mantenha%20responsividade%20para%20diferentes%20tamanhos%20de%20tela%0A-%20Use%20acessibilidade%20b%C3%A1sica%20(labels%2C%20alt%20text%2C%20etc.)%0A%0A%23%23%20Exemplo%20de%20Implementa%C3%A7%C3%A3o%0A%0ASiga%20sempre%20o%20padr%C3%A3o%20estabelecido%20no%20projeto%20BMI%3A%0A-%20Estrutura%20HTML%20consistente%0A-%20CSS%20com%20gradientes%20e%20design%20moderno%0A-%20JavaScript%20funcional%20e%20bem%20estruturado%0A-%20Documenta%C3%A7%C3%A3o%20clara%20e%20completa%0A-%20Progress%C3%A3o%20l%C3%B3gica%20dos%20desafios%20){kind=link}
0 total downloads
💡 Suggested Test Inputs
Loading suggested inputs...
🎯 Community Test Results
Loading results...
📦 Package Info
- Format
- cursor
- Type
- rule
- Category
- web-development
- License
- MIT