diff --git a/docz/docs/03-demos/04-static/08-nextjs.md b/docz/docs/03-demos/04-static/08-nextjs.md
index 236c8ea..f0ab7e1 100644
--- a/docz/docs/03-demos/04-static/08-nextjs.md
+++ b/docz/docs/03-demos/04-static/08-nextjs.md
@@ -9,11 +9,10 @@ import Tabs from '@theme/Tabs';
import TabItem from '@theme/TabItem';
import CodeBlock from '@theme/CodeBlock';
-:::note
-
-This was tested against `next v13.4.4` on 2023 May 26.
-
-:::
+NextJS is a server-side framework for building static and dynamic sites. For
+pure static sites, [Webpack loaders](/docs/demos/static/webpack) can preprocess
+files and NextJS can build static pages from spreadsheets. For dynamic sites,
+NextJS lifecycle methods can read files on the server side.
The [NodeJS module](/docs/getting-started/installation/nodejs) can be imported
from pages or loaded in Webpack loaders.
@@ -50,6 +49,33 @@ module.exports = {
:::
+:::warning Telemetry
+
+NextJS collects telemetry by default. The `telemetry` subcommand can disable it:
+
+```js
+npx next@13.4.4 telemetry disable
+```
+
+The setting can be verified by running
+
+```js
+npx next@13.4.4 telemetry status
+```
+
+:::
+
+:::note
+
+The following deployments were tested:
+
+| NextJS | Date |
+|:-------|:-----------|
+| 13.1.1 | 2023-01-14 |
+| 13.4.4 | 2023-05-26 |
+
+:::
+
## Loading Data
At a high level, there are two ways to pull spreadsheet data into NextJS apps:
diff --git a/docz/docs/03-demos/04-static/09-nuxtjs.md b/docz/docs/03-demos/04-static/09-nuxtjs.md
index 96cf1e4..e3a7cd8 100644
--- a/docz/docs/03-demos/04-static/09-nuxtjs.md
+++ b/docz/docs/03-demos/04-static/09-nuxtjs.md
@@ -10,14 +10,49 @@ import CodeBlock from '@theme/CodeBlock';
`@nuxt/content` is a file-based CMS for Nuxt, enabling static-site generation
and on-demand server rendering powered by spreadsheets.
+The [NodeJS module](/docs/getting-started/installation/nodejs) can be imported
+from Content v1 "parsers" and Content v2 "transformers".
+
:::note
The following deployments were tested:
| Nuxt Content | Nuxt | Date |
|:-------------|:---------|:-----------|
-| `1.15.1` | `2.16.3` | 2023-04-06 |
+| `1.15.1` | `2.16.3` | 2023-06-01 |
| `2.3.0` | `3.0.0` | 2023-01-19 |
+| `2.6.0` | `3.5.2` | 2023-06-01 |
+
+:::
+
+:::caution Telemetry
+
+Nuxt embeds telemetry. According to the developers, it is disabled by default.
+To explicitly disable telemetry, the official documentation recommends:
+
+```bash
+npx nuxt telemetry disable
+```
+
+At the time the demo was last tested, this command did not work. Instead, a
+option should be added in `nuxt.config.ts` or `nuxt.config.js` for Nuxt 3 sites:
+
+```js
+// ...
+// highlight-start
+export default defineNuxtConfig({
+ // @ts-ignore
+ telemetry: false,
+// highlight-end
+ // ...
+})
+```
+
+A global setting can be added to `.nuxtrc` in the user home directory:
+
+```ini title=".nuxtrc"
+telemetry.enabled=false
+```
:::
@@ -54,7 +89,7 @@ const parseSheet = (file, { path }) => {
const wb = readFile(path);
const o = wb.SheetNames.map(name => ({ name, data: utils.sheet_to_json(wb.Sheets[name])}));
return { data: o };
-}
+};
export default {
// ...
@@ -109,15 +144,32 @@ neatly with nested `v-for`:
### Nuxt Content Demo
+:::caution
+
+When the demo was last tested, parts of the Nuxt dependency tree did not support
+NodeJS version 20. The creation step will show warnings like
+
+```
+npm WARN EBADENGINE Unsupported engine {
+npm WARN EBADENGINE package: '@nuxt/types@2.16.3',
+npm WARN EBADENGINE required: { node: '^14.18.0 || ^16.10.0 || ^17.0.0 || ...
+npm WARN EBADENGINE current: { node: 'v20.2.0', npm: '9.6.6' }
+npm WARN EBADENGINE }
+```
+
+The recommended solution is to switch to Node 18.
+
+:::
+
1) Create a stock app:
```bash
-npx create-nuxt-app@4.0.0 SheetJSNuxt
+npx create-nuxt-app@4.0.0 sheetjs-nuxt
```
When prompted, enter the following options:
-- `Project name`: press Enter (use default `SheetJSNuxt`)
+- `Project name`: press Enter (use default `sheetjs-nuxt`)
- `Programming language`: press Down Arrow (`TypeScript` selected) then Enter
- `Package manager`: select `Npm` and press Enter
- `UI framework`: select `None` and press Enter
@@ -135,7 +187,7 @@ The project will be configured and modules will be installed.
2) Install the SheetJS library and start the server:
{`\
-cd SheetJSNuxt
+cd sheetjs-nuxt
npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz
npm run dev`}
@@ -167,7 +219,7 @@ const parseSheet = (file, { path }) => {
const wb = readFile(path);
const o = wb.SheetNames.map(name => ({ name, data: utils.sheet_to_json(wb.Sheets[name])}));
return { data: o };
-}
+};
```
- Look for the exported object. There should be a `content` property:
@@ -283,7 +335,8 @@ the library hard-codes UTF-8 interpretations, the `_id` field currently uses
the pattern `content:` followed by the filename (if files are placed in the
`content` folder directly). This enables a transformer to re-read the file:
-```ts
+```ts title="Transformer"
+// @ts-ignore
import { defineTransformer } from "@nuxt/content/transformers/utils";
import { read, utils } from "xlsx";
import { readFileSync } from "node:fs";
@@ -293,7 +346,13 @@ export default defineTransformer({
name: 'sheetformer',
extensions: ['.xlsx'],
parse (_id: string, rawContent: string) {
- const wb = read(readFileSync(resolve("./content/" + _id.slice(8))));
+ // highlight-start
+ /* read the underlying file */
+ const buf = readFileSync(resolve("./content/" + _id.slice(8)));
+ /* parse */
+ const wb = read(buf);
+ // highlight-end
+ /* generate JS objects for each worksheet */
const body = wb.SheetNames.map(name => ({ name, data: utils.sheet_to_json(wb.Sheets[name])}));
return { _id, body };
}
@@ -302,7 +361,7 @@ export default defineTransformer({
Pages can pull data using `useAsyncData`:
-```html
+```html title="Page"