Upgraded all dependencies

babel.config.js

@@ -0,0 +1,8 @@
+module.exports = {
+  presets: ['@babel/preset-env', '@babel/preset-react'],
+  plugins: [
+    '@babel/plugin-transform-runtime',
+    '@babel/plugin-proposal-object-rest-spread',
+    '@babel/plugin-syntax-dynamic-import'
+  ]
+};

package.json

@@ -29,10 +29,17 @@
   },
   "homepage": "https://github.com/marcnuri-demo/react-webpack-babel-sass-boilerplate#readme",
   "devDependencies": {
-    "babel-core": "^6.26.3",
-    "babel-loader": "^7.1.4",
-    "babel-preset-env": "^1.7.0",
-    "babel-preset-react": "^6.24.1",
+    "@babel/core": "7.2.2",
+    "@babel/plugin-proposal-object-rest-spread": "7.3.2",
+    "@babel/plugin-syntax-dynamic-import": "7.2.0",
+    "@babel/plugin-transform-runtime": "7.2.0",
+    "@babel/preset-env": "7.3.1",
+    "@babel/preset-react": "7.0.0",
+    "@babel/runtime": "7.3.1",
+    "babel-core": "^7.0.0-bridge.0",
+    "babel-eslint": "^10.0.1",
+    "babel-jest": "^23.6.0",
+    "babel-loader": "^8.0.5",
     "css-loader": "^1.0.0",
     "html-loader": "^0.5.5",
     "html-webpack-plugin": "^3.2.0",
@@ -44,7 +51,7 @@
     "webpack-dev-server": "^3.1.4"
   },
   "dependencies": {
-    "react": "^16.4.1",
-    "react-dom": "^16.4.1"
+    "react": "^16.8.1",
+    "react-dom": "^16.8.1"
   }
 }

src/app.jsx

@@ -5,16 +5,12 @@ import FancyButton from "./fancy-button/fancy-button";
 
 const content = 'Hello world!';
 
-class App extends Component {
-  render() {
-    return (
-      <Fragment>
-        <div className={styles["resizeable-both"]}>{content}</div>
-        <Button label="Regular Button"/>
-        <FancyButton label="Fancy Button"/>
-      </Fragment>
-    );
-  }
-}
+const App = () => (
+  <Fragment>
+    <div className={styles["resizeable-both"]}>{content}</div>
+    <Button label="Regular Button"/>
+    <FancyButton label="Fancy Button"/>
+  </Fragment>
+);
 
 export default App;

src/button/button.jsx

@@ -1,13 +1,8 @@
-import React, {Component} from 'react';
+import React from 'react';
 import styles from './button.scss'
 
-class Button extends Component {
-
-  render() {
-    return (
-        <button className={styles.button}>{this.props.label}</button>
-    );
-  }
-}
+const Button = ({label}) => (
+  <button className={styles.button}>{label}</button>
+);
 
 export default Button;

src/fancy-button/fancy-button.jsx

@@ -1,12 +1,8 @@
-import React, {Component} from 'react';
+import React from 'react';
 import styles from './fancy-button.scss'
 
-class FancyButton extends Component {
-  render() {
-    return (
-        <button className={styles.button}>{this.props.label}</button>
-    );
-  }
-}
+const FancyButton = ({label}) => (
+    <button className={styles.button}>{label}</button>
+);
 
 export default FancyButton;