Update demo (#510)

* Update demo

* Rollback SKIP_PREFLIGHT_CHECK

* Rollback useCountUp test

README.md

@@ -153,7 +153,7 @@ Note that `delay={0}` will automatically start the count up.
 import { useCountUp } from 'react-countup';
 
 const SimpleHook = () => {
-  useCountUp({ end: 1234567 });
+  useCountUp({ ref: "counter", end: 1234567 });
   return <span id="counter"/>;
 };
 ```

demo/package.json

@@ -4,15 +4,15 @@
   "private": true,
   "dependencies": {
     "prop-types": "^15.6.2",
-    "react": "^16.10.2",
-    "react-countup": "^4.2.2",
-    "react-dom": "^16.10.2",
-    "react-feather": "^2.0.3",
-    "react-github-corner": "^2.3.0",
-    "react-live": "^2.2.1",
-    "react-scripts": "3.4.1",
-    "serve": "^11.2.0",
-    "styled-components": "^5.0.0"
+    "react": "^17.0.2",
+    "react-countup": "^5.0.0-0",
+    "react-dom": "^17.0.2",
+    "react-feather": "^2.0.9",
+    "react-github-corner": "^2.5.0",
+    "react-live": "^2.2.3",
+    "react-scripts": "4.0.3",
+    "serve": "^12.0.0",
+    "styled-components": "^5.3.0"
   },
   "scripts": {
     "start": "react-scripts start",

demo/src/App.js

@@ -190,25 +190,25 @@ const delayStart = `
 const hook = `
 () => {
   const {
-    countUp,
     start,
     pauseResume,
     reset,
     update
   } = useCountUp({
+    ref: "counter",
     start: 0,
     end: 1234567,
     delay: 2,
     duration: 5,
-    onReset: () => console.log('Resetted!'),
+    onReset: () => console.log('Reseted!'),
     onUpdate: () => console.log('Updated!'),
     onPauseResume: () => console.log('Paused or resumed!'),
     onStart: () => console.log('Started! 💨'),
     onEnd: () => console.log('Ended! 👏')
   });
   return (
     <div>
-      <div>{countUp}</div>
+      <div id="counter"/>
       <button onClick={start}>Start</button>
       <button onClick={reset}>Reset</button>
       <button onClick={pauseResume}>Pause/Resume</button>
@@ -236,7 +236,7 @@ const App = () => (
     <Example code={manualStart} title="Manually start with render prop" />
     <Example code={autoStart} title="Autostart with render prop" />
     <Example code={delayStart} title="Delay start" />
-    <Example code={hook} title="Useage as hook" />
+    <Example code={hook} title="Usage as hook" />
     <GithubCorner bannerColor="palevioletred" href={repo} />
     <Footer>
       <Text>