Skip to content

Commit 0fe78b0

Browse files
committed
Setting up initial layout
1 parent 5630534 commit 0fe78b0

File tree

9 files changed

+432
-19
lines changed

9 files changed

+432
-19
lines changed

.eleventy.js

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
module.exports = function(eleventyConfig) {
2+
eleventyConfig.addPassthroughCopy("css");
3+
eleventyConfig.addLayoutAlias("default", "default.njk");
4+
return {
5+
passthroughFileCopy: true
6+
};
7+
};

_includes/default.njk

Lines changed: 57 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,64 @@ title: OpenJS NodeJS Application Developer Study Guide
77
<meta charset="utf-8">
88
<meta name="viewport" content="width=device-width, initial-scale=1.0">
99
<title>{{ title }}</title>
10+
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Roboto:300,300italic,700,700italic">
11+
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.css">
12+
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/milligram/1.3.0/milligram.css">
13+
<link rel="stylesheet" href="/css/main.css">
14+
<link rel="stylesheet"
15+
href="//cdn.jsdelivr.net/gh/highlightjs/cdn-release@9.16.2/build/styles/default.min.css">
16+
<script src="//cdn.jsdelivr.net/gh/highlightjs/cdn-release@9.16.2/build/highlight.min.js"></script>
17+
<script>hljs.initHighlightingOnLoad();</script>
1018
</head>
1119
<body>
12-
{{ content | safe }}
20+
<header class="container">
21+
<div class="row">
22+
<div class="column column-50">
23+
<h1 class="logo"><a href="/">ONAD Study Guide</a></h1>
24+
</div>
25+
<div class="top-links column column-50">
26+
<ul>
27+
<li><a href="https://training.linuxfoundation.org/certification/jsnad/" target="_blank" title="OpenJS Node.js Application Developer (JSNAD)">JSNAD Certification</a></li>
28+
</ul>
29+
</div>
30+
</div>
31+
</header>
32+
<main class="container">
33+
<div class="row">
34+
<div class="sidebar column">
35+
<nav>
36+
<ul>
37+
<li><a href="#" {% if page.url === '/buffer/' %} class="current" {% endif %}>Buffer and Streams</a></li>
38+
<li><a href="#">Control flow</a></li>
39+
<li><a href="#">Child Processes</a></li>
40+
<li><a href="#">Diagnostics</li>
41+
<li><a href="#">Error Handling</a></li>
42+
<li><a href="#">Node.js CLI</a></li>
43+
<li><a href="/events" {% if page.url === '/events/' %} class="current" {% endif %}>Events</li>
44+
<li><a href="#">File System</a></li>
45+
<li><a href="#">JavaScript Prerequisites</a></li>
46+
<li><a href="#">Module system</a></li>
47+
<li><a href="#">Process/Operating System</a></li>
48+
<li><a href="#">Package.json</a></li>
49+
<li><a href="#">Unit Testing</a></li>
50+
</ul>
51+
</nav>
52+
</div>
53+
<div class="main-content column column-75">
54+
<h1>{{ title }}</h1>
55+
56+
{{ content | safe }}
57+
</div>
58+
</div>
59+
</main>
60+
<footer class="container">
61+
<div class="row">
62+
<div class="column column-75 column-offset-25">
63+
<p>&copy; NearForm Ltd.<p>
64+
<p><a href="https://github.com/jjmax75/openjs-nodejs-application-developer-study-guide/tree/master/{{ page.inputPath }}">Edit this page on GitHub</a></p>
65+
</div>
66+
</div>
67+
68+
</footer>
1369
</body>
1470
</html>

cheatsheet/index.md

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,9 @@
1-
# Node Cheat Sheet
1+
---
2+
layout: default.njk
3+
title: Node Cheat Sheet
4+
---
25

3-
# <a name="Events"></a>Events
6+
## [Events](#events)
47

58
Class: events.EventEmitter
69

css/main.css

