diff --git a/config.json b/config.json
index d8b4c83..70f9560 100644
--- a/config.json
+++ b/config.json
@@ -10,6 +10,7 @@
},
"contentPath": "./content",
"renderPath": "./renders",
+ "dataPath": "./src/utils/data.json",
"files": [
"about.md", "resume.md"
]
diff --git a/package.json b/package.json
index bc8a42b..a31e33e 100644
--- a/package.json
+++ b/package.json
@@ -40,6 +40,7 @@
"babel-loader": "^8.0.5",
"clean-webpack-plugin": "^0.1.19",
"compression-webpack-plugin": "^1.1.11",
+ "create-file-webpack": "^1.0.2",
"css-loader": "^0.28.11",
"css-modules-require-hook": "^4.2.3",
"eslint": "^5.14.0",
diff --git a/src/components/Post.js b/src/components/Post.js
index ff4364b..f3f925c 100644
--- a/src/components/Post.js
+++ b/src/components/Post.js
@@ -1,18 +1,23 @@
-import React, {Component} from 'react';
-import {Spinner, Header, Navbar} from '.';
-import '../static/stylesheets/globals.scss';
-import contentStyle from '../static/stylesheets/content.scss';
-import styles from './Post.scss';
+import React, { Component } from 'react'
+import PropTypes from 'prop-types'
+import { Spinner, Header, Navbar } from '.'
+import '../static/stylesheets/globals.scss'
+import contentStyle from '../static/stylesheets/content.scss'
+import styles from './Post.scss'
export default class Post extends Component {
- render() {
+ static propTypes = {
+ isLoading: PropTypes.bool.isRequired,
+ post: PropTypes.object.isRequired
+ }
+ render () {
if (this.props.isLoading) {
return (
- );
+ )
}
return (
@@ -24,7 +29,7 @@ export default class Post extends Component {
{this.props.post.published}
-
diff --git a/src/containers/MainContainer.js b/src/containers/MainContainer.js
index 10b71cd..7c20399 100644
--- a/src/containers/MainContainer.js
+++ b/src/containers/MainContainer.js
@@ -4,18 +4,26 @@ import { About, Blog, Home, Wrapper } from '../components'
export default class MainContainer extends Component {
static propTypes = {
- data: PropTypes.object.isRequired
+ staticContext: PropTypes.object
}
- constructor () {
- super()
+ constructor (props) {
+ super(props)
- this.state = {
- isLoadingBlog: true,
- isLoadingAbout: true
+ let data
+ if (__isBrowser__) {
+ data = window.__INITIAL_DATA__
+ delete window.__INITIAL_DATA__
+ } else {
+ data = props.staticContext.data
}
- console.log(this.props.data)
+ this.state = {
+ isLoadingBlog: !data.posts,
+ isLoadingAbout: !data.about,
+ about: data.about,
+ posts: data.posts
+ }
}
render () {
diff --git a/src/containers/PostContainer.js b/src/containers/PostContainer.js
index 26f49f8..eca6be0 100644
--- a/src/containers/PostContainer.js
+++ b/src/containers/PostContainer.js
@@ -14,8 +14,6 @@ export default class PostContainer extends Component {
isLoading: true,
error: false
}
-
- console.log(this.props.data)
}
render () {
diff --git a/src/server.js b/src/server.js
index 4f92493..52143dc 100644
--- a/src/server.js
+++ b/src/server.js
@@ -1,15 +1,10 @@
import express from 'express'
-import fs from 'fs'
import { serverRender } from './utils/serverRender'
+require('./utils/scanner')()
+
const port = process.env.PORT || 3000
const app = express()
-const filename = './src/utils/data.json'
-const dataStub = { 'posts': [], 'other': [] }
-fs.writeFileSync(filename, JSON.stringify(dataStub))
-
-require('./utils/scanner')()
-
app.use('/static', express.static('public/static'))
app.get('/favicon.ico', (req, res) => {
diff --git a/src/utils/api.js b/src/utils/api.js
index a112a24..a33fc31 100644
--- a/src/utils/api.js
+++ b/src/utils/api.js
@@ -1,11 +1,12 @@
import fs from 'fs'
-import data from './data.json'
+import jsonfile from 'jsonfile'
+import config from '../../config.json'
-export function getData (path = '') {
- if (path === '') {
- return Promise.resolve(data)
+export function getData (reqPath = '') {
+ if (reqPath === '') {
+ return readData(config.dataPath)
} else {
- const fileName = '../../content/' + path
+ const fileName = '../../renders/' + reqPath + '.html'
return readFile(fileName)
}
};
@@ -17,3 +18,11 @@ function readFile (fileName, type) {
})
})
}
+
+function readData (dataPath) {
+ return new Promise(function (resolve, reject) {
+ jsonfile.readFile(dataPath, (err, data) => {
+ err ? reject(err) : resolve(data)
+ })
+ })
+}
diff --git a/src/utils/compiler.js b/src/utils/compiler.js
index 64e6894..4aab93c 100644
--- a/src/utils/compiler.js
+++ b/src/utils/compiler.js
@@ -128,8 +128,8 @@ Compiler.prototype.addFile = function (filepath, isPost, callback) {
* Writes updated data to the data file
*/
Compiler.prototype.writeData = function (callback) {
- const dataPath = path.join(process.cwd(), 'src/utils/data.json')
- jsonfile.writeFile(dataPath, this.data, callback)
+ // console.log(this.data)
+ jsonfile.writeFile(config.dataPath, this.data, callback)
}
module.exports = Compiler
diff --git a/src/utils/scanner.js b/src/utils/scanner.js
index 7f584be..cb2c381 100644
--- a/src/utils/scanner.js
+++ b/src/utils/scanner.js
@@ -3,9 +3,10 @@ const path = require('path')
const async = require('async')
const Compiler = require('./compiler')
const config = require('../../config.json')
-const data = require('./data.json')
+const jsonfile = require('jsonfile')
module.exports = function () {
+ const data = jsonfile.readFileSync(config.dataPath)
var compiler = new Compiler(data)
/**
@@ -31,7 +32,13 @@ module.exports = function () {
*/
function compileFile (file, callback) {
const filePath = path.join(process.cwd(), config.contentPath, file)
- compiler.addFile(filePath, false, callback)
+
+ // config.files contains list of file names which are not considered blog posts
+ if (config.files.indexOf(file) === -1) {
+ compiler.addFile(filePath, true, callback)
+ } else {
+ compiler.addFile(filePath, false, callback)
+ }
}
/**
diff --git a/src/utils/serverRender.js b/src/utils/serverRender.js
index 9cfd811..06bf2a9 100644
--- a/src/utils/serverRender.js
+++ b/src/utils/serverRender.js
@@ -1,4 +1,3 @@
-// import 'babel-polyfill'
import React from 'react'
import { renderToString } from 'react-dom/server'
import { StaticRouter as Router, matchPath } from 'react-router-dom'
@@ -14,11 +13,9 @@ export function serverRender (req, res, next) {
: Promise.resolve()
promise.then((data) => {
- console.log(data)
-
const markup = renderToString(
-
-
+
+
)
@@ -38,11 +35,12 @@ function renderFullPage (html, data) {
+
+
${html}
-