+
+
+ 
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ SLIDE 1
+
+
+ SLIDE 2
+
+
+ SLIDE 3
+
+
+ SLIDE 3
+
+
+
+
+ Auto-Animate Example
+This will fade out
+
+
+ function Example() {
+ const [count, setCount] = useState(0);
+ }
+ Auto-Animate Example
+This will fade out
+This element is unmatched
+
+
+ function Example() {
+ New line!
+ const [count, setCount] = useState(0);
+ }
+ Line Height & Letter Spacing
+Line Height & Letter Spacing
+
+ import React, { useState } from 'react';
+
+ function Example() {
+ const [count, setCount] = useState(0);
+
+ return (
+ ...
+ );
+ }
+
+ function Example() {
+ const [count, setCount] = useState(0);
+
+ return (
+ <div>
+ <p>You clicked {count} times</p>
+ <button onClick={() => setCount(count + 1)}>
+ Click me
+ </button>
+ </div>
+ );
+ }
+
+ function Example() {
+ // A comment!
+ const [count, setCount] = useState(0);
+
+ return (
+ <div>
+ <p>You clicked {count} times</p>
+ <button onClick={() => setCount(count + 1)}>
+ Click me
+ </button>
+ </div>
+ );
+ }
+ Swapping list items
+-
+
- One +
- Two +
- Three +
Swapping list items
+-
+
- Two +
- One +
- Three +
Swapping list items
+-
+
- Two +
- Three +
- One +