Airship React Snippets

This is a collection of React Snippets to make your fingers a little happier.

Installation

In order to install an extension you need to launch the Command Pallete (Ctrl + Shift + P or Cmd + Shift + P) and type Extensions. There you have either the option to show the already installed snippets or install new ones.

Launch VS Code Quick Open (Ctrl + P or Cmd + P), paste the following command, and press enter.

ext install airship-react-snippets

Alternatively you can open the extensions panel and search for 'Airship React Snippets'.

Supported languages (file extensions)

Javascript (.js)

Snippets

imp

import $1 from '$2';

impr

import React from 'react';

imprc

import React, { Component } from 'react';

imprn

import { $1 } from 'react-native';

imprr

import { connect } from 'react-redux';

impaa

import * as $1 from '$2';

afn

$1 = ($2) => {
  $3
};

eafn

export default ($1) => {
  $2
};

enfn

export const $1 = ($2) => {
  $3
};

prom

return new Promise((resolve, reject) => {
  $1
});

rinit

import React from 'react';
import ReactDOM from 'react-dom';

ReactDOM.render(
  $2
  , document.querySelector('$1')
);

rcc

class $1 extends Component {
  state = { $2 };

  render() {
    return (
      $3
    );
  }
}

export default $1;

recc

export default class $1 extends Component {
  state = { $2 };

  render() {
    return (
      $3
    );
  }
}

ris

this.state = {
  $1
};

rss

this.setState({
  $1: $2
});

this.state.$1

rcpt

$1.propTypes = {
  $2
};

$1.defaultProps = {

};

this.props.$1

rcon

constructor(props) {
  $1
}

rren

render() {
  return (
    $1
  );
}

rcwm

componentWillMount() {
  $1
}

rcdm

componentDidMount() {
  $1
}

rcwum

componentWillUnmount() {
  $1
}

rcwu

componentWillUpdate(nextProps) {
  $1
}

rcdu

componentDidUpdate(prevProps, prevState) {
  $1
}

rcwrp

componentWillReceiveProps(nextProps) {
  $1
}

rsc

const $1 = () => (
  $2
)

export default $1;

rhoc

import React, { Component } from 'react';

export default function(ComposedComponent) {
  class $1 extends Component {
    render() {
      return <ComposedComponent {...this.props} />;
    }
  }

  return $1;
}

rrinit

import React from 'react';
import ReactDOM from 'react-dom';
import { Provider } from 'react-redux';
import { createStore, applyMiddleware } from 'redux';

import reducers from './reducers';

const createStoreWithMiddleware = applyMiddleware()(createStore);

ReactDOM.render(
  <Provider store={createStoreWithMiddleware(reducers)}>
    $2
  </Provider>
  , document.querySelector('$1')
);

rrcr

import { combineReducers } from 'redux';
import $1 from './$2';

const rootReducer = combineReducers({
  $3
});

export default rootReducer;

rccc

import React, { Component } from 'react';
import { connect } from 'react-redux';

class $1 extends Component {
  render() {
    return (
      $2
    );
  }
}

const mapStateToProps = (state) => ({
  $3
});

export default connect(mapStateToProps)($1);

rred

export default (state = $1, action) => {
  switch(action.type) {
    case $2:
      $3
    default:
      return state;
  }
}

rmstp

const mapStateToProps = (state) => ({
  $1
});

License

MIT License

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

isaac12x / airship-react-snippets Goto Github PK