Este projeto visa a disponibilização de um conjunto de Snippets ou atalhos para criação de componentes e arquivos de configuração em aplicações ReactJS.
Para instalar uma extensão você pode executar o Command Pallete através do comando Ctrl + Shift + P ou Cmd + Shift + P , digitar Install Extensions e por fim dar um Enter, feito isso pesquise por Guru Javascript e você vai encontrar a extensão Guru Javascript Snippets.
- JavaScript (.js)
- TypeScript (.ts)
- JavaScript React (.jsx)
- TypeScript React (.tsx)
- Jest (.tsx, .ts, .js, .jsx)
Abaixo segue a lista com todos os Snippets disponíveis e os gatilhos para cada um. O ⇥ significa a tecla TAB.
| Gatilho | Conteúdo |
|---|---|
ts-rfc → |
Create ReactJS Functional Component Typescript |
ts-rfce → |
Create ReactJS Functional Component Typescript Export Default |
ts-rmc → |
Creates a React Memo Function Component with ES7 module system and TypeScript interface |
ts-rmce → |
Creates a React Memo Function Component with ES7 module system and TypeScript interface |
ts-expint → |
Create a Interface with export |
ts-exptp → |
Create a Type with export |
| Gatilho | Conteúdo |
|---|---|
rc-anonfn → |
Creates an anonymous function in ES7 syntax |
rc-cmbb → |
Create a bigger block of comment |
rc-context → |
Create React context |
rc-destruct → |
Creates and assigns a local variable using object destructing |
exp-as → |
Export as alias |
exp-def → |
Export default |
exp-def-anonfn → |
Export default function in ES7 syntax |
exp-namfn → |
Export named function in ES7 syntax |
for-in → |
Iterating over property values of iterable objects |
for-of → |
Iterating over property names of iterable objects |
for-each → |
Creates a forEach statement in ES7 syntax |
fwd-ref → |
Forward ref statement used inside component |
imp-rco → |
Import react as object |
imp-rc → |
Create syntax for import react |
imp → |
Create syntax for import |
rc-hoc → |
Create high order component |
rc-hoc-redux → |
Create high order component with redux |
imp-prop-tp → |
Create syntax for import prop-types |
imp-brw-router → |
Create syntax for import BrowserRouter |
ts-exptp → |
Create a Type with export |
ts-exptp → |
Create a Type with export |
ts-exptp → |
Create a Type with export |
| Gatilho | Conteúdo |
|---|---|
styled-react → |
Create ReactJS Styled Components file |
styled-comp → |
Create styled component |
exp-styled-comp → |
Create export styled component |
exp-def-sc → |
Create export default styled component |
| Gatilho | Conteúdo |
|---|---|
clg-ass → |
If the specified expression is false, the message is written to the console along with a stack trace module system and TypeScript interface |
clg-cl → |
Clears the console |
clg-co → |
Writes the the number of times that count() has been invoked at the same line and with the same label |
clg-dir → |
Prints a JavaScript representation of the specified object |
clg-err → |
Displays a message in the console and also includes a stack trace from where the method was called |
clg-group → |
Groups and indents all following output by an additional level, until console.groupEnd() is called. |
clg-ge → |
Closes out the corresponding console.group(). |
clg-info → |
Displays a message in the console but also displays a blue information icon along with the logged message |
clg-warn → |
Displays a message in the console but also displays a yellow warning icon along with the logged message |
clg → |
Displays a message in the console |
clg-block → |
Create a console log block |
clg-obj → |
Logs property with name |
Contribuições são o que fazem a comunidade open source um lugar incrível para aprender, inspirar e criar. Qualquer contribuição que você fizer será muito apreciada.
- Faça um Fork do projeto
- Crie uma Branch para sua Feature (
git checkout -b feature/FeatureIncrivel) - Adicione suas mudanças (
git add .) - Comite suas mudanças (
git commit -m 'Adicionando uma Feature incrível!) - Faça o Push da Branch (
git push origin feature/FeatureIncrivel) - Abra uma Pull Request
Distribuído sob a licença MIT. Veja LICENSE para mais informações.
Matheus Benites - Github