Post API is fully working

src/components/Blog.js

@@ -31,7 +31,6 @@ export default class Blog extends Component {
     )
 
     return (
-      <div>
       <div className="content">
         <h1>Blog</h1>
 
@@ -40,7 +39,6 @@ export default class Blog extends Component {
         </div>
 
       </div>
-      </div>
     );
   }
 };

src/components/Post.js

@@ -2,10 +2,18 @@ import React, {Component} from 'react';
 
 export default class Post extends Component {
   render() {
+
+    if (this.props.isLoading) {
+      return (
+        <h1>Loading</h1>
+      );
+    }
+
     return (
-      <div>
       <div className="content">
-          <h1>Post</h1>
+        <h1>{this.props.post.title}</h1>
+        <h4>{this.props.post.published}</h4>
+        <div dangerouslySetInnerHTML={{__html: this.props.post.body}}>
         </div>
       </div>
     )

src/utils/api.js

@@ -1,23 +1,33 @@
 const data = require('./data.json');
 const api = require('express').Router();
+const fs = require('fs');
+const path = require('path');
 
 api.get('/blog', (req, res) => {
   res.json(data.posts);
 });
 
 api.get('/post/:postname', (req, res) => {
+  const postname = req.params.postname;
   const post = data.posts.find((el) => {
-    el.filename === req.params.postname
+    return el.filename === postname
   });
 
-  if (post) {
+  const renderPath = path.join(process.cwd(), '/renders', postname + '.html');
-    res.json(post);
+  fs.readFile(renderPath, 'utf8', (err, data) => {
-  } else {
+    if (err) {
       res.json({
         error: 404
       });
+    } else {
+      res.json({
+        published: post.published,
+        title: post.title,
+        body: data,
+      });
     }
   });
+});
 
 
 module.exports = api;