most minimalistic website

This commit is contained in:
Arwed Mett 2017-07-23 17:24:59 +02:00
parent eefa0ad1cd
commit 385a7ed976
16 changed files with 3144 additions and 514 deletions

View File

@ -1,5 +1,5 @@
{ {
"presets": ["es2016", "stage-0"], "presets": ["es2015", "stage-0"],
"plugins": [ "plugins": [
"babel-plugin-transform-flow-strip-types", "babel-plugin-transform-flow-strip-types",
"babel-plugin-inferno" "babel-plugin-inferno"

View File

@ -1 +1 @@
55252 64726

Binary file not shown.

After

Width:  |  Height:  |  Size: 260 KiB

264
build/homepage.js Normal file

File diff suppressed because one or more lines are too long

Binary file not shown.

After

Width:  |  Height:  |  Size: 260 KiB

64
build/static/index.html Normal file
View File

@ -0,0 +1,64 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Homepage - Arwed Mett</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://use.fontawesome.com/db680ffedc.js"></script>
<style>
/* http://meyerweb.com/eric/tools/css/reset/
v2.0 | 20110126
License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
</style>
</head>
<body>
<div id="content"></div>
<script src="index.bundle.js"></script>
</body>
</html>

File diff suppressed because one or more lines are too long

3171
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -1,8 +1,8 @@
{ {
"name": "chat-client", "name": "homepage",
"version": "1.0.0", "version": "0.0.1",
"description": "A simple fast chat client.", "description": "My Homepage",
"main": "index.js", "main": "build/homepage.js",
"scripts": { "scripts": {
"test": "npm run lint && npm run flow && npm run mocha", "test": "npm run lint && npm run flow && npm run mocha",
"start": "webpack-dev-server --env development", "start": "webpack-dev-server --env development",
@ -13,10 +13,6 @@
"lint": "eslint src", "lint": "eslint src",
"prepublish": "in-publish && npm run clean && npm run test && npm run build || not-in-publish" "prepublish": "in-publish && npm run clean && npm run test && npm run build || not-in-publish"
}, },
"repository": {
"type": "git",
"url": "git@metthub.de:chat-frontend"
},
"author": "Arwed Mett", "author": "Arwed Mett",
"license": "MIT", "license": "MIT",
"devDependencies": { "devDependencies": {
@ -46,6 +42,7 @@
}, },
"dependencies": { "dependencies": {
"babel-polyfill": "^6.23.0", "babel-polyfill": "^6.23.0",
"express": "^4.15.3",
"inferno": "^3.3.1", "inferno": "^3.3.1",
"inferno-compat": "^3.6.4", "inferno-compat": "^3.6.4",
"inferno-router": "^3.3.1", "inferno-router": "^3.3.1",

View File

@ -1,11 +1,10 @@
//@flow //@flow
import Inferno from "inferno" import Inferno from "inferno"
import { Header, Projects } from "../components" import { Header, Projects } from "./components"
import { Body, Section } from "../elements" import { Body, Section } from "./elements"
import { ThemeProvider } from "styled-components" import { ThemeProvider } from "styled-components"
import { Dark } from "../themes" import { Dark } from "./themes"
export default () => <ThemeProvider theme={ Dark }> export default () => <ThemeProvider theme={ Dark }>
<Body> <Body>

View File

@ -59,6 +59,6 @@
</head> </head>
<body> <body>
<div id="content"></div> <div id="content"></div>
<script src="index.bundle.js"></script> <script src="runtime.bundle.js"></script>
</body> </body>
</html> </html>

View File

@ -1,16 +1,3 @@
//@flow //@flow
import "./index.html" export { default as App } from "./app"
import "babel-polyfill" export { default as default } from "./router"
import Inferno from "inferno"
import { Router, Route, IndexRoute } from "inferno-router"
import createBrowserHistory from "history/createBrowserHistory"
import { App } from "./views"
const browserHistory = createBrowserHistory()
const routes = <Router history={ browserHistory }>
<IndexRoute component={ App } />
</Router>
Inferno.render(routes, document.getElementById("content"))

15
src/router.js Normal file
View File

@ -0,0 +1,15 @@
//@flow
import { Router } from "express"
import path from "path"
const router = new Router
router.get("/runtime.bundle.js", (req, res) => {
res.sendFile(path.resolve("./runtime.bundle.js"))
})
router.get("/", (req, res) => {
res.sendFile(path.resolve("./index.html"))
})
export default router

16
src/runtime.js Normal file
View File

@ -0,0 +1,16 @@
//@flow
import "./index.html"
import "babel-polyfill"
import Inferno from "inferno"
import { Router, Route, IndexRoute } from "inferno-router"
import createBrowserHistory from "history/createBrowserHistory"
import App from "./app"
const browserHistory = createBrowserHistory()
const routes = <Router history={ browserHistory }>
<IndexRoute component={ App } />
</Router>
Inferno.render(routes, document.getElementById("content"))

View File

@ -1,3 +0,0 @@
//@flow
export { default as App } from "./app"

View File

@ -3,9 +3,6 @@ const webpack = require("webpack")
const baseConfig = { const baseConfig = {
entry: {
index: path.resolve("src/index.js")
},
output: { output: {
path: path.resolve(__dirname, "./build"), path: path.resolve(__dirname, "./build"),
filename: "[name].bundle.js", filename: "[name].bundle.js",
@ -17,7 +14,6 @@ const baseConfig = {
"react-dom": "inferno-compat" "react-dom": "inferno-compat"
} }
}, },
devtool: "source-map",
module: { module: {
rules: [ rules: [
{ {
@ -50,15 +46,44 @@ const baseConfig = {
] ]
} }
] ]
}, }
plugins: [
new webpack.HotModuleReplacementPlugin(),
]
} }
const productionConfig = () => baseConfig
const developmentConfig = () => Object.assign({ }, baseConfig, { // targets
const runtime = () => Object.assign({ }, baseConfig, {
entry: {
runtime: path.resolve("src/runtime.js")
},
output: {
path: path.resolve("build/static"),
filename: "[name].bundle.js",
sourceMapFilename: "[file].map"
}
})
const index = () => Object.assign({ }, baseConfig, {
target: "node",
entry: {
index: path.resolve("src/index.js")
},
output: {
path: path.resolve("build"),
filename: "homepage.js",
sourceMapFilename: "homepage.map",
library: "homepage",
libraryTarget: "umd"
}
})
// decorators
const production = config => Object.assign({ }, config(), {
plugins: [
new webpack.optimize.UglifyJsPlugin
]
})
const development = config => Object.assign({ }, config(), {
devServer: { devServer: {
historyApiFallback: true, historyApiFallback: true,
stats: 'errors-only', stats: 'errors-only',
@ -69,13 +94,17 @@ const developmentConfig = () => Object.assign({ }, baseConfig, {
overlay: true, overlay: true,
hot: true, hot: true,
contentBase: path.resolve(__dirname, "build") contentBase: path.resolve(__dirname, "build")
} },
devtool: "source-map",
plugins: [
new webpack.HotModuleReplacementPlugin(),
]
}) })
module.exports = env => { module.exports = env => {
if (env === 'production') { if (env === 'production') {
return productionConfig(); return [production(runtime), production(index)]
} }
return developmentConfig(); return development(runtime)
} }