Initial

Author: PaulBGD

.gitignore

@@ -0,0 +1,2 @@
+.idea/
+*.iml

README.md

@@ -0,0 +1,43 @@
+# Devathon Website
+
+## Client
+
+The client code is written in Svelte, which is compiled before it's downloaded.
+
+### Scripts
+
+Build for production:
+
+```bash
+npm run build
+```
+
+Watch for development:
+
+```bash
+npm run dev
+```
+
+## Server
+
+The server code is written in TypeScript, using the Express framework for routing.
+In the future the server will use svelte-ssr to prerender our components.
+
+### Setup
+
+In order to run the server, you must copy `server/config/config.default.ts` to `config.ts`.
+
+### Scripts
+
+Run production:
+
+```bash
+npm run build # run this every time you pull
+npm run run
+```
+
+Run development:
+
+```bash
+npm run dev
+```

client/.gitignore

@@ -0,0 +1,3 @@
+node_modules/
+npm-debug.log
+build/

client/components/header/header-main.html

@@ -0,0 +1,3 @@
+<div class="header">
+    {{yield}}
+</div>

client/components/header/header.html

@@ -0,0 +1,24 @@
+{
+  "name": "client",
+  "version": "1.0.0",
+  "description": "",
+  "main": "index.js",
+  "scripts": {
+    "dev": "export PRODUCTION=; export WATCH=true; node rollup.js",
+    "build": "export PRODUCTION=true; export WATCH=; node rollup.js"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "dependencies": {
+    "rollup": "^0.36.4",
+    "rollup-plugin-commonjs": "^5.0.5",
+    "rollup-plugin-node-resolve": "^2.0.0",
+    "rollup-plugin-replace": "^1.1.1",
+    "rollup-plugin-svelte": "^1.0.0",
+    "rollup-pluginutils": "^1.5.2"
+  },
+  "devDependencies": {
+    "rollup-watch": "^2.5.0"
+  }
+}

client/package.json

@@ -0,0 +1,50 @@
+const rollup = require('rollup');
+const svelte = require('rollup-plugin-svelte');
+const replace = require('rollup-plugin-replace');
+const resolve = require('rollup-plugin-node-resolve');
+const common = require('rollup-plugin-commonjs');
+
+const routes = [
+    'home'
+];
+
+function getOptions(route) {
+    const plugins = [
+        svelte()
+    ];
+    if (!process.env.PRODUCTION) {
+        // plugins.push(replace({
+        // }));
+    }
+    plugins.push(resolve({
+        include: ['node_modules/**'],
+        jsnext: true,
+        main: true,
+        browser: true
+    }));
+    plugins.push(common({
+        include: ['node_modules/**']
+    }));
+    return {
+        entry: `routes/${route}/index.js`,
+        dest: `build/${route}.js`,
+        format: 'iife',
+        sourceMap: true,
+        plugins,
+    };
+}
+
+if (process.env.WATCH) {
+    const watch = require('rollup-watch');
+    routes.forEach(route => {
+        watch(rollup, getOptions(route))
+            .on('event', event => console.log(`routes/${route}: ${event.code} ${event.error ? event.error : ''}`))
+    })
+} else {
+    routes.forEach(route => {
+        rollup.rollup(getOptions(route))
+            .then(bundle => bundle.write(getOptions(route)))
+            .catch(err => console.error(`Failed to compile route ${route}`, err));
+    });
+}
+

client/rollup.js

@@ -0,0 +1,13 @@
+<Header>
+    <h1>Wow!</h1>
+</Header>
+
+<script>
+    import Header from '../../components/header/header.html';
+
+    export default {
+        components: {
+            Header
+        }
+    }
+</script>

client/routes/common.js

@@ -0,0 +1,9 @@
+import '../common';
+import Home from './home.html';
+
+new Home({
+    target: document.getElementById('container'),
+    data: {
+        world: 'World'
+    }
+});

client/routes/home/home.html

@@ -0,0 +1,50 @@
+body, html, #container {
+    height: 100%;
+}
+
+body {
+    margin: 0;
+}
+
+h1, h2, h3, h4, h5, a {
+    font-family: 'Roboto Slab', serif;
+    margin: 0;
+}
+
+h1 {
+    padding-top: 10px;
+    padding-bottom: 20px;
+}
+
+p, b, i, li, label, small, span {
+    font-family: 'Roboto', serif;
+    font-size: 20px;
+}
+
+small, span {
+    font-size: 12px;
+}
+
+a {
+    color: #DDA0DD;
+}
+
+label {
+    display: block;
+    font-size: 18px;
+}
+
+input, select, button {
+    margin-bottom: 30px;
+    font-size: 28px;
+    width: 100%;
+    box-sizing: border-box;
+}
+
+button {
+    padding: 4px 6px;
+}
+
+img {
+    max-width: 100%;
+}