Lines changed: 71 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,71 @@
1+
body {
2+
color: #333;
3+
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica,
4+
Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
5+
font-size: 18px;
6+
}
7+
8+
main h1 {
9+
color: #80bd01;
10+
}
11+
12+
a {
13+
color: #80bd01;
14+
font-weight: bold;
15+
}
16+
17+
a:hover {
18+
color: #4d7000;
19+
font-weight: bold;
20+
}
21+
22+
.top-links {
23+
text-align: right;
24+
}
25+
26+
.top-links ul {
27+
margin: 2rem 0;
28+
}
29+
30+
.top-links li {
31+
list-style: none;
32+
display: inline-block;
33+
}
34+
35+
.sidebar {
36+
margin: 2rem;
37+
}
38+
39+
.main-content {
40+
margin: 2rem;
41+
}
42+
43+
.logo {
44+
font-size: 22px;
45+
margin: 2rem 0;
46+
}
47+
48+
.logo a {
49+
color: #888;
50+
}
51+
52+
.logo a:hover {
53+
color: #80bd01;
54+
}
55+
56+
.sidebar li {
57+
list-style: none;
58+
}
59+
60+
.sidebar a {
61+
color: #888;
62+
font-weight: normal;
63+
}
64+
65+
.sidebar a.current {
66+
color: #80bd01;
67+
}
68+
69+
.sidebar a:hover {
70+
color: #80bd01;
71+
}

events/index.md

Lines changed: 9 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,9 @@
11
---
22
layout: default.njk
33
title: Events
4+
url: events
45
---
56

6-
# Events
7-
87
The Node.js core API is built around the idea of events being "emitted" and "listened" to. Objects called "emitters" emit _named_ events, that are picked up by "listener" functions.
98

109
Objects that emit events extend the `EventEmitter` class. These objects expose an `on` method that allows one or more functions to be attached to named events emitted by the object.
@@ -15,23 +14,23 @@ When the EventEmitter object emits an event, all of the functions attached to th
1514

1615
This example creates an event listener for `foo` events, and an event emitter to fire these events.
1716

18-
```
19-
const { EventEmitter } = require('events');
17+
```javascript
18+
const { EventEmitter } = require("events");
2019

2120
// create a listener function. These can be arrow functions, but will
2221
// loose `this` refering to the EventEmitter object
2322
const foo = function foo() {
24-
console.log('foo executed.', this)
25-
}
23+
console.log("foo executed.", this);
24+
};
2625

2726
// create an emitter and bind some events to it
28-
const eventEmitter = new EventEmitter()
27+
const eventEmitter = new EventEmitter();
2928

3029
// Bind the connection event with the listner1 function
31-
eventEmitter.on('foo', foo)
30+
eventEmitter.on("foo", foo);
3231

3332
// fire the event
34-
eventEmitter.emit('foo')
33+
eventEmitter.emit("foo");
3534
```
3635

3736
## Passing parameters
@@ -64,4 +63,4 @@ Imagine we are building a SaaS that does a number of things when a user creates
6463
is created, we want to emit a `userCreated` event. One of the listeners for this will email a confirmation
6564
email to that user.
6665

67-
Build an event emitter to simulate the `userCreated` event, and an event listener that sends a confirmation email. There is a mock emailer class in the folder that has a method `send`, which expects an email address and a message body as the parameters.
66+
Build an event emitter to simulate the `userCreated` event, and an event listener that sends a confirmation email. There is a mock emailer class in the folder that has a method `send`, which expects an email address and a message body as the parameters.

index.md

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,12 +3,9 @@ layout: default.njk
33
title: OpenJS NodeJS Application Developer Study Guide
44
---
55

6-
# {{title}}
7-
86
TODO:
97

108
- Set out the purpose here and list the sections with links
119
- Styling and update the default template
1210

13-
14-
[Events](/events)
11+
[Events](/events)

package.json

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,9 @@
33
"version": "1.0.0",
44
"description": "OpenJS Node application developer study guide",
55
"scripts": {
6-
"start": "eleventy --serve",
7-
"deploy": "gh-pages -d _site"
6+
"start": "eleventy --serve --input=. --output=_site",
7+
"build": "eleventy --config=.eleventy-deploy.js",
8+
"deploy": "npm run build && gh-pages -d _site/_eleventy_redirect"
89
},
910
"repository": {
1011
"type": "git",

readme.md

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -19,3 +19,7 @@ Then run `npm start`. You can access your site on [localhost:8080](http://localh
1919
TODO: Use Github pages deployment for 11ty (from the generated \_site folder)
2020

2121
[Events](/events/events.md)
22+
23+
## Styling
24+
25+
The base theme for this site is provided by [Milligram](https://milligram.io) with custom theming.

0 commit comments

Comments
 (0)