Skip to content

Commit 1b05952

Browse files
substacksubstack
substack
authored and
substack
committed
webapp example
1 parent 033d1b1 commit 1b05952

File tree

5 files changed

+126
-7
lines changed

5 files changed

+126
-7
lines changed

‎webapp2/count-server.js

+29
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
var http = require('http')
2+
var level = require('level')
3+
var db = level('counter.db')
4+
var count = 0
5+
db.get('count', function (err, value) {
6+
count = Number(value || 0) + count
7+
})
8+
var router = require('routes')()
9+
router.addRoute('GET /', function (req, res, m) {
10+
res.setHeader('content-type', 'text/html')
11+
res.end('<h1>hello</h1>\n'
12+
+ 'you are the ' + (count++) + 'th visitor')
13+
db.put('count', count, function (err) {
14+
if (err) console.error(err)
15+
})
16+
})
17+
router.addRoute('*', function (req, res, m) {
18+
res.statusCode = 404
19+
res.setHeader('content-type', 'text/plain')
20+
res.end('not found\n')
21+
})
22+
23+
var server = http.createServer(function (req, res) {
24+
console.log(req.method, req.url)
25+
var m = router.match(req.method + ' ' + req.url)
26+
if (m) m.fn(req, res, m)
27+
else res.end('error')
28+
})
29+
server.listen(5000)

‎webapp2/main.js

+25
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
var app = require('choo')()
2+
var html = require('choo/html')
3+
var mainpage = require('./mainpage.js')
4+
var xhr = require('xhr')
5+
6+
app.use(function (state, emitter) {
7+
Object.keys(initState).forEach(function (key) {
8+
state[key] = initState[key]
9+
})
10+
emitter.on('sign-guestbook', function (doc) {
11+
xhr({
12+
method: 'POST',
13+
host: location.host,
14+
url: '/guestbook',
15+
headers: { 'content-type': 'application/json' },
16+
body: JSON.stringify(doc)
17+
}, function (err, res, body) {
18+
if (err) console.error(err)
19+
state.messages.push(doc)
20+
emitter.emit('render')
21+
})
22+
})
23+
})
24+
app.route('/', require('./mainpage.js'))
25+
app.mount('body')

‎webapp2/mainpage.js

+31
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
var html = require('choo/html')
2+
3+
module.exports = function (state, emit) {
4+
return html`<body>
5+
<h1>hello</h1>
6+
you are the <span id="count">${state.count++}</span>th visitor
7+
<hr>
8+
<form method="POST" action="/guestbook"
9+
onsubmit=${onsubmit}>
10+
<input type="text" name="name"
11+
placeholder="name">
12+
<textarea name="msg" placeholder="message"></textarea>
13+
<button type="submit">POST</button>
14+
</form>
15+
${state.messages.map(function (doc) {
16+
return html`<div>
17+
<div>${doc.name}</div>
18+
<pre>${doc.msg}</pre>
19+
</div>`
20+
})}
21+
<script>initState = ${JSON.stringify(state)}</script>
22+
<script src="bundle.js"></script>
23+
</body>`
24+
function onsubmit (ev) {
25+
ev.preventDefault()
26+
emit('sign-guestbook', {
27+
name: ev.target.name.value,
28+
msg: ev.target.msg.value
29+
})
30+
}
31+
}

‎webapp2/package.json

+11-1
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,25 @@
11
{
22
"dependencies": {
3+
"bel": "^5.0.0",
4+
"body": "^5.1.0",
35
"browserify": "^14.4.0",
46
"choo": "^5.6.2",
7+
"collect-stream": "^1.2.1",
58
"content-addressable-blob-store": "^4.5.1",
69
"ecstatic": "^2.2.1",
710
"hypercore": "^6.6.3",
811
"hyperdrive": "^9.4.5",
912
"hyperlog": "^4.12.1",
1013
"level": "^1.7.0",
1114
"level-browserify": "^1.1.1",
15+
"pump": "^1.0.2",
1216
"routes": "^2.1.0",
13-
"watchify": "^3.9.0"
17+
"through2": "^2.0.3",
18+
"watchify": "^3.9.0",
19+
"xhr": "^2.4.0"
20+
},
21+
"scripts": {
22+
"build": "browserify main.js > public/bundle.js",
23+
"watch": "watchify main.js -o public/bundle.js -dv"
1424
}
1525
}

‎webapp2/server.js

+30-6
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,47 @@
11
var http = require('http')
22
var level = require('level')
3-
var db = level('counter.db')
3+
var db = level('counter.db', { valueEncoding: 'json' })
4+
var ecstatic = require('ecstatic')(__dirname + '/public')
5+
var body = require('body/any')
6+
var collect = require('collect-stream')
7+
var mainpage = require('./mainpage.js')
8+
49
var count = 0
510
db.get('count', function (err, value) {
611
count = Number(value || 0) + count
712
})
813
var router = require('routes')()
914
router.addRoute('GET /', function (req, res, m) {
1015
res.setHeader('content-type', 'text/html')
11-
res.end('<h1>hello</h1>\n'
12-
+ 'you are the ' + (count++) + 'th visitor')
16+
var opts = { gt: 'guestbook!', lt: 'guestbook!~' }
17+
collect(db.createReadStream(opts), function (err, docs) {
18+
if (err) {
19+
res.end(err + '\n')
20+
return console.error(err)
21+
}
22+
var state = {
23+
count: count,
24+
messages: docs.map(function (doc) { return doc.value })
25+
}
26+
res.end(mainpage(state).toString())
27+
})
1328
db.put('count', count, function (err) {
1429
if (err) console.error(err)
1530
})
1631
})
32+
router.addRoute('POST /guestbook', function (req, res, m) {
33+
body(req, res, function (err, params) {
34+
if (err) return console.error(err)
35+
var key = 'guestbook!' + new Date().toISOString()
36+
db.put(key, params, function (err) {
37+
if (err) res.end('not ok')
38+
else res.end('ok')
39+
})
40+
})
41+
})
42+
1743
router.addRoute('*', function (req, res, m) {
18-
res.statusCode = 404
19-
res.setHeader('content-type', 'text/plain')
20-
res.end('not found\n')
44+
ecstatic(req, res)
2145
})
2246

2347
var server = http.createServer(function (req, res) {

0 commit comments

Comments
 (0)