Skip to content

Instantly share code, notes, and snippets.

@yukeehan
Created July 11, 2018 20:35
Show Gist options
  • Save yukeehan/281184d883497ba7009ad6f8cc24f1cd to your computer and use it in GitHub Desktop.
Save yukeehan/281184d883497ba7009ad6f8cc24f1cd to your computer and use it in GitHub Desktop.
Restful Route Blog App
#main_container{
margin-top: 7.0em;
}
#delete{
display: inline;
}
var bodyParser = require("body-parser"),
expressSanitizer = require("express-sanitizer"),
methodOverride= require("method-override"),
mongoose = require("mongoose"),
express = require("express"),
app = express();
//APP CONFIG
mongoose.connect("mongodb://localhost:27017/blog_app", { useNewUrlParser: true });
app.set("view engine", "ejs");
app.use(express.static("public"));
app.use(bodyParser.urlencoded({extended: true}));
app.use(expressSanitizer());
app.use(methodOverride("_method"));
//MONGO/MODEL CONFIG
var blogSchema = new mongoose.Schema({
title: String,
image: String,
body: String,
created: {type: Date, default: Date.now()}
});
var Blog = mongoose.model("Blog", blogSchema);
// Blog.create({
// title: "Test Blog",
// image: "https://images.unsplash.com/photo-1531208483756-19591c7c4ab8?ixlib=rb-0.3.5&ixid=eyJhcHBfaWQiOjEyMDd9&s=0b5061dfa742d9a88ad9f4d84ac34042&auto=format&fit=crop&w=900&q=60",
// body: "Bacon ipsum dolor amet porchetta swine strip steak rump bacon. Bacon pork kevin bresaola pig kielbasa short"
// })
//RESTFUL ROUTES
app.get("/", function(req, res){
res.redirect("/blogs");
});
// INDEX ROUTE
app.get("/blogs", function(req, res){
//retrieve all data from DB
Blog.find({},function(err, blogs){
if(err){
console.log(err);
} else {
res.render("index", {blogs: blogs});
}
});
});
// NEW ROUTE
app.get("/blogs/new", function(req, res){
// SHOW NEW BLOG FORM
res.render("new");
});
//CREATE ROUTE
app.post("/blogs", function(req, res){
// sanitize the blog.body
req.body.blog.body = expressSanitizer(req.body.blog.body);
// create blog
Blog.create(req.body.blog, function(err, newBlog){
if(err){
console.log(err);
} else {
// redirect to the index
res.redirect("/blogs")
}
});
});
// SHOW ROUTE
app.get("/blogs/:id", function(req, res){
Blog.findById(req.params.id, function(err, foundBlog){
if(err){
res.redirect("/blogs");
} else {
res.render("show",{blog: foundBlog});
}
})
});
// EDIT ROUTE
app.get("/blogs/:id/edit", function(req, res){
Blog.findById(req.params.id, function(err, foundBlog){
if(err){
console.log("edit error!");
} else {
res.render("edit", {blog: foundBlog});
}
});
});
// UPDATE ROUTE
app.put("/blogs/:id", function(req, res){
req.body.blog.body = expressSanitizer(req.body.blog.body);
Blog.findByIdAndUpdate(req.params.id, req.body.blog, function(err, updatedBlog){
if(err){
res.redirect("/blogs");
} else {
res.redirect("/blogs/" + req.params.id);
}
});
});
// DELETE ROUTE
app.delete("/blogs/:id", function(req, res){
// destroy blog
Blog.findByIdAndRemove(req.params.id, function(err){
if(err){
res.redirect("/blogs");
} else {
res.redirect("/blogs");
}
});
});
app.listen(process.env.PORT, process.env.IP, function(){
console.log("app is started!");
});
<% include ./partials/header %>
<div class="ui main text container segment" id="main_container">
<div class="ui huge header">Edit <%= blog.title %></div>
<form class="ui form" action="/blogs/<%= blog._id %>?_method=PUT" method="POST">
<div class="field">
<label>title</label>
<input type="text" name="blog[title]" value="<%= blog.title %>">
</div>
<div class="field">
<label>image</label>
<input type="text" name="blog[image]" value="<%= blog.image %>">
</div>
<div class="field">
<label>blog content</label>
<textarea required name="blog[body]"><%= blog.body %></textarea>
</div>
<input class="ui grey button"type="submit">
</form>
</div>
<% include ./partials/footer %>
var bodyParser = require("body-parser"),
expressSanitizer = require("express-sanitizer"),
methodOverride= require("method-override"),
mongoose = require("mongoose"),
express = require("express"),
app = express();
//APP CONFIG
mongoose.connect("mongodb://localhost:27017/blog_app", { useNewUrlParser: true });
app.set("view engine", "ejs");
app.use(express.static("public"));
app.use(bodyParser.urlencoded({extended: true}));
app.use(expressSanitizer());
app.use(methodOverride("_method"));
//MONGO/MODEL CONFIG
var blogSchema = new mongoose.Schema({
title: String,
image: String,
body: String,
created: {type: Date, default: Date.now()}
});
var Blog = mongoose.model("Blog", blogSchema);
// Blog.create({
// title: "Test Blog",
// image: "https://images.unsplash.com/photo-1531208483756-19591c7c4ab8?ixlib=rb-0.3.5&ixid=eyJhcHBfaWQiOjEyMDd9&s=0b5061dfa742d9a88ad9f4d84ac34042&auto=format&fit=crop&w=900&q=60",
// body: "Bacon ipsum dolor amet porchetta swine strip steak rump bacon. Bacon pork kevin bresaola pig kielbasa short"
// })
//RESTFUL ROUTES
app.get("/", function(req, res){
res.redirect("/blogs");
});
// INDEX ROUTE
app.get("/blogs", function(req, res){
//retrieve all data from DB
Blog.find({},function(err, blogs){
if(err){
console.log(err);
} else {
res.render("index", {blogs: blogs});
}
});
});
// NEW ROUTE
app.get("/blogs/new", function(req, res){
// SHOW NEW BLOG FORM
res.render("new");
});
//CREATE ROUTE
app.post("/blogs", function(req, res){
// sanitize the blog.body
req.body.blog.body = expressSanitizer(req.body.blog.body);
// create blog
Blog.create(req.body.blog, function(err, newBlog){
if(err){
console.log(err);
} else {
// redirect to the index
res.redirect("/blogs")
}
});
});
// SHOW ROUTE
app.get("/blogs/:id", function(req, res){
Blog.findById(req.params.id, function(err, foundBlog){
if(err){
res.redirect("/blogs");
} else {
res.render("show",{blog: foundBlog});
}
})
});
// EDIT ROUTE
app.get("/blogs/:id/edit", function(req, res){
Blog.findById(req.params.id, function(err, foundBlog){
if(err){
console.log("edit error!");
} else {
res.render("edit", {blog: foundBlog});
}
});
});
// UPDATE ROUTE
app.put("/blogs/:id", function(req, res){
req.body.blog.body = expressSanitizer(req.body.blog.body);
Blog.findByIdAndUpdate(req.params.id, req.body.blog, function(err, updatedBlog){
if(err){
res.redirect("/blogs");
} else {
res.redirect("/blogs/" + req.params.id);
}
});
});
// DELETE ROUTE
app.delete("/blogs/:id", function(req, res){
// destroy blog
Blog.findByIdAndRemove(req.params.id, function(err){
if(err){
res.redirect("/blogs");
} else {
res.redirect("/blogs");
}
});
});
app.listen(process.env.PORT, process.env.IP, function(){
console.log("app is started!");
});
<% include ./partials/header %>
<div class="ui segment main text container">
<div class="ui huge header">New Blog</div>
<form class="ui form" action="/blogs" method="POST">
<div class="field">
<label>title</label>
<input type="text" name="blog[title]" placeholder="title">
</div>
<div class="field">
<label>image</label>
<input type="text" name="blog[image]" placeholder="image url">
</div>
<div class="field">
<label>blog content</label>
<textarea required name="blog[body]" placeholder="blog post goes here"></textarea>
</div>
<input class="ui grey button"type="submit">
</form>
</div>
<% include ./partials/footer %>
{
"name": "blogapp",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "yukee",
"license": "ISC",
"dependencies": {
"body-parser": "^1.18.3",
"ejs": "^2.6.1",
"express": "^4.16.3",
"express-sanitizer": "^1.0.4",
"method-override": "^2.3.10",
"mongoose": "^5.2.2"
}
}
<% include ./partials/header %>
<div class="ui segment main text container">
<div class="ui huge header"><%= blog.title %></div>
<div class="ui top attached">
<div class="item">
<img class="ui rounded centered image" src="<%= blog.image %>">
<div class="content">
<span><%= blog.created.toDateString() %></span>
</div>
<div class="description">
<p><%= blog.body %></p>
</div>
<a href="/blogs/<%= blog._id %>/edit" class="ui blue basic button">Edit</a>
<form id="delete" action="/blogs/<%= blog._id %>?_method=DELETE" method="POST">
<button class="ui red basic button">Delete</button>
</form>
</div>
</div>
</div>
<% include ./partials/footer %>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment