This is a VSCode extension with Reactjs snippets for Components, Forms, Hooks and Redux using the Redux Toolkit (for now)
For now simple making it easier to create reactjs applications if you forget stuff easily :$
- Type 'react.' to see available snippets inside a .js file
There are two ways of triggering the snippet, one is very verbose, sorry for that, but it was created for me or someone like me :( that might forget some stuff, and some are shorter for those with big memories (obviously not me)
| Description | Short Alias | Verbose in case you forget |
|---|---|---|
| Text Area - Form - React | rffta | react.form.field.textarea |
| Textfield - Form - React | rfftf | react.form.field.textfield |
| Number Field - Form - React | rffn | react.form.field.number |
| Checkbox - Form - React | rffc | react.form.field.checkbox |
| Button - Form - React | rffb | react.form.field.button |
| Submit Button - Form - React | rffs | react.form.field.submit |
| Label - Form - React | rffl | react.form.field.label |
| Description | Short Alias | Verbose in case you forget |
|---|---|---|
| Handle Simple change - Hooks - React | rhohsc | react.hooks.handleSimpleChange |
| Handle change - Hooks - React | rhohc | react.hooks.handlechange |
| Create State - Hooks - React | rhosc | react.hooks.state.create |
| Description | Short Alias | Verbose in case you forget |
|---|---|---|
| Simple Functional Component - React | rcfs | react.component.funcional.simple |
| Stateful Functional Component - React | rcfst | react.component.funcional.state |
| Iterate Array - HTML - React | rhm | react.html.map |
| Div - HTML - React | rhd | react.html.div |
| Description | Short Alias | Verbose in case you forget |
|---|---|---|
| Import configureStore - Redux - React | rrsci | react.redux.store.configure.import |
| Import Provider - Redux - React | rrspi | react.redux.store.provider.import |
| Define Store - Redux - React | rrsd | react.redux.store.define |
| Provider HTML element - Redux - React | rrspe | react.redux.store.provider.element |
| Simple Reducer Example - Redux - React | rrrsse | react.redux.reducer.simple.example |
| Import Selector - Redux - React | rrsi | react.redux.selector.import |
| Create Selector - Redux - React | rrsc | react.redux.selector.create |
| Map Dispatch Actions - Redux - React | rrdm | react.redux.dispatch.map |
| Use Selector - Redux - React | rrsu | react.redux.selector.use |
| Connect - Redux - React | rrc | react.redux.connect |
| Combine Reducers - Redux - React | rrrc | react.redux.reducer.combine |
NONE for now :D
Added the existing list of snippets to the README.md file
Simple Components, Forms, Hooks and Redux snippets