Skip to content

v3.2.0

Latest
Latest
Compare
Choose a tag to compare
@nimaa77 nimaa77 released this 01 Nov 22:06
v3.2.0
1e18ab6

Static Site Generation (SSG)

After.js has first class support for SSG and allows you to create super fast static web apps and serve them over CDN. (needs razzle 4)

renderStatic will return the data from getInitialProps and this data will get saved by razzle into a file called page-data.json. After.js won't call getInitialProps at runtime, instead it will read the page-data.json and pass it as a prop to your component.

from ./src/static_export.js you should export render and routes function.

  • async render(req, res) should render your app into html and at the end it should return html and data.
  • async routes() should return path for pages you want to statically generate.
// ./src/static_export.js

import { renderStatic } from '@jaredpalmer/after';
import appRoutes from './routes';

const assets = require(process.env.RAZZLE_ASSETS_MANIFEST);
const chunks = require(process.env.RAZZLE_CHUNKS_MANIFEST);

export const render = async (req, res) => {
  const { html, data } = await renderStatic({
    req,
    res,
    routes: appRoutes,
    assets,
    chunks,
  });
  res.json({ html, data });
};

export const routes = async () => {
  return ['/', '/about'];
};

after setting up this file you can build your app and run export script to generate your static site:

yarn build
yarn export

Minor Changes

  • Examples: add with-prerender example: 854a647
  • Chore(examples): update with-prerender README.md: 69fb6e2
  • Fix(examples): Update README.md: 5876e7f
  • Refactor(after): make <After /> more readable: 2c79809
  • Feat(after): add loadStaticProps: d78b967
  • Feat(after): add ssg flag to AfterClientData type: 668fee6
  • Feat(after): Update render.tsx: 0592897
  • Feat(after): call loadStaticProps in ssg mode: 226e4b8
  • Feat(after): change render to renderApp: b99189f
  • Feat(after)L add renderStatic method: 04b9fe4
  • Feat(after): add render method: 23c2e5e
  • Feat(after): re-export renderApp and renderStatic: 3f43f26
  • Feat(after): export renderApp and renderStatic: 61810c5
  • Examples: Update with-prerender example: 2611083
  • Feat(after): Update render: 6e512d6
  • Feat(after): Update Tests: eac8e48
  • Feat(after): change loadInitialProps args order: 4a85396
  • Feat(after): read data from page-data file prefetch(): d3bae33
  • Examples(prerender): Use paths.js: ca3e20c
  • Examples(prerender): Update server.js: 97b6ab9
  • Examples(pre-render): Update About.js: 2570cea
  • Feat(after): fix index path page-data.json: b0648f9
  • Fix-typo: f16c68a
  • Feat: load manifest plugin for examples: 2ea52a8
  • Feat: move tests outside src directory: 47b24ba
  • Refactor: prettier update code style: a745a96
  • Refactor: remove unsued files: 87410ef
  • Feat: add github workflows: d82e52f
  • Feat: add npmignore for basic-example folder: 2ef20f8
  • Chore: update configs: d77eaa7
  • Chore: UPDATE yarn.lcok file: b9a9cf5
  • Refactor: move workflows into root directory: 3dc549c
  • Feat: update size limit: 16efe83
  • Feat: use tsdx for after.js package development: 0a88526
  • Merge pull request #471 from wokayme/fix-typo: 099c044
  • Merge branch 'master' into feature/pre-render: 12cbd61
  • Refactor: remove unused files: 60e2466
  • Refactor: remove yarn lock file for examples: 46e9f98
  • Feat(examples): UPDATE razzle deps to v4: 5ad4910
  • Feat: add manifest plugin to examples: b53398c
  • Chore: add cache folder to gitignore: 9b0d412
  • Feat: update depdencies of basic example: 744feed
  • Merge pull request #507 from jaredpalmer/feature/support-razzle-4: 84db62b
  • Merge branch 'master' into feature/pre-render: f000f7a
  • Feat: UPDATE static-export example: c07e9fa
  • Feat: UPDATE README.md: b3c7778
  • Feat: UPDATE README.me: 582a581
  • Feat: UPDATE REAMDME.md: a9a0a4f
  • Merge pull request #370 from jaredpalmer/feature/pre-render: 556dd2b
Assets 2
Loading