Changed ES7 React/Redux/GraphQL/React-Native snippets under productivity
This commit is contained in:
Muljayan
parent
f47e0fa72e
commit
fdf5a0b08a
71
README.md
71
README.md
|
|
@ -46,6 +46,7 @@ A curated list of delightful [Visual Studio Code](https://code.visualstudio.com/
|
|||
- [Copy Relative Path](#copy-relative-path)
|
||||
- [Create tests](#create-tests)
|
||||
- [Deploy](#deploy)
|
||||
- [ES7 React/Redux/GraphQL/React-Native snippets](#ES7 React/Redux/GraphQL/React-Native snippets)
|
||||
- [Gi](#gi)
|
||||
- [Git History](#git-history)
|
||||
- [Git Project Manager](#git-project-manager)
|
||||
|
|
@ -268,8 +269,6 @@ See the difference between these two [here](https://github.com/michaelgmcd/vscod
|
|||
- [XO](https://marketplace.visualstudio.com/items?itemName=samverschueren.linter-xo) - Linter for [XO](https://github.com/xojs/xo).
|
||||
- [AVA](https://marketplace.visualstudio.com/items?itemName=samverschueren.ava) - Snippets for [AVA](https://github.com/avajs/ava).
|
||||
- [Prettier](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode) - Linter, Formatter and Pretty printer for [Prettier](https://github.com/prettier/prettier-vscode).
|
||||
- [ES7 React/Redux/GraphQL/React-Native snippets](https://marketplace.visualstudio.com/items?itemName=dsznajder.es7-react-js-snippets) - This extension provides you Javascript and React/Redux snippets in ES7 with babel plugins features
|
||||
|
||||
|
||||
### [Debugger for Chrome](https://marketplace.visualstudio.com/items?itemName=msjsdiag.debugger-for-chrome)
|
||||
|
||||
|
|
@ -382,6 +381,74 @@ To enable Emmet support in .twig files, you'll need to have the following in you
|
|||
|
||||
|
||||
|
||||
## [ES7 React/Redux/GraphQL/React-Native snippets](https://marketplace.visualstudio.com/items?itemName=dsznajder.es7-react-js-snippets)
|
||||
|
||||
> Provides Javascript and React/Redux snippets in ES7 with babel plugins features
|
||||
|
||||
> Basic Methods
|
||||
|
||||
| Prefix | Method |
|
||||
| ------: | --------------------------------------------------- |
|
||||
| `imp→` | `import moduleName from 'module'` |
|
||||
| `imn→` | `import 'module'` |
|
||||
| `imd→` | `import { destructuredModule } from 'module'` |
|
||||
| `ime→` | `import * as alias from 'module'` |
|
||||
| `ima→` | `import { originalName as aliasName} from 'module'` |
|
||||
| `exp→` | `export default moduleName` |
|
||||
| `exd→` | `export { destructuredModule } from 'module'` |
|
||||
| `exa→` | `export { originalName as aliasName} from 'module'` |
|
||||
| `enf→` | `export const functionName = (params) => { }` |
|
||||
| `edf→` | `export default (params) => { }` |
|
||||
| `met→` | `methodName = (params) => { }` |
|
||||
| `fre→` | `arrayName.forEach(element => { }` |
|
||||
| `fof→` | `for(let itemName of objectName { }` |
|
||||
| `fin→` | `for(let itemName in objectName { }` |
|
||||
| `anfn→` | `(params) => { }` |
|
||||
| `nfn→` | `const functionName = (params) => { }` |
|
||||
| `dob→` | `const {propName} = objectToDescruct` |
|
||||
| `dar→` | `const [propName] = arrayToDescruct` |
|
||||
| `sti→` | `setInterval(() => { }, intervalTime` |
|
||||
| `sto→` | `setTimeout(() => { }, delayTime` |
|
||||
| `prom→` | `return new Promise((resolve, reject) => { }` |
|
||||
| `cmmb→` | `comment block` |
|
||||
| `cp→` | `const { } = this.props` |
|
||||
| `cs→` | `const { } = this.state` |
|
||||
|
||||
> React
|
||||
|
||||
| Prefix | Method |
|
||||
| ----------: | ----------------------------------------------------------------------------------- |
|
||||
| `imr→` | `import React from 'react'` |
|
||||
| `imrd→` | `import ReactDOM from 'react-dom'` |
|
||||
| `imrc→` | `import React, { Component } from 'react'` |
|
||||
| `imrcp→` | `import React, { Component } from 'react' & import PropTypes from 'prop-types'` |
|
||||
| `imrpc→` | `import React, { PureComponent } from 'react'` |
|
||||
| `imrpcp→` | `import React, { PureComponent } from 'react' & import PropTypes from 'prop-types'` |
|
||||
| `impt→` | `import PropTypes from 'prop-types'` |
|
||||
| `redux→` | `import { connect } from 'react-redux'` |
|
||||
| `rconst→` | `constructor(props) with this.state` |
|
||||
| `rconc→` | `constructor(props, context) with this.state` |
|
||||
| `est→` | `this.state = { }` |
|
||||
| `cwm→` | `componentWillMount = () => { }` DEPRECATED!!! |
|
||||
| `cdm→` | `componentDidMount = () => { }` |
|
||||
| `cwr→` | `componentWillReceiveProps = (nextProps) => { }` DEPRECATED!!! |
|
||||
| `scu→` | `shouldComponentUpdate = (nextProps, nextState) => { }` |
|
||||
| `cwup→` | `componentWillUpdate = (nextProps, nextState) => { }` DEPRECATED!!! |
|
||||
| `cdup→` | `componentDidUpdate = (prevProps, prevState) => { }` |
|
||||
| `cwun→` | `componentWillUnmount = () => { }` |
|
||||
| `cwun→` | `componentWillUnmount = () => { }` |
|
||||
| `gdsfp→` | `static getDerivedStateFromProps(nextProps, prevState) { }` |
|
||||
| `gsbu→` | `getSnapshotBeforeUpdate = (prevProps, prevState) => { }` |
|
||||
| `ren→` | `render() { return( ) }` |
|
||||
| `sst→` | `this.setState({ })` |
|
||||
| `ssf→` | `this.setState((state, props) => return { })` |
|
||||
| `props→` | `this.props.propName` |
|
||||
| `state→` | `this.state.stateName` |
|
||||
| `rcontext→` | `const ${1:contextName} = React.createContext()` |
|
||||
| `cref→` | `this.${1:refName}Ref = React.createRef()` |
|
||||
| `fref→` | `const ref = React.createRef()` |
|
||||
| `bnd→` | `this.methodName = this.methodName.bind(this)` |
|
||||
|
||||
### [Gi](https://marketplace.visualstudio.com/items?itemName=rubbersheep.gi)
|
||||
> Generating .gitignore files made easy.
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue