wongni

import React from 'react'
import styles from './Viewer.scss'
import classNames from 'classnames/bind'
import { ChasingDots } from 'better-react-spinkit'

const cx = classNames.bind(styles)

const Viewer = ({ mediaType, url, loading }) => {
  if (loading) {
    return (

wongni

import React from 'react'
import styles from './SpaceNavigator.scss'
import classNames from 'classnames/bind'
import LeftIcon from 'react-icons/lib/md/chevron-left'
import RightIcon from 'react-icons/lib/md/chevron-right'

const cx = classNames.bind(styles)

const SpaceNavigator = ({ onPrev, onNext }) => {
  return (

wongni

import React, { Component } from 'react'
import ViewerTemplate from './components/ViewerTemplate'
import SpaceNavigator from './components/SpaceNavigator'
import Viewer from './components/Viewer'

import * as api from './lib/api'

class App extends Component {
  state = {
    loading: false,

wongni

import React, { Component } from 'react'
import ViewerTemplate from './components/ViewerTemplate'
import SpaceNavigator from './components/SpaceNavigator'
import Viewer from './components/Viewer'

import * as api from './lib/api'

class App extends Component {
  getAPOD = async (date) => {
    const response = await api.getAPOD(date)

wongni

import React, { Component } from 'react'
import ViewerTemplate from './components/ViewerTemplate'
import SpaceNavigator from './components/SpaceNavigator'
import Viewer from './components/Viewer'

import * as api from './lib/api'

class App extends Component {
  getAPOD = (date) => {
    api.getAPOD(date).then((response) => {

wongni

import axios from 'axios'

const ROOT_URL = 'https://api.nasa.gov/planetary/apod'
const API_KEY = 'FReI7zlIqxtAiVvJzV7ClEh3OPmltJTMrumS7JP6' // Replace with your API key


export function getAPOD (date = '') {
  return axios.get(`${ROOT_URL}?api_key=${API_KEY}&date=${date}`)
}

wongni

function printLater (number) {
  return new Promise( // return a new Promise
    (resolve, reject) => { // Take resolve and reject as parameters
      setTimeout(() => {
        if (number > 5) {
          // reject causes an error
          return reject('number is greater than 5')
        }
        resolve(number + 1) // return number + 1
        console.log(number)

wongni

function printLater (number, fn) {
  setTimeout(
    function () {
      console.log(number)
      fn && fn()
    },
    1000
  )
}

wongni

function printLater (number) {
  setTimeout(
    function () {
      console.log(number)
    },
    1000
  )
}

printLater(1)

wongni

@import 'utils';

.viewer {
  height: 100%;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  img {
    display: block;