Skip to content
Permalink
Browse files

Add handlebars and configure routes

  • Loading branch information...
nlaz committed Feb 25, 2019
1 parent 2203eaa commit 0592c281e734e67e4347e6bcf2ef3617b5ff20be
@@ -0,0 +1,5 @@
{
"rules": {
"max-len": [1, 120, 2]
}
}
@@ -1,19 +1,21 @@
node_modules
npm-debug.log
package-lock.json
yarn.lock
# See https://help.github.com/ignore-files/ for more about ignoring files.

test
temp*
# dependencies
/node_modules

.env
# testing
/coverage

.DS_Store
.AppleDouble
.LSOverride
# production
/build

# local scripts
/local

### IDE Settings (EditorConfig/Sublime)
.editorconfig
# misc
.DS_Store
.env

### IDE Settings (VSCode)
.vscode
npm-debug.log*
yarn-debug.log*
yarn-error.log*
@@ -1,6 +1,6 @@
# Introduction

This is a hackathon boilerplate for new Nodejs applications created by [Major League Hacking][mlh-github]. It is for hackers looking to get started quickly on a new hackathon project using the Nodejs environment.
This is a hackathon boilerplate for new Node.js applications created by [Major League Hacking][mlh-github]. It is for hackers looking to get started quickly on a new hackathon project using the Node.js environment.

# Code of Conduct

@@ -3,7 +3,7 @@ const express = require("express");
const router = express.Router();

router.get("/", function(req, res) {
// TODO
res.render("home/index");
});

module.exports = router;
@@ -1,5 +1,5 @@
const auth = require("./auth");
const guides = require("./guides");
const tutorial = require("./tutorial");
const home = require("./home");

module.exports = { auth, guides, home };
module.exports = { auth, tutorial, home };
File renamed without changes.
@@ -1,17 +1,25 @@
const express = require("express");
const bodyParser = require("body-parser");
const compression = require("compression");
const handlebars = require("express-handlebars");

const config = require("../config");
const paths = require("../config/paths");
const { registerRoutes, registerErrorHandlers } = require("./routes");

const app = express();

app.use(compression());
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));
app.use(express.static(paths.staticEntry));

app.engine("html", handlebars({ defaultLayout: "layout", extname: ".html" }));
app.set("views", "app/templates");
app.set("view engine", "html");

registerRoutes(app);
registerErrorHandlers(app);
// registerErrorHandlers(app);

