7 July 2015 - Building a React.JS App - Part 1 - Everydays

Doing another React.JS app for my “Everydays”.

Main.js

var React = require('react');

var Main = React.createClass({
	render: function () {
		return (
			<div>
				Hello World
			</div>
		)
	}
});

React.render(<Main />, document.getElementById('app'));

var React = require('react');

var Main = React.createClass({

render: function () {

return (

<div>

Hello World

</div>

)

}

});

React.render(<Main />, document.getElementById('app'));

webpack.config.js

module.exports = {
	entry: "./app/components/Main.js",
	output: {
		path: "./public/",
		filename: "bundle.js"
	},
	module: {
		loaders: [
			{
				test: /\.jsx?$/,
				exclude: /(node_modules|bower_components)/,
				loader: 'babel'
			}
		]
	}
};

module.exports = {

entry: "./app/components/Main.js",

output: {

path: "./public/",

filename: "bundle.js"

module: {

loaders: [

{

test: /\.jsx?$/,

exclude: /(node_modules|bower_components)/,

loader: 'babel'

}

]

}

};

index.html

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>React Github Notetaker</title>
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" />
</head>
<body>
	<div id="app"></div>
    <script src="bundle.js"></script>
</body>
</html>