Change the way data are loaded on the server

This commit is contained in:
LordMathis 2019-12-07 18:56:00 +01:00
parent a9b560346c
commit d4f41ec33e
No known key found for this signature in database
GPG Key ID: 575849FD91CE470C
7 changed files with 58 additions and 56 deletions

View File

@ -9,8 +9,7 @@
},
"baseUrl": "example.com",
"contentPath": "./content",
"renderPath": "./renders",
"dataPath": "./src/utils/data.json",
"storage": "file",
"non-content-files": [
"about.md", "resume.md"
]

View File

@ -17,14 +17,14 @@ export default class MainContainer extends Component {
data = window.__INITIAL_DATA__
delete window.__INITIAL_DATA__
}
this.state = {
isLoadingBlog: !data[0].posts,
isLoadingAbout: !data[0].other.about,
about: data[0].other.about,
posts: data[0].posts,
config: data[1]
}
}
}
render () {

View File

@ -7,6 +7,7 @@ import chokidar from 'chokidar'
import jsonfile from 'jsonfile'
import { ServerRenderer } from './utils/serverRender'
import { Scanner } from './utils/scanner'
import { DataGetter } from './utils/dataGetter'
const port = process.env.PORT || 3000
const app = express()
@ -65,7 +66,8 @@ if (head == null) {
}
}
const serverRenderer = new ServerRenderer(head, config)
const dataGetter = new DataGetter(config)
const serverRenderer = new ServerRenderer(head, config, dataGetter)
app.get('*', serverRenderer.render.bind(serverRenderer))
app.listen(port, function (error) {

View File

@ -1,34 +0,0 @@
import fs from 'fs'
import jsonfile from 'jsonfile'
import path from 'path'
export function getData (reqPath = '') {
if (reqPath === '') {
return readJson(path.join(process.cwd(), 'data.json'))
} else if (reqPath === 'resume') {
const fileName = path.join(process.cwd(), 'content', reqPath + '.md')
return readFile(fileName, 'resume', 'utf8')
} else {
const fileName = path.join(process.cwd(), 'content', reqPath + '.md')
return readFile(fileName, 'post', 'utf8')
}
};
function readFile (fileName, type, options) {
return new Promise(function (resolve, reject) {
fs.readFile(fileName, options, (err, data) => {
err ? reject(err) : resolve({
type: type,
data: data
})
})
})
}
function readJson (dataPath) {
return new Promise(function (resolve, reject) {
jsonfile.readFile(dataPath, (err, data) => {
err ? reject(err) : resolve(data)
})
})
}

46
src/utils/dataGetter.js Normal file
View File

@ -0,0 +1,46 @@
import fs from 'fs'
import jsonfile from 'jsonfile'
import path from 'path'
export class DataGetter {
constructor (config) {
this.config = config
}
getData (reqPath) {
if (this.config.storage === 'file') {
return this.getDataFromFile(reqPath)
}
}
getDataFromFile (reqPath) {
if (reqPath === '') {
return this.readJson(path.join(process.cwd(), 'data.json'))
} else if (reqPath === 'resume') {
const fileName = path.join(process.cwd(), 'content', reqPath + '.md')
return this.readFile(fileName, 'resume', 'utf8')
} else {
const fileName = path.join(process.cwd(), 'content', reqPath + '.md')
return this.readFile(fileName, 'post', 'utf8')
}
}
readFile (fileName, type, options) {
return new Promise(function (resolve, reject) {
fs.readFile(fileName, options, (err, data) => {
err ? reject(err) : resolve({
type: type,
data: data
})
})
})
}
readJson (dataPath) {
return new Promise(function (resolve, reject) {
jsonfile.readFile(dataPath, (err, data) => {
err ? reject(err) : resolve(data)
})
})
}
}

View File

@ -1,28 +1,18 @@
import { MainContainer, ContentContainer } from '../containers'
import { getData } from './api'
const routes = [
{
path: '/',
exact: true,
component: MainContainer,
getData: (path = '') => getData(
path.split('/').pop()
)
component: MainContainer
},
{
path: '/post/:postname',
component: ContentContainer,
getData: (path = '') => getData(
path.split('/').pop()
)
component: ContentContainer
},
{
path: '/resume',
component: ContentContainer,
getData: (path = '') => getData(
path.split('/').pop()
)
component: ContentContainer
}
]

View File

@ -7,9 +7,10 @@ import serialize from 'serialize-javascript'
import manifest from '../../public/static/manifest.json'
export class ServerRenderer {
constructor (head, config) {
constructor (head, config, dataGetter) {
this.head = head
this.config = config
this.dataGetter = dataGetter
}
render (req, res, next) {
@ -26,9 +27,7 @@ export class ServerRenderer {
)
res.status(404).send(renderFullPage(markup, head, {}, config))
} else {
const promise = activeRoute.getData
? activeRoute.getData(req.path)
: Promise.resolve()
const promise = this.dataGetter.getData(req.path.split('/').pop())
promise.then((data) => {
const context = [data, config]