praveenpuglia

function flatten(array) {
  return array.reduce( (acc, e) => {
    if(Array.isArray(e)) {
      // if the element is an array, fall flatten on it again and then take the returned value and concat it.
      return acc.concat(flatten(e));
    } else {
      // otherwise just concat the value.
      return acc.concat(e);
    }
  }, [] ) // initial value for the accumulator is []

samdenty

How to install

Custom CSS plugin

Install the custom CSS plugin, then make a file on your computer that will hold your custom CSS, I like to make one in my home directory called ~/.vscodestyles.css and then add the CSS into it.

Once done, open your command palette and select enable custom CSS and JS

AkyunaAkish

import React, { Component } from 'react';
import { withRouter } from 'react-router-dom';

class SomeComponent extends Component {
  constructor(props) {
    super(props);
  }
  
  componentWillMount() {
    const someConditional = this.props.history.location.pathname === '/something-wrong';

fokusferit

Shallow

Real unit test (isolation, no children render)

Simple shallow

Calls:

• constructor
• render

jacob-beltran

// How to ensure that our animation loop ends on component unount

componentDidMount() {
  this.startLoop();
}

componentWillUnmount() {
  this.stopLoop();
}

mjackson

const element = (
  <div>
    {currentPage === 'signin' ? (
      <SignInPage/>
    ) : currentPage === 'welcome' ? (
      <WelcomePage/>
    ) : currentPage === 'about' ? (
      <AboutPage/>
    ) : (
      <DefaultPage/>

adamreisnz

{
  "name": "project-name",
  "description": "Template for static sites",
  "version": "1.0.0",
  "homepage": "http://www.project-name.com",
  "author": {
    "name": "Adam Reis",
    "url": "http://adam.reis.nz"
  },
  "license": "UNLICENSED",

Restuta

/* HOC fundamentally is just a function that accepts a Component and returns a Component:
  (component) => {return componentOnSteroids; } or just component => componentOnSteroids;
  Let's assume we want to wrap our components in another component that is used for debugging purposes, 
  it just wraps them in a DIV with "debug class on it".
  Below ComponentToDebug is a React component.
*/

//HOC using Class
  //it's a function that accepts ComponentToDebug and implicitly returns a Class
let DebugComponent = ComponentToDebug => class extends Component {

wesbos

{
  "keys": ["tab"], 
  "command": "expand_abbreviation_by_tab", 

  // put comma-separated syntax selectors for which 
  // you want to expandEmmet abbreviations into "operand" key 
  // instead of SCOPE_SELECTOR.
  // Examples: source.js, text.html - source
  "context": [
    {

eteeselink

const delay = ms => new Promise(resolve => setTimeout(resolve, ms));

async function something() {
    console.log("this might take some time....");
    await delay(5000);
    console.log("done!")
}

something();