Video: Notion API – Full Course for Beginners

Learn how to work with the Notion API using JavaScript in this comprehensive beginner's tutorial.

? EXPAND TO SEE TIMESTAMPS AND RESOURCES ?

? WRITTEN VERSION (contains much more detailed explanations and resource links for everything):
https://thomasjfrank.com/notion-api-crash-course/

? PROJECT RESOURCES
Notion Pokédex Template: https://thomasfrank.notion.site/Notion-Pok-dex-Template-4fc48e2918944e859e30d387279a311b
Glitch project: https://glitch.com/edit/#!/notion-pokedex
PokéAPI: https://pokeapi.co/
Notion API: https://developers.notion.com/reference/intro
Notion property values: https://developers.notion.com/reference/property-value-object

? ULTIMATE BRAIN (Full Second-Brain Template - use LETSGO2023 at checkout):
https://thomasjfrank.com/brain/

? NOTION FUNDAMENTALS (Free & Complete Notion Beginner's Course)
https://thomasjfrank.com/fundamentals/

? CREATOR'S COMPANION (The Best Template for Content Creators - use LETSGO2023 at checkout):
https://thomasjfrank.com/creators-companion/

? MORE COURSES AND RESOURCES: 
https://thomasjfrank.com/templates/
https://thomasjfrank.com/courses/

?GET STARTED WITH NOTION:
https://thomasjfrank.com/usenotion/ - (this is my referral link)

? More Video Links:
Notion Formula Guide: http://notionformulaguide.com/
Axios docs: https://axios-http.com/docs/intro
MDN Web Docs: https://developer.mozilla.org/en-US/
Notion Databases: https://www.youtube.com/watch?v=mAJOpO73d8Y
Send YouTube Stats to Notion (no-code): https://www.youtube.com/watch?v=VUeFtATlIDY

?Connect with me:
Twitter ➔ https://twitter.com/tomfrankly (best way to interact with me)
Instagram ➔ https://instagram.com/tomfrankly
Music ➔  @ThomasFrankMusic 

-----

⏱ TIMESTAMPS:
00:00 - Introduction
01:50 - Project overview
03:12 - JavaScript prerequisites (or lack thereof)
04:15 - Companion blog post
04:59 - Pokedex project spec
06:07 - Pokedex template link
07:10 - PokeAPI Introduction
07:30 - What is an API?
08:10 - Script flow overview
08:26 - PokeAPI response example
10:25 - Script flow whiteboard diagram

Build Start

12:30 - Glitch.com introduction
13:35 - Create a Node.JS starter app
14:19 - Starter project tour
15:03 - Create index.js

Prepare Notion

15:38 - Create a Notion API integration
16:58 - Get your internal integration token
17:24 - Create a .env file and add environmental variables
18:13 - Get your Notion database ID
19:40 - Add you integration to your database

Get Data from PokeAPI

20:49 - PokeAPI docs
22:09 - Axios library introduction
22:40 - Add Axios to package.json
23:23 - Side note: Dealing with broken npm packages
24:44 - Add the Notion SDK to package.json
25:50 - Add require statements to index.js
27:08 - Make your first call to PokeAPI
30:52 - Get response from PokeAPI
31:54 - Log a Pokemon's name
33:46 - Create an object definition to contain Pokemon stats
38:55 - Log the pokeData object

Send Data to Notion

39:17 - Add the pokeData object to your array
40:36 - Build the createNotionPage() function
41:36 - Notion API reference overview
43:53 - Create the response variable
46:12 - Side Note: Notion API page property values change
47:01 - Notion API page property reference
47:59 - Title property object structure
48:30 - Continue constructing the response variable
52:35 - Call the createNotionPage() function
53:25 - Add logging to the script
54:32 - Run the script and send your first call to Notion

Create Multiple Pages at Once

56:15 - Fetch multiple Pokemon at once with a loop
58:02 - API commands overview (GET, POST, etc.)
58:56 - Run the script again and fetch multiple records

Refine Your Data

01:00:13 - Start refining your data
01:01:35 - Get sprits and artwork from PokeAPI
01:03:33 - Overview of additional information to get from PokeAPI
01:04:06 - Refine the sprite variable
01:06:25 - Create the Pokemon types array
01:09:25 - Create the Bulbapedia URL
01:11:55 - Process and format each Pokemon's name
01:14:40 - MDN Web Docs introduction
01:15:49 - Regular expression references
01:25:43 - Send the refined/additional information to Notion
01:27:55 - Set the Notion page cover and icon
01:29:55 - Add child blocks to each Notion page
01:31:18 - Create a bookmark block for the Bulbapedia URL
01:32:00 - Send another batch of test pages to Notion

Add Flavor Text, Generation, and Category

01:34:00 - Add missing pieces of information (flavor text, generation, etc.)
01:34:44 - PokeAPI pokemon-species endpoint overview
01:35:35 - Create another loop to call pokemon-species
01:38:00 - My #1 tip for learning programming and APIs
01:39:23 - Get the English-language flavor text
01:47:30 - Add formatted flavor text to the pokeData object
01:48:13 - Add the category and generation info to the pokeData object
01:52:35 - Add the new information to the Notion API call
01:58:31 - Test the finished script!

Tutorial Wrap-Up

02:00:50 - Source code and additional resources
02:04:20 - More Notion resources and templates

-----

? SPECIAL THANKS
Select video clips supplied by Getty Images