app.listen(config.port, () => {
console.log(`🚀 Server started on port ${config.port}.`);
@@ -4,7 +4,7 @@ const config = require("../config");
module.exports.registerRoutes = app => {
app.use("/", controllers.home);
app.use("/auth", controllers.auth);
app.use("/guides", controllers.guide);
app.use("/tutorial", controllers.tutorial);
};

module.exports.registerErrorHandlers = app => {
@@ -0,0 +1,44 @@
/* colors.css - A stylesheet for custom color classes */
/* Colors came from Primer CSS */

/* Classes for changing background colors */
.bg-white { background-color: #ffffff; }
.bg-blue { background-color: #0366d6; }
.bg-blue-light { background-color: #f1f8ff; }
.bg-gray-dark { background-color: #24292e; }
.bg-gray { background-color: #f6f8fa; }
.bg-gray-light { background-color: #fafbfc; }
.bg-green { background-color: #28a745; }
.bg-green-light { background-color: #dcffe4; }
.bg-red { background-color: #d73a49; }
.bg-red-light { background-color: #ffdce0; }
.bg-yellow { background-color: #ffd33d; }
.bg-yellow-light { background-color: #fff5b1; }
.bg-purple { background-color: #6f42c1; }
.bg-purple-light { background-color: #f5f0ff; }

/* Classes for changing text colors */
.text-blue { color: #0366d6; }
.text-red { color: #cb2431; }
.text-gray-light { color: #6a737d; }
.text-gray { color: #586069; }
.text-gray-dark { color: #24292e; }
.text-green { color: #28a745; }
.text-orange { color: #a04100; }
.text-orange-light { color: #e36209; }
.text-purple { color: #6f42c1; }
.text-white { color: #ffffff; }
.text-inherit { color: inherit; }

/* Classes for changing border colors */
.border-blue { border-color: #0366d6 !important; }
.border-blue-light { border-color: #c8e1ff !important; }
.border-green { border-color: #34d058 !important; }
.border-green-light { border-color: #a2cbac !important; }
.border-red { border-color: #d73a49 !important; }
.border-red-light { border-color: #cea0a5 !important; }
.border-purple { border-color: #6f42c1 !important; }
.border-yellow { border-color: #d9d0a5 !important; }
.border-gray-light { border-color: #eaecef !important; }
.border-gray-dark { border-color: #d1d5da !important; }
.border-black-fade { border-color: rgba(27, 31, 35, 0.15); }
@@ -0,0 +1,17 @@
/* Custom stylesheet */

.nav-link:hover {
color: inherit;
text-decoration: none;
opacity: .75;
}

.link-reset:hover {
color: inherit;
text-decoration: none;
}

.octicon {
display: inline-block;
vertical-align: text-top;
}
Binary file not shown.
Binary file not shown.
@@ -0,0 +1,3 @@
<div>
<h4>Errors</h4>
</div>
@@ -0,0 +1,16 @@
<div class="bg-gray-light border-bottom border-gray-light">
<div class="container text-center py-5 mb-4">
<img src="img/logo.png" class="w-100" style="max-width:120px;" />
<div class="mt-3 mb-4">
<h1 class="h1 mb-0">Hackathon Flask Starter</h1>
<h2 class="h4 text-gray font-weight-light">Build your hackathon project faster.</h2>
</div>
<a class="btn btn-primary mt-2" href="https://github.com/MLH/mlh-hackathon-nodejs-starter"> Check the Docs </a>
</div>
</div>

<div class="text-gray-light text-center py-5 my-5">
<p class="lead">Edit <code>controllers/</code> to update how to receive and reply to requests.</p>
<p class="lead">Edit <code>templates/</code> to update the layout and styling.</p>
<p class="lead">Edit <code>models/</code> to update how the data is stored.</p>
</div>
@@ -0,0 +1,22 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>My Hackathon Project</title>
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
<link rel="shortcut icon" href="favicon.ico" />
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" />
<link rel="stylesheet" href="css/colors.css" />
<link rel="stylesheet" href="css/style.css" />
</head>
<body>
{{> header }}
{{{ body }}}
{{> footer }}

<!-- Scripts for Bootstrap -->
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
</body>
</html>
@@ -0,0 +1 @@
{{! Add a footer here if you like }}
@@ -0,0 +1,40 @@
<nav class="navbar navbar-expand-lg navbar-dark bg-gray-dark text-white">
<div class="container">
<a class="text-white link-reset text-inherit pr-3" href="/"> My Hackathon Project </a>
<button
class="navbar-toggler"
type="button"
data-toggle="collapse"
data-target="#navbarSupportedContent"
aria-controls="navbarSupportedContent"
aria-expanded="false"
aria-label="Toggle navigation"
>
<span class="navbar-toggler-icon"></span>
</button>

<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav ml-auto">
<li class="nav-item dropdown">
<a
class="nav-link dropdown-toggle"
href="#"
id="navbarDropdown"
role="button"
data-toggle="dropdown"
aria-haspopup="true"
aria-expanded="false"
>
Tutorials
</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
<a class="dropdown-item" href="/requesting">Requesting Data</a>
</div>
</li>
<li class="nav-item">
<a class="nav-link text-inherit" href="/auth/login/github"> Login with GitHub </a>
</li>
</ul>
</div>
</div>
</nav>
@@ -0,0 +1 @@
<h4>Tutorial</h4>
@@ -0,0 +1,9 @@
const path = require("path");
const fs = require("fs");

const appDirectory = fs.realpathSync(process.cwd());
const resolveApp = relativePath => path.resolve(appDirectory, relativePath);

module.exports = {
staticEntry: resolveApp("app/static")
};
@@ -11,6 +11,7 @@
"body-parser": "^1.18.3",
"compression": "^1.7.3",
"dotenv": "^6.2.0",
"express": "^4.16.4"
"express": "^4.16.4",
"express-handlebars": "^3.0.2"
}
}
Oops, something went wrong.

0 comments on commit 0592c28

Please sign in to comment.
You can’t perform that action at this time.