Commit 23bf62d

committed

add vanilla render

1 parent 763caca commit 23bf62dCopy full SHA for 23bf62d

File tree

+40

-1

lines changed

+40

-1

lines changed

Lines changed: 1 addition & 1 deletion

Original file line number	Diff line number	Diff line change
`@@ -9,7 +9,7 @@ import Data from "./react-app/usersData"`
`9`	`9`	`import fs from "fs"`
`10`	`10`	`import path from "path"`
`11`	`11`
`12`		`-const functionName = 'react-ssr'`
	`12`	`+const functionName = 'react-express-ssr'`
`13`	`13`	`const app = express()`
`14`	`14`
`15`	`15`	`app.use(cors())`

Lines changed: 39 additions & 0 deletions

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,39 @@`
	`1`	`+import { renderToString } from "react-dom/server"`
	`2`	`+import App from "./react-app/App"`
	`3`	`+import fetchData from "./react-app/usersData"`
	`4`	`+`
	`5`	`+exports.handler = (event, context, callback) => {`
	`6`	`+ // Make API call`
	`7`	`+ fetchData().then(users => {`
	`8`	`+ // then render react app`
	`9`	`+ const react = renderToString(<App data={users} />)`
	`10`	`+ // then send back html`
	`11`	`+ return callback(null, {`
	`12`	`+ statusCode: 200,`
	`13`	`+ headers: {`
	`14`	`+ 'Content-Type': 'text/html',`
	`15`	`+ },`
	`16`	`+ body: makeHtml({`
	`17`	`+ title: 'React SSR!',`
	`18`	`+ body: react`
	`19`	`+ })`
	`20`	`+ })`
	`21`	`+ })`
	`22`	`+}`
	`23`	`+`
	`24`	`+function makeHtml ({ body, styles, title }) {`
	`25`	+ const stylesheet = (styles) ? `<style>${styles}</style>` : ''
	`26`	+ return `
	`27`	`+ <!DOCTYPE html>`
	`28`	`+ <html>`
	`29`	`+ <head>`
	`30`	`+ <title>${title}</title>`
	`31`	`+ ${stylesheet}`
	`32`	`+ </head>`
	`33`	`+ <body style="margin:0">`
	`34`	`+ <div id="root">${body}</div>`
	`35`	`+ <script src="/dev/bundle.js"></script>`
	`36`	`+ </body>`
	`37`	`+ </html>`
	`38`	+ `
	`39`	`+}`

Comments

(0)