Started setting up react

Algram · Aug 28, 2016 · 54de219 · 54de219
1 parent 94a2a75
commit 54de219
Show file tree

Hide file tree

Showing 5 changed files with 46 additions and 5 deletions.
diff --git a/.eslintrc b/.eslintrc
@@ -2,6 +2,7 @@
   "extends": "airbnb",
   "rules": {
     "comma-dangle": ["error", "never"],
-    "no-console": ["error", {"allow": ["log"]}]
+    "no-console": ["error", {"allow": ["log"]}],
+    "react/jsx-filename-extension": [1, { "extensions": [".js", ".jsx"] }]
   }
 }
diff --git a/.gitignore b/.gitignore
@@ -34,3 +34,5 @@ node_modules
 
 # Exclude config
 config.json
+
+build
diff --git a/package.json b/package.json
@@ -4,7 +4,8 @@
   "description": "",
   "main": "index.js",
   "scripts": {
-    "start": "webpack-dev-server --content-base build --hot --inline",
+    "start": "webpack-dev-server --content-base src --hot --inline",
+    "build": "webpack --progress --colors",
     "test": "echo \"Error: no test specified\" && exit 1"
   },
   "repository": {
@@ -18,7 +19,9 @@
   },
   "homepage": "https://github.com/Algram/ytdl-webserver#readme",
   "dependencies": {
-    "hapi": "^15.0.1"
+    "hapi": "^15.0.1",
+    "react": "^15.3.1",
+    "react-dom": "^15.3.1"
   },
   "devDependencies": {
     "babel-core": "^6.14.0",
@@ -30,8 +33,6 @@
     "eslint-plugin-import": "^1.14.0",
     "eslint-plugin-jsx-a11y": "^2.2.0",
     "eslint-plugin-react": "^6.1.2",
-    "react": "^15.3.1",
-    "react-dom": "^15.3.1",
     "webpack": "^1.13.2",
     "webpack-dev-server": "^1.15.0"
   }

diff --git a/src/index.html b/src/index.html
@@ -0,0 +1,11 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>Webpack, ES6, React, Hot!!</title>
+</head>
+<body>
+    <div id="app"></div>
+    <script src="bundle.js"></script>
+</body>
+</html>
diff --git a/src/main.js b/src/main.js
@@ -0,0 +1,26 @@
+/* global document */
+
+import React, { PropTypes } from 'react';
+import { render } from 'react-dom';
+
+class Hello extends React.Component {
+  componentDidMount() {
+    console.log('asdasd');
+  }
+
+  render() {
+    return (
+      <div>Hello {this.props.name}
+        <h1>{this.props.headline}</h1>
+      </div>
+    );
+  }
+}
+
+Hello.propTypes = {
+  name: PropTypes.string,
+  headline: PropTypes.string
+};
+
+render(
+  <Hello name="somewename" headline="adsuiasd" />, document.getElementById('app'));
Original file line number	Diff line number	Diff line change
Expand Up		@@ -34,3 +34,5 @@ node_modules

		# Exclude config
		config.json

		build