This project is a recreation of the previous Glitch.com-hosted version of my Notion Pokedex generator. I use this project to teach the Notion API here: https://thomasjfrank.com/notion-api-crash-course

You can use this project in nearly the exact same way as the Glitch version. Click Remix to get your own version.

Alternatively, create your own empty Val and write the code yourself, following my tutorial.

Just as with Glitch, you'll need to create the NOTION_KEY and NOTION_DATABASE_ID variables in the Environment Variables section.

Note that the main file here is called main.ts instead of index.js. You don't need to worry too much about that. .ts means it's a TypeScript file, and TypeScript is just a sort of "beefed up" version of JavaScript. If you're a beginner, you really don't need to worry about the differences right now.

There is also one other important change. At the top of the file, the imports must read:

import axios from "npm:axios";
import { Client } from "npm:@notionhq/client@4.0.2";

This differs from the code shown in my blog post and video, which shows:

const axios = require('axios')
const { Client } = require('@notionhq/client')

Why the difference?

1. Val requires us to use the newer import syntax for bringing in NPM packages
2. Val also requires us to prefix package names with npm: if they are not pre-bundled node.js packages
3. The Notion API has a new version which my tutorial does not cover. The @4.0.2 snippet pins the Notion SDK package to an older version, allowing us to use the older version of the API.

If you're curious, the Notion API changed to support Notion's new multi-source databases. This requires API requests to specify data sources when creating new pages, not databases.