camp: add cheatsheet for node.js web server framework
This commit is contained in:
Rico Sta. Cruz
parent
72cb1f9b78
commit
39ed6150ed
|
|
@ -59,6 +59,8 @@ ads: false # Add this to disable ads
|
||||||
weight: -5 # lower number = higher in related posts list
|
weight: -5 # lower number = higher in related posts list
|
||||||
deprecated: true # Don't show in related posts
|
deprecated: true # Don't show in related posts
|
||||||
prism_languages: [vim] # Extra syntax highlighting
|
prism_languages: [vim] # Extra syntax highlighting
|
||||||
|
intro: |
|
||||||
|
This is some *Markdown* at the beginning of the article.
|
||||||
tags:
|
tags:
|
||||||
- WIP
|
- WIP
|
||||||
- Featured
|
- Featured
|
||||||
|
|
|
||||||
|
|
@ -27,6 +27,12 @@
|
||||||
</aside>
|
</aside>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
|
||||||
|
{% if page.intro %}
|
||||||
|
<div class='intro-content MarkdownBody'>
|
||||||
|
{{ page.intro | markdownify }}
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
|
||||||
<main class='post-content MarkdownBody' data-js-main-body>
|
<main class='post-content MarkdownBody' data-js-main-body>
|
||||||
{{ content }}
|
{{ content }}
|
||||||
</main>
|
</main>
|
||||||
|
|
|
||||||
|
|
@ -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;
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
}
|
||||||
|
|
@ -30,6 +30,7 @@
|
||||||
@import './components/h3-section-list';
|
@import './components/h3-section-list';
|
||||||
@import './components/headline-ad';
|
@import './components/headline-ad';
|
||||||
@import './components/home-button';
|
@import './components/home-button';
|
||||||
|
@import './components/intro-content';
|
||||||
@import './components/main-heading';
|
@import './components/main-heading';
|
||||||
@import './components/missing-message';
|
@import './components/missing-message';
|
||||||
@import './components/notice-box';
|
@import './components/notice-box';
|
||||||
|
|
|
||||||
|
|
@ -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
|
||||||
|
<!-- web/index.html -->
|
||||||
|
<!doctype html>
|
||||||
|
<body>Hello world!</body>
|
||||||
|
```
|
||||||
|
|
||||||
|
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)
|
||||||
Loading…
Reference in New Issue