diff --git a/README.md b/README.md
index 99fdcc1..f4ecf97 100644
--- a/README.md
+++ b/README.md
@@ -25,9 +25,9 @@ import React, {Component} from 'react';
 import { ScrollSync, ScrollSyncPane } from 'react-scroll-sync';
 
 export default class MyComponent extends Component {
-    
     render() {
-      <ScrollSync>
+    return (
+        <ScrollSync>
         <div style={{ display: 'flex', position: 'relative', height: 300 }}>
           <ScrollSyncPane>
             <div style={{overflow: 'auto'}}>
@@ -40,7 +40,7 @@ export default class MyComponent extends Component {
               </section>
             </div>
           </ScrollSyncPane>
-
+      
           <ScrollSyncPane>
             <div style={{overflow: 'auto'}}>
               <section style={{ height: 1000 }}>
@@ -52,7 +52,7 @@ export default class MyComponent extends Component {
               </section>
             </div>
           </ScrollSyncPane>
-
+      
           <ScrollSyncPane>
             <div style={{overflow: 'auto'}}>
               <section style={{ height: 2000 }}>
@@ -66,8 +66,6 @@ export default class MyComponent extends Component {
           </ScrollSyncPane>
         </div>
       </ScrollSync>
-
-        );
-    }
+    )}
 }
 ```
diff --git a/package.json b/package.json
index 284e8b8..f0ff0b6 100644
--- a/package.json
+++ b/package.json
@@ -70,8 +70,8 @@
     "webpack": "1.13.2"
   },
   "peerDependencies": {
-    "react": "0.14.x || 15.x || 16.x",
-    "react-dom": "0.14.x || 15.x || 16.x"
+    "react": "0.14.x || 15.x || 16.x || 17.x",
+    "react-dom": "0.14.x || 15.x || 16.x || 17.x"
   },
   "dependencies": {
     "prop-types": "^15.5.7"