Skip to content

Instantly share code, notes, and snippets.

Avatar
:octocat:
Instead of adding emojis to my commits I spend that time writing actual code.

methodbox

:octocat:
Instead of adding emojis to my commits I spend that time writing actual code.
View GitHub Profile
@methodbox
methodbox / getNewMission.tsx
Last active Jul 24, 2019
Get Started with TypeScript - Part 2 -
View getNewMission.tsx
_getNewRocket() {
this.setState({
rocketName: mission.rocket.rocket_name,
missionName: mission.mission_name,
missionLogo: mission.links.mission_patch_small,
launchImg: mission.links.flickr_images[Math.floor(Math.random() * 5)],
missionDetails: mission.details,
flightNumber: mission.flight_number,
missionId: mission.mission_id,
launchDate: new Date(mission.launch_date_unix * 1000).toDateString(),
@methodbox
methodbox / getNewMission.tsx
Created Jul 24, 2019
Get Started with TypeScript - Part 2 - _getNewMission complete
View getNewMission.tsx
_getNewMission() {
this.setState({
// Use this to change the state values when the button is clicked.
appTitle: 'SpaceX Launches',
launchImg: require('./assets/2013_-_9_falcon_9_ses_launch-4.jpg'),
rocketName: '',
missionName: '',
missionLogo: require('./assets/mission-logo.png'),
missionDetails: '',
missionSuccess: false,
@methodbox
methodbox / state.tsx
Last active Jul 24, 2019
Get Started with TypeScript - Part 2 - State assigned to state
View state.tsx
type State = {
appTitle: string;
launchImg: string;
rocketName: string;
missionName: string;
missionLogo: string;
missionDetails: string;
missionSuccess: boolean;
flightNumber: number;
missionId: string;
@methodbox
methodbox / stateType.tsx
Last active Jul 24, 2019
Get Started with TypeScript - Part 2 - New State Type - Complete
View stateType.tsx
type State = {
appTitle: string;
launchImg: string;
rocketName: string;
missionName: string;
missionLogo: string;
missionDetails: string;
missionSuccess: boolean;
flightNumber: number;
missionId: string;
@methodbox
methodbox / stateType.tsx
Last active Jul 24, 2019
Get Started with TypeScript - Part 2 - New State type
View stateType.tsx
type State = {
appTitle: 'SpaceX Launches';
launchImg: '';
rocketName: '';
missionName: '';
missionLogo: '';
missionDetails: '';
missionSuccess: false;
flightNumber: 0;
missionId: '';
@methodbox
methodbox / RocketApp.tsx
Last active Jul 24, 2019
Get Started with TypeScript - Part 2 - Add a new State type
View RocketApp.tsx
import * as React from 'react';
import './styles.css';
// Rocket Info
import { mission } from './data/rockets';
import 'bootstrap/dist/css/bootstrap.css';
// Create a State type below this line
type State = {}
export default class RocketApp extends React.Component<{}, {}> {...}
@methodbox
methodbox / personAge.ts
Created Jul 23, 2019
ts - part 2 - example 2
View personAge.ts
const bob: string = 'Bob';
const bobsAge: number = 20;
function personAge(person: string, age: number) {
return `${person} is ${age} years old.`;
}
personAge(bob, bobsAge);
@methodbox
methodbox / tsconfig.json
Created Jul 23, 2019
ts - part 2 - example 1
View tsconfig.json
{
"compilerOptions": {
"lib": ["es6"],
"target": "es6",
"module": "commonjs",
"noImplicitAny": true,
"noImplicitThis": true,
"strictNullChecks": false,
"strictFunctionTypes": true,
"forceConsistentCasingInFileNames": true
@methodbox
methodbox / tstooling.ts
Last active Jul 9, 2019
TypeScript example for tooling
View tstooling.ts
let myNumber: number = 10;
let myString: string = 'this is a string';
const badMath = (x: number, y: number) => {
return x * y;
}
badMath(myNumber, myString) /**
* error TS2345: Argument of type 'string'
* is not assignable to parameter of type 'number'.
View typeofExample.js
let myNumber = 10;
let myString = 'this is a string';
if (typeof myNumber === 'string') {
console.log('This is a string, not a number.')
} else {
console.log('This is a number');
}
const badMath = (x, y) => {