Bolza

// TROUBLESHOOTING
// Check rendering happens after setting spy




// Simply mock a library function
jest.spyOn(realtimeSlice, 'sendMessage');

// Click and wait

Bolza

import React, { useRef, useEffect, useState } from 'react'

const useWindowSize = () => {
  function getSize() {
    return {
      width: window.innerWidth,
      height: window.innerHeight,
    }
  }

Bolza

// inspired by https://dev.to/goenning/how-to-retry-when-react-lazy-fails-mb5 
const ValueSet = React.lazy(() =>
  lazyCheck(() => import('../routes/ValueSet/ValueSet'))
)

function lazyCheck(fn: Function): Promise<{ default: ComponentType<any> }> {
  return new Promise((resolve, reject) => {
    fn()
      .then(resolve)
      .catch((error: Error) => {

Bolza

class ReferenceWrapper extends Component {
  static displayName = 'ReferenceWrapper'
  render() {
    return Children.only(this.props.children)
  }
}

const renderWrapper = WrappedComponent => {
  function SizeMeRenderer(props) {
    const toRender = renderPlaceholder ? (

Bolza

{
"Create Basic Reactnative Component": {
	"prefix": "react-native-component",
	"body": [
		"import React, { Component } from 'react';",
		"import { View, Text } from 'react-native';",
		"import { connect } from 'react-redux';",
		"",
		"class ${2:App}Component extends Component {",
		"    state = {}",

Bolza

Example of an entire git workflow with rebasing

git clone ssh://git@dev.example.com/project/repo.git

git checkout -b EXAMPLE-625-jira-ticket origin/develop to branch off a remote

git commit -a -m 'Fixes issue in EXAMPLE-625' git push origin EXAMPLE-625-jira-ticket

Bolza

//  Creating the dictionary
var dict = [];
for (var i = 0; i < 100000; i++) {
    dict.push('abcdfg');
    dict.push('abcdff');
}

var inputWord = 'gfdcba';

// Setup

Bolza

Resources

Splitting bundles

Webpack + Angular2 + Typescript Workflow

Setup Project

1. Install Angular2 deps using npm
2. Try to directly use import { Stuff } from '@angular/core'

Bolza

Reflect-metadata error

• adding import 'zone.js' and 'reflect-metadata'
• System.config.babelOptions.stage = 1

RXJS missing / errors

• update NG2 to >=2.0.0-beta.9, doesnt require external rxjs anymore

Transpiler SyntaxError on any Typescript annotation as Unexpected token

• npm install --save-dev babel-plugin-transform-decorators-legacy babel-plugin-transform-class-properties babel-plugin-transform-flow-strip-types babel-preset-es2015 babel-plugin-angular2-annotations
• in gulpfile task add plugins: 'angular2-annotations','transform-decorators-legacy','transform-class-properties','transform-flow-strip-types'

Bolza

/// <reference path="node_modules/angular2/ts/typings/node/node.d.ts"/>
/// <reference path="node_modules/angular2/typings/browser.d.ts"/>
import { bootstrap } from "angular2/platform/browser";
import { Component } from "angular2/core";
@Component({
    selector: 'hello-world',
    template: <div> Hello World! </div>
})
class HelloWorld {
}