This file contains 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
<audio id="audio1"> | |
<source src="https://s3.amazonaws.com/freecodecamp/simonSound1.mp3" type="audio/mpeg"> | |
</audio> | |
<audio id="audio2"> | |
<source src="https://s3.amazonaws.com/freecodecamp/simonSound2.mp3" type="audio/mpeg"> | |
</audio> | |
<audio id="audio3"> | |
<source src="https://s3.amazonaws.com/freecodecamp/simonSound3.mp3" type="audio/mpeg"> | |
</audio> |
This file contains 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, { Component, Fragment } from 'react'; | |
import { number } from 'prop-types'; | |
class Comic extends Component { | |
static baseComicUrl = `https://xkcd.now.sh/:comicId`; | |
static propTypes = { | |
id: number.isRequired, | |
}; | |
state = { |
This file contains 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 { func, string } from 'prop-types'; | |
export default class Fetch extends React.Component { | |
static propTypes = { | |
render: func.isRequired, | |
url: string.isRequired, | |
}; | |
state = { |
This file contains 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, { Component, Fragment } from 'react'; | |
import { number } from 'prop-types'; | |
import Fetch from './reusables/Fetch'; | |
class Comic extends Component { | |
static baseComicUrl = `https://xkcd.now.sh/:comicId`; | |
static propTypes = { | |
id: number.isRequired, | |
}; |
This file contains 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
renderContent = ({ data, error, loading, errorMessage }) => { // mengambil data, error, loading, errorMessage dari state milik Fetch | |
const { id } = this.props; | |
if (error) { | |
return <p>an error happened while trying to fetch comic #{id}</p>; | |
} | |
if (loading) { | |
return <p>loading...</p>; | |
} |
This file contains 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
// we can destructure Fetch's state here | |
renderContent = ({ data, error, loading, errorMessage }) => { | |
const { id } = this.props; | |
if (error) { | |
return <p>an error happened while trying to fetch comic #{id}</p>; | |
} | |
if (loading) { | |
return <p>loading...</p>; |
This file contains 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 ReactDOM from 'react-dom'; | |
const withCounter = Component => { | |
return class ComponentWithCounter extends React.Component { | |
state = { | |
count: 0, | |
}; | |
handleDecrement = () => { |
This file contains 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, { useState } from 'react'; | |
import ReactDOM from 'react-dom'; | |
const useCounter = () => { | |
const [count, setCount] = useState(0); | |
const onIncrease = () => setCount(count + 1); | |
const onDecrease = () => setCount(count - 1); | |
return [ count, onIncrease, onDecrease ]; |
This file contains 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, { useState, useEffect } from 'react'; | |
import ReactDOM from 'react-dom'; | |
const usePerformance = initialTimestamp => { | |
const [timings, updateTimings] = useState([]); | |
let prev = initialTimestamp; | |
useEffect(() => { | |
const newTimestamp = new Date().getTime(); |
This file contains 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
!(function(e) { | |
function t(t) { | |
for (var r, a, c = t[0], l = t[1], i = t[2], s = 0, p = []; s < c.length; s++) | |
(a = c[s]), o[a] && p.push(o[a][0]), (o[a] = 0); | |
for (r in l) Object.prototype.hasOwnProperty.call(l, r) && (e[r] = l[r]); | |
for (f && f(t); p.length; ) p.shift()(); | |
return u.push.apply(u, i || []), n(); | |
} | |
function n() { | |
for (var e, t = 0; t < u.length; t++) { |
OlderNewer