Basic react page in place
This commit is contained in:
+16
@@ -0,0 +1,16 @@
|
|||||||
|
#directories
|
||||||
|
logs/**
|
||||||
|
/**/coverage
|
||||||
|
/**/node_modules
|
||||||
|
/**/dl
|
||||||
|
|
||||||
|
#passwords
|
||||||
|
/**/*.pwd
|
||||||
|
auth.json
|
||||||
|
|
||||||
|
#log files
|
||||||
|
/**/*.log
|
||||||
|
|
||||||
|
#output files
|
||||||
|
*.bundle.js
|
||||||
|
|
||||||
Generated
+5238
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,29 @@
|
|||||||
|
{
|
||||||
|
"name": "kingdombattles",
|
||||||
|
"version": "1.0.0",
|
||||||
|
"description": "Kingdom Battles",
|
||||||
|
"main": "index.js",
|
||||||
|
"scripts": {
|
||||||
|
"start": "webpack --mode=development",
|
||||||
|
"build": "webpack --mode=production"
|
||||||
|
},
|
||||||
|
"author": "Kayne Ruse",
|
||||||
|
"license": "",
|
||||||
|
"dependencies": {
|
||||||
|
"@babel/core": "^7.4.4",
|
||||||
|
"@babel/preset-env": "^7.4.4",
|
||||||
|
"@babel/preset-react": "^7.0.0",
|
||||||
|
"babel-loader": "^8.0.5",
|
||||||
|
"react": "^16.8.6",
|
||||||
|
"react-dom": "^16.8.6",
|
||||||
|
"react-redux": "^7.0.3",
|
||||||
|
"react-router": "^5.0.0",
|
||||||
|
"redux": "^4.0.1",
|
||||||
|
"redux-devtools": "^3.5.0",
|
||||||
|
"redux-devtools-dock-monitor": "^1.1.3",
|
||||||
|
"redux-devtools-log-monitor": "^1.4.0",
|
||||||
|
"redux-thunk": "^2.3.0",
|
||||||
|
"webpack": "^4.30.0",
|
||||||
|
"webpack-cli": "^3.3.2"
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,12 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang = "en">
|
||||||
|
<head>
|
||||||
|
<meta charset = "UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<link rel="stylesheet" href="/styles/shared.css"/>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id = "root"></div>
|
||||||
|
<script src="/app.bundle.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
@@ -0,0 +1,17 @@
|
|||||||
|
/* global defaults */
|
||||||
|
* {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
font: 13pt Helvetica, Arial;
|
||||||
|
width: 100vw;
|
||||||
|
height: 100vh;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
overflow-x: hidden;
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
|
||||||
@@ -0,0 +1,7 @@
|
|||||||
|
export const ACTION_NAME = 'ACTION_NAME';
|
||||||
|
|
||||||
|
export function actionName() {
|
||||||
|
return {
|
||||||
|
type: ACTION_NAME
|
||||||
|
};
|
||||||
|
}
|
||||||
@@ -0,0 +1,12 @@
|
|||||||
|
import React from 'react';
|
||||||
|
|
||||||
|
export default class App extends React.Component {
|
||||||
|
constructor(props) {
|
||||||
|
super(props);
|
||||||
|
this.state = {};
|
||||||
|
}
|
||||||
|
|
||||||
|
render() {
|
||||||
|
return <p>Hello world</p>;
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,11 @@
|
|||||||
|
import React from 'react';
|
||||||
|
import { createDevTools } from 'redux-devtools';
|
||||||
|
import LogMonitor from 'redux-devtools-log-monitor';
|
||||||
|
import DockMonitor from 'redux-devtools-dock-monitor';
|
||||||
|
|
||||||
|
export default createDevTools(
|
||||||
|
<DockMonitor toggleVisibilityKey='ctrl-h' changePositionKey='ctrl-q' defaultIsVisible={false}>
|
||||||
|
<LogMonitor theme='tomorrow' />
|
||||||
|
</DockMonitor>
|
||||||
|
);
|
||||||
|
|
||||||
@@ -0,0 +1,30 @@
|
|||||||
|
import React from 'react';
|
||||||
|
import ReactDOM from 'react-dom';
|
||||||
|
import { Provider } from 'react-redux';
|
||||||
|
import { createStore, applyMiddleware, compose } from 'redux';
|
||||||
|
import thunk from 'redux-thunk';
|
||||||
|
|
||||||
|
import DevTools from './dev_tools.jsx';
|
||||||
|
import App from './components/app.jsx';
|
||||||
|
|
||||||
|
import reducer from './reducers/reducer.jsx';
|
||||||
|
|
||||||
|
var store = createStore(
|
||||||
|
reducer,
|
||||||
|
{}, //initial state
|
||||||
|
compose(
|
||||||
|
applyMiddleware(thunk),
|
||||||
|
DevTools.instrument()
|
||||||
|
)
|
||||||
|
);
|
||||||
|
|
||||||
|
//start the process
|
||||||
|
ReactDOM.render(
|
||||||
|
<Provider store={store}>
|
||||||
|
<div>
|
||||||
|
<App />
|
||||||
|
<DevTools />
|
||||||
|
</div>
|
||||||
|
</Provider>,
|
||||||
|
document.querySelector("#root")
|
||||||
|
);
|
||||||
@@ -0,0 +1,14 @@
|
|||||||
|
import { ACTION_NAME } from "../actions/actions.jsx";
|
||||||
|
|
||||||
|
const initialState = {};
|
||||||
|
|
||||||
|
export default function reducer(state = initialState, action) {
|
||||||
|
switch(action.type) {
|
||||||
|
case ACTION_NAME:
|
||||||
|
//DO NOTHING
|
||||||
|
return state;
|
||||||
|
|
||||||
|
default:
|
||||||
|
return state;
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,21 @@
|
|||||||
|
module.exports = {
|
||||||
|
entry: './src/index.jsx',
|
||||||
|
output: {
|
||||||
|
path: __dirname + '/public/',
|
||||||
|
filename: 'app.bundle.js'
|
||||||
|
},
|
||||||
|
module: {
|
||||||
|
rules: [
|
||||||
|
{
|
||||||
|
test: /(\.js$|\.jsx$)/,
|
||||||
|
exclude: /(node_modules)/,
|
||||||
|
use: {
|
||||||
|
loader: 'babel-loader',
|
||||||
|
options: {
|
||||||
|
presets: ['@babel/preset-env', '@babel/preset-react']
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
};
|
||||||
Reference in New Issue
Block a user