kris/reacord
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

docs: huge migration to runtime asset cache

Browse Source
This commit is contained in:
MapleLeaf
2022-01-07 02:32:50 -06:00
parent 666215319e
commit ba603fca9e
41 changed files with 270 additions and 450 deletions
Download Patch File Download Diff File Expand all files Collapse all files

63
packages/docs/src/main.tsx
View File

@@ -1,23 +1,35 @@
import compression from "compression"
import type { ErrorRequestHandler, Request } from "express"
import type { ErrorRequestHandler, Request, Response } from "express"
import express from "express"
import Router from "express-promise-router"
import httpTerminator from "http-terminator"
import pino from "pino"
import pinoHttp from "pino-http"
import * as React from "react"
import { renderToStaticMarkup } from "react-dom/server.js"
import { AssetBuilderProvider } from "./asset-builder/asset-builder-context.js"
import { AssetBuilder } from "./asset-builder/asset-builder.js"
import { transformEsbuild } from "./asset-builder/transform-esbuild.js"
import { transformPostCss } from "./asset-builder/transform-postcss.js"
import { fromProjectRoot } from "./constants"
import GuidePage from "./guides/guide-page"
import { renderMarkdownFile } from "./helpers/markdown"
import { sendJsx } from "./helpers/send-jsx"
import { serveCompiledScript } from "./helpers/serve-compiled-script"
import { serveFile } from "./helpers/serve-file"
import { serveTailwindCss } from "./helpers/tailwind"
import DocsPage from "./pages/docs"
import { Landing } from "./pages/landing"
import { Html } from "./html.js"
import { Landing } from "./landing/landing"
const logger = pino()
const port = process.env.PORT || 3000
const assets = new AssetBuilder(fromProjectRoot(".asset-cache"), [
transformEsbuild,
transformPostCss,
])
export function sendJsx(res: Response, jsx: React.ReactElement) {
res.set("Content-Type", "text/html")
res.send(`<!DOCTYPE html>\n${renderToStaticMarkup(jsx)}`)
}
const errorHandler: ErrorRequestHandler = (error, request, response, next) => {
response.status(500).send(error.message)
logger.error(error)
@@ -26,36 +38,31 @@ const errorHandler: ErrorRequestHandler = (error, request, response, next) => {
const router = Router()
.use(pinoHttp({ logger }))
.use(compression())
.get("/tailwind.css", serveTailwindCss())
.use(assets.middleware())
.get(
"/prism-theme.css",
serveFile(fromProjectRoot("src/styles/prism-theme.css")),
)
.get(
"/popover-menu.client.js",
await serveCompiledScript(
fromProjectRoot("src/components/popover-menu.client.tsx"),
),
)
.get("/docs/*", async (req: Request<{ 0: string }>, res) => {
.get("/guides/*", async (req: Request<{ 0: string }>, res) => {
const { html, data } = await renderMarkdownFile(
fromProjectRoot(`src/docs/${req.params[0]}.md`),
new URL(`guides/${req.params[0]}.md`, import.meta.url).pathname,
)
sendJsx(
res,
<DocsPage
title={data.title}
description={data.description}
html={html}
/>,
<AssetBuilderProvider value={assets}>
<Html title={`${data.title} | Reacord`} description={data.description}>
<GuidePage html={html} />
</Html>
</AssetBuilderProvider>,
)
})
.get("/", (req, res) => {
sendJsx(res, <Landing />)
sendJsx(
res,
<AssetBuilderProvider value={assets}>
<Html>
<Landing />
</Html>
</AssetBuilderProvider>,
)
})
.use(errorHandler)