Andrew Markham-Davies atmd83
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import React from 'react'; | |
| import { useQuery } from '@apollo/react-hooks'; | |
| import { withRouter } from 'react-router-dom'; | |
| import gql from 'graphql-tag'; | |
| import { Container, Col, Row } from 'react-bootstrap'; | |
| import Post from '../components/post'; |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| set nocompatible | |
| filetype off | |
| set rtp+=~/.vim/bundle/Vundle.vim | |
| call vundle#begin() | |
| Plugin 'VundleVim/Vundle.vim' | |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| set nocompatible | |
| filetype off | |
| set rtp+=~/.vim/bundle/Vundle.vim | |
| call vundle#begin() | |
| Plugin 'VundleVim/Vundle.vim' | |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| 1. What are some of the new language features introduced into javascript from es6 onwards and Which do you use the most? | |
| 2. Whats the difference between `let` and `const`, when would you use each? | |
| 3. Explain the difference between `.map` and `.forEach` and when you'd use each. | |
| 4. When writing modern javascript/typescript, what tools can you use to transpile your code? | |
| 5. What tools/techniques can you use to test modern javascript applications. |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta charset="utf-8"> | |
| <meta name="viewport" content="width=device-width"> | |
| <title>JS Bin</title> | |
| </head> | |
| <body> | |
| <script id="jsbin-javascript"> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import React from 'react'; | |
| import PubSub from 'pubsub-js'; | |
| import { configure, shallow } from 'enzyme'; | |
| import Adapter from 'enzyme-adapter-react-16'; | |
| configure({ adapter: new Adapter() }); | |
| import Thing from './thing'; | |
| describe('thing', () => { |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import React from 'react'; | |
| import PubSub from 'pubsub-js'; | |
| export default class Thing extends React.Component { | |
| constructor(props) { | |
| super(props); | |
| this.state = { | |
| message: 'The value is' | |
| } | |
| } |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| describe('when the state changes', () => { | |
| it('it renders correctly', () => { | |
| component = shallow(<Thing value={3} />); | |
| expect(component.find('h1').text()).toEqual('The value is 3'); | |
| // lets alter the state | |
| component.setState({ message: 'You have a value of' }); | |
| // remember our shouldComponentUpdate() rejects any update | |
| // unless the prop value has changed | |
| expect(component.find('h1').text()).toEqual('The value is 3'); |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| shouldComponentUpdate(nextProps, nextState) { | |
| if (this.props.value !== nextProps.value) { | |
| PubSub.publish('thing.should.update'); | |
| return true; | |
| } | |
| return false; | |
| } |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| describe('when the props change', () => { | |
| it('will publish the correct messages based on the prop', () => { | |
| // lets give the component a 'value' prop | |
| component = shallow(<Thing value={3} />); | |
| // lets update the component with the same prop | |
| component.setProps({ value: 3 }); | |
| expect(PubSub.publish).lastCalledWith('thing.will.receive.props'); | |
| // shouldComponentUpdate will return false | |
| // so componentWillUpdate() will not call |
NewerOlder