Imagine we have a reducer to control a list of items:
function listOfItems(state: Array<Object> = [], action: Object = {}): Array<Object> {
switch(action.type) {
case 'SHOW_ALL_ITEMS':
return action.data.items
default:| import React from 'react'; | |
| import { shallow } from 'enzyme'; | |
| import MyComponent from '../src/my-component'; | |
| const wrapper = shallow(<MyComponent/>); | |
| describe('(Component) MyComponent', () => { | |
| it('renders without exploding', () => { | |
| expect(wrapper).to.have.length(1); | |
| }); |
| import React, { Component } from 'react' | |
| import { SubWidgetLink } from './routes' | |
| export default class MyComponentWithALink extends Component { | |
| render() { | |
| const { widget } = this.props | |
| return ( | |
| <div> | |
| ... |
| var ReactDOMServer = require('react-dom/server'); | |
| var cheerio = require('cheerio'); | |
| module.exports = function( reactClass ) { | |
| var staticMarkup = ReactDOMServer.renderToStaticMarkup(reactClass); | |
| var $ = cheerio.load(staticMarkup); | |
| return $.root().children().first(); | |
| }; |
A complete list of RxJS 5 operators with easy to understand explanations and runnable examples.
| #!/usr/bin/env bash | |
| # Copy the url of the active ngrok connection to the clipboard. | |
| # Usage: | |
| # ngrok-copy # copies e.g. https://3cd67858.ngrok.io to clipboard. | |
| # ngrok-copy -u # copies e.g. http://3cd67858.ngrok.io to clipboard. | |
| if [[ "$1" == "-u" ]]; then | |
| NGROK_URL=`curl -s http://127.0.0.1:4040/status | grep -P "http://.*?ngrok.io" -oh` | |
| else | |
| NGROK_URL=`curl -s http://127.0.0.1:4040/status | grep -P "https://.*?ngrok.io" -oh` |
| import React from 'react'; | |
| import axios from 'axios'; | |
| import Rx from 'rxjs'; | |
| export default class App extends React.Component { | |
| constructor(props) { | |
| super(props); | |
| this.state = { | |
| scores: [] | |
| }; |
| // How to get the pickadate to mount correcty in React.js component | |
| // requires jQuery and pickadate.js (https://github.com/amsul/pickadate.js/) | |
| var Component = React.createClass({ | |
| getInitialState: function() { | |
| return ({value: null}); | |
| }, | |
| componentDidMount: function() { |
| import './login.styl'; | |
| import Component from '../components/component.react'; | |
| import React from 'react'; | |
| import exposeRouter from '../components/exposerouter.react'; | |
| import {focusInvalidField} from '../lib/validation'; | |
| @exposeRouter | |
| export default class Login extends Component { | |
| static propTypes = { |
| var fs = require('fs'); | |
| var util = require('util'); | |
| var request = require('request'); | |
| var clientId = 'test-app'; // Can be anything | |
| var clientSecret = 'f6f0bfec08274b8790520a9079b808af'; // API key from Azure marketplace | |
| var str = 'This is a cool demo to call Microsoft text to speach service in Node.js.'; | |
| console.log('Converting from text -> speech -> text.'); |