Untitled

// ROOT/server.js
const express = require("express")
const { renderToString } = require("react-dom/server")

const { ServerStyleSheet } = require("styled-components")

const SSR = require("./static")

const { Meep: ReactSSR } = require("./src/ssr")

const sheet = new ServerStyleSheet()
try {
  const html = renderToString(sheet.collectStyles(<ReactSSR />))
  const styleTags = sheet.getStyleTags() // or sheet.getStyleElement();
} catch (error) {
  // handle error
  console.error(error)
} finally {
  sheet.seal()
}

server(process.env.PORT || 8080)
console.log("process.env.PORT")
console.log(process.env.PORT)
console.log(process.env.HOST)
console.log(process.env.BROWSER_REFRESH_URL)

function server(port) {
  const app = express()

  app.use(express.static("static"))
  app.get("/", (req, res) =>
    res.status(200).send(renderMarkup(renderToString(SSR)))
  )

  // app.listen(port)

  app.listen(port, () => process.send && process.send("online"))
}

function renderMarkup(html) {
  return `<!DOCTYPE html>
<html>
  <head>
    <title>Webpack SSR Demo</title>
    <meta charset="utf-8" />
    ${sheet}
  </head>
  <body>
    <div id="app">${html}</div>
    <script src="./index.js"></script>

    <script src="${process.env.BROWSER_REFRESH_URL}"></script>

  </body>
</html>`
}