Restful Route Blog App

app.css

#main_container{
    margin-top: 7.0em;
}
#delete{
    display: inline;
}

app.js

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!");
});

edit.ejs

<% 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 %>

index.ejs

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!");
});

new.ejs

<% 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 %>

package.json

{
  "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"
  }
}

show.ejs

<% 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 %>