All Projects → discountry → vscode-react-redux-react-router-snippets

discountry / vscode-react-redux-react-router-snippets

Licence: MIT License
vscode-react-redux-react-router-snippets

Projects that are alternatives of or similar to vscode-react-redux-react-router-snippets

vscode-phpserver
Visual Studio Code extension to quickly serve your PHP projects :)
Stars: ✭ 62 (+93.75%)
Mutual labels:  vscode-extension
vscode-requirejs
Provides goto definition functionality for require js modules.
Stars: ✭ 20 (-37.5%)
Mutual labels:  vscode-extension
vscode-filter-line
vscode extension for filter line by strings or regular expressions
Stars: ✭ 46 (+43.75%)
Mutual labels:  vscode-extension
snippets
VSCode extension which lets you manage your code snippets without quitting your editor.
Stars: ✭ 55 (+71.88%)
Mutual labels:  vscode-extension
c-cpp-project-generator
📂 Create C/C++ projects on vscode
Stars: ✭ 22 (-31.25%)
Mutual labels:  vscode-extension
vscode-text-marker
Visual Studio Code Extension. Select text in your code and mark all matches. The marking colour is configurable
Stars: ✭ 61 (+90.63%)
Mutual labels:  vscode-extension
vscode-jump
🏃‍♂️ Jump/Select to the Start/End of a word in VSCode
Stars: ✭ 67 (+109.38%)
Mutual labels:  vscode-extension
vscode-appcelerator-titanium
Appcelerator development tools and UI package for Visual Studio Code.
Stars: ✭ 35 (+9.38%)
Mutual labels:  vscode-extension
vscode-less
🔌 Less intellisense for Variables and Mixins in all Less files.
Stars: ✭ 21 (-34.37%)
Mutual labels:  vscode-extension
project-japanese-proofreading
テキストファイルやMarkdownファイルの日本語の文章をチェックするVS Codeの拡張機能
Stars: ✭ 81 (+153.13%)
Mutual labels:  vscode-extension
vscode-sops
Just a simple integration of SOPS by Mozilla into VSCode IDE. It contains some advanced features over the original project which makes sense for IDE.
Stars: ✭ 25 (-21.87%)
Mutual labels:  vscode-extension
vscode-eex-snippets
Elixir EEx and HTML (EEx) code snippets.
Stars: ✭ 23 (-28.12%)
Mutual labels:  vscode-extension
vscode-angular-html
Angular syntax highlighting for HTML templates
Stars: ✭ 35 (+9.38%)
Mutual labels:  vscode-extension
firecode
VS Code Firestore Rules Extension
Stars: ✭ 35 (+9.38%)
Mutual labels:  vscode-extension
vscode-ecsstractor
Extracting selectors from HTML / JSX / TSX and generate CSS file.
Stars: ✭ 45 (+40.63%)
Mutual labels:  vscode-extension
vscode-mermaid-editor
Live editor and image creator for mermaid.js in Visual Studio Code
Stars: ✭ 23 (-28.12%)
Mutual labels:  vscode-extension
vscode-qq
基于安卓QQ协议的vscode-qq扩展
Stars: ✭ 588 (+1737.5%)
Mutual labels:  vscode-extension
vscode-snippet-generator
📜 Generate snippets from code in VSCode
Stars: ✭ 31 (-3.12%)
Mutual labels:  vscode-extension
VSCode-Anywhere
VSCode with preconfigured tools for your programming languages : binaries, settings, extensions and documentations
Stars: ✭ 26 (-18.75%)
Mutual labels:  vscode-extension
vscode-graphviz
This extension provides GraphViz (dot) language support for VS Code.
Stars: ✭ 21 (-34.37%)
Mutual labels:  vscode-extension

React/Redux/react-router Snippets CircleCI

Version Install Ratings

Useful React Ecosystem snippets for Visual Studio Code, including:

  • Quick import
  • React
  • Redux
  • react-redux
  • react-router

Screenshot

Screenshot

Usage

import

Trigger Content
imr import React from 'react'
imrc import React, { Component } from 'react'
imd import { render } from 'react-dom'
impt import PropTypes from 'prop-types'
imc import ${1:componentName} from './Components/${1:componentName}'
imconnect import { connect } from 'react-redux'
improvider import { Provider } from 'react-redux'
imcreateSelector import { createSelector } from 'reselect'
imrr import { BrowserRouter, Route } from 'react-router-dom'
imnl import { NavLink } from 'react-router-dom'
imwr import { withRouter } from 'react-router-dom'

React

Trigger Content
rcc→ class component skeleton
rccp→ class component skeleton with prop types after the class
rcjc→ class component skeleton without import and default export lines
rcfc→ class component skeleton that contains all the lifecycle methods
rsc→ stateless component skeleton
rscp→ stateless component with prop types skeleton
rpt→ empty propTypes declaration
spt→ static propTypes = {}
sdp→ static defaultProps = {}
con→ class default constructor with props
conc→ class default constructor with props and context
est→ empty state object
st→ Creates empty state object with ES7 synTax
cwm→ componentWillMount method
cdm→ componentDidMount method
cwr→ componentWillReceiveProps method
scu→ shouldComponentUpdate method
cwup→ componentWillUpdate method
cdup→ componentDidUpdate method
cwun→ componentWillUnmount method
cdc→ componentDidCatch method
ren→ render method
sst→ this.setState with object as parameter
ssf→ this.setState with function as parameter
props→ this.props
state→ this.state
bnd→ binds the this of method inside the constructor
pta→ PropTypes.array,
ptar→ PropTypes.array.isRequired,
ptb→ PropTypes.bool,
ptbr→ PropTypes.bool.isRequired,
ptf→ PropTypes.func,
ptfr→ PropTypes.func.isRequired,
ptn→ PropTypes.number,
ptnr→ PropTypes.number.isRequired,
pto→ PropTypes.object.,
ptor→ PropTypes.object.isRequired,
pts→ PropTypes.string,
ptsr→ PropTypes.string.isRequired,
ptnd→ PropTypes.node,
ptndr→ PropTypes.node.isRequired,
ptel→ PropTypes.element,
ptelr→ PropTypes.element.isRequired,
pti→ PropTypes.instanceOf(ClassName),
ptir→ PropTypes.instanceOf(ClassName).isRequired,
pte→ PropTypes.oneOf(['News', 'Photos']),
pter→ PropTypes.oneOf(['News', 'Photos']).isRequired,
ptet→ PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
ptetr→ PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,
ptao→ PropTypes.arrayOf(PropTypes.number),
ptaor→ PropTypes.arrayOf(PropTypes.number).isRequired,
ptoo→ PropTypes.objectOf(PropTypes.number),
ptoor→ PropTypes.objectOf(PropTypes.number).isRequired,
ptsh→ PropTypes.shape({color: PropTypes.string, fontSize: PropTypes.number}),
ptshr→ PropTypes.shape({color: PropTypes.string, fontSize: PropTypes.number}).isRequired,

Redux

Trigger Content
rat Redux constant(actionTypes)
rac Redux actionCreator
reducer Redux reducer
store Redux store
selector Redux selector

react-redux

Trigger Content
imconnect import { connect } from 'react-redux'
improvider import { Provider } from 'react-redux'
provider react-redux Provider Container
mstp mapStateToProps
mdtp mapDispatchToProps
connect react-redux connect React Component
container Redux container

react-router

Trigger Content
imrr import { BrowserRouter as Router, Route } from 'react-router-dom'
imnl import { NavLink } from 'react-router-dom'
imwr import { withRouter } from 'react-router'
router react-router Router template
route react-router Route component
navlink react-router NavLink component

Contributors

Acknowledgments

License

MIT

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].