Created
March 16, 2017 01:49
-
-
Save spasiu/82e4e688885baf098a01e9cb365f9d87 to your computer and use it in GitHub Desktop.
real time app with polling example for JS101
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| const catPut = document.getElementById('cat-input'); | |
| const catList = document.getElementById('cat-list'); | |
| document.getElementById('cat-button').onclick = () => { | |
| const cat = catPut.value; | |
| superagent.post('/cats').send({ cat }).end((err, res) => { | |
| err ? alert(err.message) : catPut.value = ''; | |
| }); | |
| } | |
| setInterval(() => { | |
| superagent.get('/cats', (err, res) => { | |
| if (err) { | |
| console.log('ERROR FETCHING CATS', err); | |
| return; | |
| } | |
| catList.innerHTML = ''; | |
| for (const cat of res.body.cats) { | |
| const catElement = document.createElement('li'); | |
| catElement.innerText = cat; | |
| catList.appendChild(catElement); | |
| } | |
| }) | |
| }, 500); |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <title>Document</title> | |
| </head> | |
| <body> | |
| HELLO WORLD | |
| <input type="text" id="cat-input" placeholder="cat"> | |
| <button id="cat-button">create</button> | |
| <ul id="cat-list"></ul> | |
| <script src="https://cdnjs.cloudflare.com/ajax/libs/superagent/3.5.0/superagent.min.js"></script> | |
| <script src="app.js"></script> | |
| </body> | |
| </html> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| const express = require('express'); | |
| const bodyParser = require('body-parser'); | |
| const cats = ['Fluffy', 'Fuzzy', 'Garfield', 'Dynamo', 'Buster']; | |
| const app = express(); | |
| app.listen(8000, () => console.log('Running on port 8000')) | |
| app.use(express.static(__dirname + '/public')); | |
| app.use(bodyParser.json()); | |
| app.post('/cats', (req, res) => { | |
| const cat = req.body.cat; | |
| console.log(req.body); | |
| cats.push(cat); | |
| const id = cats.length -1; | |
| res.json({ id, cat }); | |
| }); | |
| app.get('/cats', (req, res) => { | |
| res.json({ cats }); | |
| }); | |
| app.get('/cats/:id', (req, res) => { | |
| const cat = cats[req.params.id]; | |
| if (!cat) { | |
| res.status(404).json({ | |
| error: 'Cat not found' | |
| }); | |
| return; | |
| } | |
| res.json({ cat }); | |
| }); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment