Overview

Dive into a comprehensive beginner's tutorial on working with the Notion API using JavaScript. Learn to create a Pokédex project, integrating data from the PokeAPI into Notion pages. Master API basics, Node.js setup, and Axios usage while building a functional application. Explore Notion's API documentation, handle API responses, and structure data effectively. Refine your skills in data manipulation, regular expressions, and API integration. Gain practical experience in creating multiple Notion pages, adding custom properties, and enhancing content with images and formatted text. Perfect for those new to APIs and JavaScript, this course provides step-by-step guidance, best practices, and valuable resources to kickstart your journey in Notion API development.

Syllabus

- Introduction
- Project overview
- JavaScript prerequisites or lack thereof
- Companion blog post
- Pokedex project spec
- Pokedex template link
- PokeAPI Introduction
- What is an API?
- Script flow overview
- PokeAPI response example
- Script flow whiteboard diagram
- Glitch.com introduction
- Create a Node.JS starter app
- Starter project tour
- Create index.js
- Create a Notion API integration
- Get your internal integration token
- Create a .env file and add environmental variables
- Get your Notion database ID
- Add you integration to your database
- PokeAPI docs
- Axios library introduction
- Add Axios to package.json
- Side note: Dealing with broken npm packages
- Add the Notion SDK to package.json
- Add require statements to index.js
- Make your first call to PokeAPI
- Get response from PokeAPI
- Log a Pokemon's name
- Create an object definition to contain Pokemon stats
- Log the pokeData object
- Add the pokeData object to your array
- Build the createNotionPage function
- Notion API reference overview
- Create the response variable
- Side Note: Notion API page property values change
- Notion API page property reference
- Title property object structure
- Continue constructing the response variable
- Call the createNotionPage function
- Add logging to the script
- Run the script and send your first call to Notion
- Fetch multiple Pokemon at once with a loop
- API commands overview GET, POST, etc.
- Run the script again and fetch multiple records
- Start refining your data
- Get sprits and artwork from PokeAPI
- Overview of additional information to get from PokeAPI
- Refine the sprite variable
- Create the Pokemon types array
- Create the Bulbapedia URL
- Process and format each Pokemon's name
- MDN Web Docs introduction
- Regular expression references
- Send the refined/additional information to Notion
- Set the Notion page cover and icon
- Add child blocks to each Notion page
- Create a bookmark block for the Bulbapedia URL
- Send another batch of test pages to Notion
- Add missing pieces of information flavor text, generation, etc.
- PokeAPI pokemon-species endpoint overview
- Create another loop to call pokemon-species
- My #1 tip for learning programming and APIs
- Get the English-language flavor text
- Add formatted flavor text to the pokeData object
- Add the category and generation info to the pokeData object
- Add the new information to the Notion API call
- Test the finished script!
- Source code and additional resources
- More Notion resources and templates