diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
index 97ec81a9c..0414c88f3 100644
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -59,6 +59,8 @@ ads: false # Add this to disable ads
weight: -5 # lower number = higher in related posts list
deprecated: true # Don't show in related posts
prism_languages: [vim] # Extra syntax highlighting
+intro: |
+ This is some *Markdown* at the beginning of the article.
tags:
- WIP
- Featured
diff --git a/_layouts/2017/sheet.html b/_layouts/2017/sheet.html
index b4112a42e..f76c43ebc 100644
--- a/_layouts/2017/sheet.html
+++ b/_layouts/2017/sheet.html
@@ -27,6 +27,12 @@
{% endif %}
+ {% if page.intro %}
+
+ {{ page.intro | markdownify }}
+
+ {% endif %}
+
{{ content }}
diff --git a/_sass/2017/components/intro-content.scss b/_sass/2017/components/intro-content.scss
new file mode 100644
index 000000000..b71d2c2a6
--- /dev/null
+++ b/_sass/2017/components/intro-content.scss
@@ -0,0 +1,18 @@
+/*
+ * A prelude/intro to the article
+ */
+
+.intro-content {
+ // Horizontal line, but I don't like how it looks!
+ // &::before {
+ // content: '';
+ // display: block;
+ // margin-bottom: 16px;
+ // height: 1px;
+ // background: linear-gradient(to right, $dark-line-color, transparent 50%);
+
+ // @media (min-width: 769px) {
+ // margin-bottom: 32px;
+ // }
+ // }
+}
diff --git a/_sass/2017/style.scss b/_sass/2017/style.scss
index fa72cfdc5..751beddcf 100644
--- a/_sass/2017/style.scss
+++ b/_sass/2017/style.scss
@@ -30,6 +30,7 @@
@import './components/h3-section-list';
@import './components/headline-ad';
@import './components/home-button';
+@import './components/intro-content';
@import './components/main-heading';
@import './components/missing-message';
@import './components/notice-box';
diff --git a/camp.md b/camp.md
new file mode 100644
index 000000000..442e087de
--- /dev/null
+++ b/camp.md
@@ -0,0 +1,129 @@
+---
+title: Camp
+layout: 2017/sheet
+category: JavaScript libraries
+updated: 2017-09-21
+weight: -1
+intro: |
+ [Camp](https://github.com/espadrine/sc/) is a Node.js web server framework. This guide targets Camp v17.x.
+---
+
+Getting started
+---------------
+{: .-three-column}
+
+### Quick start
+{: .-prime}
+
+```js
+// app.js
+const Camp = require('camp')
+const camp = Camp.start({ port: 1234 })
+```
+
+```html
+
+
+Hello world!
+```
+
+Camp serves files in `web/` by default.
+
+### Routes
+
+```js
+// /search?q=rainbows
+camp.path('/search', (req, res) => {
+ const q = res.query.q
+ res.json({ results: ··· })
+})
+```
+{: data-line="2"}
+
+Also available: `camp.post`, `camp.get`.
+
+### Templates
+
+```js
+const tpl = Camp.template('./templates/post.html')
+
+camp.path('/blog/:post.html', (req, res) => {
+ res.template({
+ text: 'Hello world'
+ }, tpl)
+})
+```
+{: data-line="1,4"}
+
+See: [Templates](https://github.com/espadrine/sc/blob/master/doc/Readme.md#templates)
+
+### Not found
+
+```js
+camp.notFound('/*.lol', (req, res) => {
+ res.file('/404.html')
+})
+```
+{: data-line="1"}
+
+See: [Fall through](https://github.com/espadrine/sc/blob/master/doc/Readme.md#fall-through)
+
+### Low level handler
+
+```js
+camp.handle((req, res, next) => {
+ res.setHeader('X-Hello', 'world')
+ next()
+})
+```
+{: data-line="1"}
+
+See: [Handlers](https://github.com/espadrine/sc/blob/master/doc/Readme.md#handlers)
+
+Templates
+---------
+
+### Basic templates
+
+```js
+const tpl = Camp.template('/templates/post.html')
+
+camp.path('/blog/:post.html', (req, res) => {
+ res.template({
+ text: 'Hello world'
+ }, tpl)
+})
+```
+{: data-line="1,4,5,6"}
+
+### Implicit templates
+
+```js
+camp.path('blog.html')
+```
+
+Uses `blog.html` as a template.
+
+See: [Templates](https://github.com/espadrine/sc/blob/master/doc/Readme.md#templates)
+
+Advanced features
+-----------------
+
+### Web sockets
+
+```js
+camp.ws('/path', (socket) => { ··· })
+```
+
+```js
+camp.wsChannels[path]
+```
+
+```js
+camp.wsBroadcast('/path', (req, res) => {
+})
+```
+
+Sorry I don't completely understand this yet, but check it out in their docs.
+
+See: [WebSocket](https://github.com/espadrine/sc/blob/master/doc/Readme.md#websocket)