client/routes/home/index.js

@@ -0,0 +1,5 @@
+node_modules/
+npm-debug.log
+
+config/config.ts
+build/

client/styles/common.css

@@ -0,0 +1,4 @@
+export default {
+    port: 3000,
+    host: '127.0.0.1'
+};

server/.gitignore

@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>Devathon</title>
+    <link href="https://fonts.googleapis.com/css?family=Roboto+Slab|Roboto" rel="stylesheet">
+    <link rel="stylesheet" href="/public/css/common.css"/>
+    CSSSTUFF
+</head>
+<body>
+<div id="container">
+
+</div>
+JSSTUFF
+</body>
+</html>

server/config/config.default.ts

@@ -0,0 +1,19 @@
+import {install} from 'source-map-support';
+import * as express from 'express';
+import {Express} from 'express';
+import * as serveStatic from 'serve-static';
+
+import pages from './src/routes/pages';
+
+import config from './config/config';
+
+install();
+
+const app: Express = express();
+
+app.use('/public/js', serveStatic('../client/build'));
+app.use('/public/css', serveStatic('../client/styles'));
+
+app.use(pages);
+
+app.listen(config.port, config.host, () => console.log(`Listening on ${config.host}:${config.port}`));

server/index.html

@@ -0,0 +1,25 @@
+{
+  "name": "server",
+  "version": "1.0.0",
+  "description": "",
+  "main": "index.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1",
+    "build": "tsc",
+    "run": "node build/",
+    "dev": "export DEBUG=Devathon:*; tsc && node build/"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "dependencies": {
+    "@types/express": "^4.0.34",
+    "@types/source-map-support": "^0.2.28",
+    "express": "^4.14.0",
+    "serve-static": "^1.11.1",
+    "source-map-support": "^0.4.6",
+    "svelte": "^1.1.2",
+    "svelte-ssr": "git://github.com/PaulBGD/svelte-ssr.git",
+    "typescript": "2.1.1"
+  }
+}

server/index.ts

@@ -0,0 +1,2 @@
+declare module "svelte-ssr/register" {
+}

server/package.json

@@ -0,0 +1,44 @@
+import {Router, Request, Response, RequestHandler} from 'express';
+import {readFileSync} from 'fs';
+import { join } from 'path';
+import 'svelte-ssr/register';
+
+const router: Router = Router();
+
+const routes: {[key: string]: string[]} = {
+    'home': ['/', '/home']
+};
+
+const compiled: {[key: string]: any} = {};
+
+for (let property in routes) {
+    if (routes.hasOwnProperty(property)) {
+        compiled[property] = require(join(process.cwd(), '../', 'client', 'routes', property, `${property}.html`));
+        registerRoute(property, routes[property]);
+    }
+}
+
+let template: string;
+
+function getTemplate(): string {
+    const path = join(process.cwd(), 'index.html');
+    if (!template || !process.env.PRODUCTION) {
+        return template = readFileSync(path, 'utf8');
+    }
+    return template;
+}
+
+function registerRoute(name: string, routes: string[]) {
+    const handler = (req: Request, res: Response) => {
+        let template: string = getTemplate();
+        template = template.replace('CSSSTUFF', `
+`);
+        template = template.replace('JSSTUFF', `
+<script src="/public/js/${name}.js"></script>
+`);
+        res.end(template);
+    };
+    routes.forEach(route => router.get(route, handler));
+}
+
+export default router;

server/src/definitions/svelte-ssr.d.ts

@@ -0,0 +1,12 @@
+{
+    "compilerOptions": {
+        "module": "commonjs",
+        "target": "es6",
+        "noImplicitAny": true,
+        "sourceMap": true,
+        "outDir": "build"
+    },
+    "exclude": [
+        "node_modules"
+    ]
+}