{"id":38654,"date":"2025-03-18T21:01:02","date_gmt":"2025-03-19T01:01:02","guid":{"rendered":""},"modified":"2025-03-18T21:01:02","modified_gmt":"2025-03-19T01:01:02","slug":"script-coding-build-a-full-stack-ai-note-taking-app-with-nextjs-and-supabase-ndash-tutorial","status":"publish","type":"post","link":"https:\/\/ericbrooks.com\/whuzzup\/script-coding-build-a-full-stack-ai-note-taking-app-with-nextjs-and-supabase-ndash-tutorial\/","title":{"rendered":"[#Script #Coding] Build a Full Stack AI Note Taking App with Next.js and Supabase &ndash; Tutorial"},"content":{"rendered":"<div align=\"center\" style=\"padding: 2%;\"><iframe loading=\"lazy\" title=\"Build a Full Stack AI Note Taking App with Next.js and Supabase \u2013 Tutorial\" width=\"640\" height=\"360\" src=\"https:\/\/www.youtube.com\/embed\/6ChzCaljcaI?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe><\/div>\n<blockquote style=\"text-align: left; background-color: #E4E4E4; border: 3px dotted gray; padding:2%;\"><p>\n<a href=\"https:\/\/www.youtube.com\/watch?v=6ChzCaljcaI\" target=\"offsite\" rel=\"nofollow noopener noreferrer\"><\/p>\n<h3>Build a Full Stack AI Note Taking App with Next.js and Supabase &ndash; Tutorial<\/h3>\n<p><\/a><\/p>\n<p>By <a href=\"https:\/\/www.youtube.com\/channel\/UC8butISFwT-Wl7EV0hUK0BQ\" target=\"offsite\" rel=\"nofollow noopener noreferrer\"><strong>freeCodeCamp.org<\/strong><\/a><br \/><strong>Published<\/strong>: Mar 18, 2025<\/p>\n<p><em style=\"font-family: 'Times New Roman',Times,serif; color: #666;\"><span style=\"font-size: 3.5em; font-weight: bold;\">&#0147;<\/span><\/em><br \/>\n<a href=\"https:\/\/www.youtube.com\/watch?v=6ChzCaljcaI\" target=\"offsite\" rel=\"nofollow noopener noreferrer\"><img decoding=\"async\" src=\"https:\/\/i3.ytimg.com\/vi\/6ChzCaljcaI\/hqdefault.jpg\" class=\"alignright\" align=\"right\" alt=\"freeCodeCamp.org\" style=\"width: 200px; height: auto;\" \/><\/a> Build a full-stack note-taking app with the Next.js 15 App Router, Supabase for authentication and database management, Prisma ORM, and shadcn for clean, modern styling. We will also integrate the OpenAI API to add ChatGPT functionality so you can interact with your notes, and deploy the finished app to the web with Vercel.<\/p>\n<p>?? Course from  @coleblender <br \/>\nWebsite: https:\/\/coleblender.com<\/p>\n<p>???? GitHub Repo: https:\/\/github.com\/ColeBlender\/goat-notes<\/p>\n<p>?? Try interactive JavaScript courses we love, right in your browser: https:\/\/scrimba.com\/freeCodeCamp-JavaScript (Made possible by a grant from our friends at Scrimba)<\/p>\n<p>?? Contents ??<br \/>\n?? (0:00:00) Intro<br \/>\n?? (0:02:44) Start Project<br \/>\n?? (0:06:48) Add shacn\/ui, Dark Mode, and Toast<br \/>\n?? (0:08:48) Build Header<br \/>\n?? (0:17:21) Build LogOutButton<br \/>\n?? (0:22:19) Add Auth Pages<br \/>\n?? (0:32:12) Create Supabase Project<br \/>\n?? (0:35:48) Add Supabase Code<br \/>\n?? (0:40:52) Add Auth Code Logic<br \/>\n?? (0:50:02) Add Prisma Code<br \/>\n?? (0:58:35) Build Sidebar<br \/>\n?? (1:04:25) Build Home Page<br \/>\n?? (1:09:11) Set Up OpenAI Account<br \/>\n?? (1:11:22) Build NoteTextInput<br \/>\n?? (1:18:18) Create Context and Custom Hook<br \/>\n?? (1:22:06) Write Update Note Server Action<br \/>\n?? (1:24:27) Finish NewNoteButton<br \/>\n?? (1:29:23) Finish Sidebar<br \/>\n?? (1:51:31) Add Middleware<br \/>\n?? (1:59:43) Add AskAIButton<br \/>\n?? (2:21:43) Deploy to Vercel<br \/>\n?? (2:26:02) Outro<\/p>\n<p>???? Thanks to our Champion and Sponsor supporters:<br \/>\n???? Drake Milly<br \/>\n???? Ulises Moralez<br \/>\n???? Goddard Tan<br \/>\n???? David MG<br \/>\n???? Matthew Springman<br \/>\n???? Claudio<br \/>\n???? Oscar R.<br \/>\n???? jedi-or-sith<br \/>\n???? Nattira Maneerat<br \/>\n???? Justin Hual<\/p>\n<p>&#8212;<\/p>\n<p>Learn to code for free and get a developer job: https:\/\/www.freecodecamp.org<\/p>\n<p>Read hundreds of articles on programming: https:\/\/freecodecamp.org\/news<\/p>\n<div style=\"text-align: center; font-weight: bold\">[<a href=\"https:\/\/www.youtube.com\/watch?v=6ChzCaljcaI\" target=\"offsite\" rel=\"nofollow noopener noreferrer\" title=\"Read More on YouTube\">READ MORE<\/a>]<\/div>\n<p><em style=\"font-family: 'Times New Roman',Times,serif; color: #666;\"><span style=\"font-size: 3.5em; font-weight: bold;\">&#0148;<\/span><\/em><\/p><\/blockquote>\n","protected":false},"excerpt":{"rendered":"<p>Build a full-stack note-taking app with the Next.js 15 App Router, Supabase for authentication and database management, Prisma ORM, and shadcn for cle&#8230;<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[380],"tags":[],"class_list":["post-38654","post","type-post","status-publish","format-standard","hentry","category-video-tutorials"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.4 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>[#Script #Coding] Build a Full Stack AI Note Taking App with Next.js and Supabase &ndash; Tutorial - WHUZZUP!<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/ericbrooks.com\/whuzzup\/script-coding-build-a-full-stack-ai-note-taking-app-with-nextjs-and-supabase-ndash-tutorial\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"[#Script #Coding] Build a Full Stack AI Note Taking App with Next.js and Supabase &ndash; Tutorial - WHUZZUP!\" \/>\n<meta property=\"og:description\" content=\"Build a full-stack note-taking app with the Next.js 15 App Router, Supabase for authentication and database management, Prisma ORM, and shadcn for cle...\" \/>\n<meta property=\"og:url\" content=\"https:\/\/ericbrooks.com\/whuzzup\/script-coding-build-a-full-stack-ai-note-taking-app-with-nextjs-and-supabase-ndash-tutorial\/\" \/>\n<meta property=\"og:site_name\" content=\"WHUZZUP!\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/EricBrooksDotComWeb\/\" \/>\n<meta property=\"article:author\" content=\"EricBrooksDotComWeb\" \/>\n<meta property=\"article:published_time\" content=\"-0001-11-30T00:00:00+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/i3.ytimg.com\/vi\/6ChzCaljcaI\/hqdefault.jpg\" \/>\n<meta name=\"author\" content=\"Eric Brooks\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@EricBrooksCom\" \/>\n<meta name=\"twitter:site\" content=\"@EricBrooksCom\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Eric Brooks\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/ericbrooks.com\\\/whuzzup\\\/script-coding-build-a-full-stack-ai-note-taking-app-with-nextjs-and-supabase-ndash-tutorial\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/ericbrooks.com\\\/whuzzup\\\/script-coding-build-a-full-stack-ai-note-taking-app-with-nextjs-and-supabase-ndash-tutorial\\\/\"},\"author\":{\"name\":\"Eric Brooks\",\"@id\":\"https:\\\/\\\/ericbrooks.com\\\/whuzzup\\\/#\\\/schema\\\/person\\\/3b162468e1f9814f6e9f61460db00a3a\"},\"headline\":\"[#Script #Coding] Build a Full Stack AI Note Taking App with Next.js and Supabase &ndash; Tutorial\",\"datePublished\":\"-0001-11-30T00:00:00+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/ericbrooks.com\\\/whuzzup\\\/script-coding-build-a-full-stack-ai-note-taking-app-with-nextjs-and-supabase-ndash-tutorial\\\/\"},\"wordCount\":252,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\\\/\\\/ericbrooks.com\\\/whuzzup\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/ericbrooks.com\\\/whuzzup\\\/script-coding-build-a-full-stack-ai-note-taking-app-with-nextjs-and-supabase-ndash-tutorial\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/i3.ytimg.com\\\/vi\\\/6ChzCaljcaI\\\/hqdefault.jpg\",\"articleSection\":[\"Video Tutorials\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/ericbrooks.com\\\/whuzzup\\\/script-coding-build-a-full-stack-ai-note-taking-app-with-nextjs-and-supabase-ndash-tutorial\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/ericbrooks.com\\\/whuzzup\\\/script-coding-build-a-full-stack-ai-note-taking-app-with-nextjs-and-supabase-ndash-tutorial\\\/\",\"url\":\"https:\\\/\\\/ericbrooks.com\\\/whuzzup\\\/script-coding-build-a-full-stack-ai-note-taking-app-with-nextjs-and-supabase-ndash-tutorial\\\/\",\"name\":\"[#Script #Coding] Build a Full Stack AI Note Taking App with Next.js and Supabase &ndash; Tutorial - WHUZZUP!\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/ericbrooks.com\\\/whuzzup\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/ericbrooks.com\\\/whuzzup\\\/script-coding-build-a-full-stack-ai-note-taking-app-with-nextjs-and-supabase-ndash-tutorial\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/ericbrooks.com\\\/whuzzup\\\/script-coding-build-a-full-stack-ai-note-taking-app-with-nextjs-and-supabase-ndash-tutorial\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/i3.ytimg.com\\\/vi\\\/6ChzCaljcaI\\\/hqdefault.jpg\",\"datePublished\":\"-0001-11-30T00:00:00+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/ericbrooks.com\\\/whuzzup\\\/script-coding-build-a-full-stack-ai-note-taking-app-with-nextjs-and-supabase-ndash-tutorial\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/ericbrooks.com\\\/whuzzup\\\/script-coding-build-a-full-stack-ai-note-taking-app-with-nextjs-and-supabase-ndash-tutorial\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/ericbrooks.com\\\/whuzzup\\\/script-coding-build-a-full-stack-ai-note-taking-app-with-nextjs-and-supabase-ndash-tutorial\\\/#primaryimage\",\"url\":\"https:\\\/\\\/i3.ytimg.com\\\/vi\\\/6ChzCaljcaI\\\/hqdefault.jpg\",\"contentUrl\":\"https:\\\/\\\/i3.ytimg.com\\\/vi\\\/6ChzCaljcaI\\\/hqdefault.jpg\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/ericbrooks.com\\\/whuzzup\\\/script-coding-build-a-full-stack-ai-note-taking-app-with-nextjs-and-supabase-ndash-tutorial\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/ericbrooks.com\\\/whuzzup\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"[#Script #Coding] Build a Full Stack AI Note Taking App with Next.js and Supabase &ndash; Tutorial\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/ericbrooks.com\\\/whuzzup\\\/#website\",\"url\":\"https:\\\/\\\/ericbrooks.com\\\/whuzzup\\\/\",\"name\":\"WHUZZUP!\",\"description\":\"What&#039;s new at EricBrooks.Com plus news and gossip all over CyberTown\",\"publisher\":{\"@id\":\"https:\\\/\\\/ericbrooks.com\\\/whuzzup\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/ericbrooks.com\\\/whuzzup\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/ericbrooks.com\\\/whuzzup\\\/#organization\",\"name\":\"WHUZZUP!\",\"url\":\"https:\\\/\\\/ericbrooks.com\\\/whuzzup\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/ericbrooks.com\\\/whuzzup\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/ericbrooks.com\\\/images\\\/posts\\\/cropped-favicon_64-1.png\",\"contentUrl\":\"https:\\\/\\\/ericbrooks.com\\\/images\\\/posts\\\/cropped-favicon_64-1.png\",\"width\":512,\"height\":512,\"caption\":\"WHUZZUP!\"},\"image\":{\"@id\":\"https:\\\/\\\/ericbrooks.com\\\/whuzzup\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/EricBrooksDotComWeb\\\/\",\"https:\\\/\\\/x.com\\\/EricBrooksCom\",\"https:\\\/\\\/www.instagram.com\\\/ericbrooksdotcom\\\/\",\"https:\\\/\\\/www.linkedin.com\\\/in\\\/ericbrooksdotcom\",\"https:\\\/\\\/myspace.com\\\/ericbrooksdotcom\",\"https:\\\/\\\/www.pinterest.com\\\/ericbrookscom\\\/\",\"https:\\\/\\\/www.youtube.com\\\/user\\\/ericbrooksdotcom\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/ericbrooks.com\\\/whuzzup\\\/#\\\/schema\\\/person\\\/3b162468e1f9814f6e9f61460db00a3a\",\"name\":\"Eric Brooks\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/62114f8baf9a3737e7686125b69907010ad6aff5dfc07c12707e8a18bb49bc34?s=96&d=blank&r=x\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/62114f8baf9a3737e7686125b69907010ad6aff5dfc07c12707e8a18bb49bc34?s=96&d=blank&r=x\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/62114f8baf9a3737e7686125b69907010ad6aff5dfc07c12707e8a18bb49bc34?s=96&d=blank&r=x\",\"caption\":\"Eric Brooks\"},\"description\":\"Web &amp; Graphic Designer, Blogger, Musician, Evil Clown. I also code websites and promote people for a living. Still kind of a jerk, though. Approach with food.\",\"sameAs\":[\"https:\\\/\\\/ericbrooks.com\",\"EricBrooksDotComWeb\",\"ericbrooksdotcom\",\"ericbrookscom\\\/\",\"https:\\\/\\\/x.com\\\/EricBrooksCom\"],\"url\":\"https:\\\/\\\/ericbrooks.com\\\/whuzzup\\\/author\\\/site-admin\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"[#Script #Coding] Build a Full Stack AI Note Taking App with Next.js and Supabase &ndash; Tutorial - WHUZZUP!","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/ericbrooks.com\/whuzzup\/script-coding-build-a-full-stack-ai-note-taking-app-with-nextjs-and-supabase-ndash-tutorial\/","og_locale":"en_US","og_type":"article","og_title":"[#Script #Coding] Build a Full Stack AI Note Taking App with Next.js and Supabase &ndash; Tutorial - WHUZZUP!","og_description":"Build a full-stack note-taking app with the Next.js 15 App Router, Supabase for authentication and database management, Prisma ORM, and shadcn for cle...","og_url":"https:\/\/ericbrooks.com\/whuzzup\/script-coding-build-a-full-stack-ai-note-taking-app-with-nextjs-and-supabase-ndash-tutorial\/","og_site_name":"WHUZZUP!","article_publisher":"https:\/\/www.facebook.com\/EricBrooksDotComWeb\/","article_author":"EricBrooksDotComWeb","article_published_time":"-0001-11-30T00:00:00+00:00","og_image":[{"url":"https:\/\/i3.ytimg.com\/vi\/6ChzCaljcaI\/hqdefault.jpg","type":"","width":"","height":""}],"author":"Eric Brooks","twitter_card":"summary_large_image","twitter_creator":"@EricBrooksCom","twitter_site":"@EricBrooksCom","twitter_misc":{"Written by":"Eric Brooks","Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/ericbrooks.com\/whuzzup\/script-coding-build-a-full-stack-ai-note-taking-app-with-nextjs-and-supabase-ndash-tutorial\/#article","isPartOf":{"@id":"https:\/\/ericbrooks.com\/whuzzup\/script-coding-build-a-full-stack-ai-note-taking-app-with-nextjs-and-supabase-ndash-tutorial\/"},"author":{"name":"Eric Brooks","@id":"https:\/\/ericbrooks.com\/whuzzup\/#\/schema\/person\/3b162468e1f9814f6e9f61460db00a3a"},"headline":"[#Script #Coding] Build a Full Stack AI Note Taking App with Next.js and Supabase &ndash; Tutorial","datePublished":"-0001-11-30T00:00:00+00:00","mainEntityOfPage":{"@id":"https:\/\/ericbrooks.com\/whuzzup\/script-coding-build-a-full-stack-ai-note-taking-app-with-nextjs-and-supabase-ndash-tutorial\/"},"wordCount":252,"commentCount":0,"publisher":{"@id":"https:\/\/ericbrooks.com\/whuzzup\/#organization"},"image":{"@id":"https:\/\/ericbrooks.com\/whuzzup\/script-coding-build-a-full-stack-ai-note-taking-app-with-nextjs-and-supabase-ndash-tutorial\/#primaryimage"},"thumbnailUrl":"https:\/\/i3.ytimg.com\/vi\/6ChzCaljcaI\/hqdefault.jpg","articleSection":["Video Tutorials"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/ericbrooks.com\/whuzzup\/script-coding-build-a-full-stack-ai-note-taking-app-with-nextjs-and-supabase-ndash-tutorial\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/ericbrooks.com\/whuzzup\/script-coding-build-a-full-stack-ai-note-taking-app-with-nextjs-and-supabase-ndash-tutorial\/","url":"https:\/\/ericbrooks.com\/whuzzup\/script-coding-build-a-full-stack-ai-note-taking-app-with-nextjs-and-supabase-ndash-tutorial\/","name":"[#Script #Coding] Build a Full Stack AI Note Taking App with Next.js and Supabase &ndash; Tutorial - WHUZZUP!","isPartOf":{"@id":"https:\/\/ericbrooks.com\/whuzzup\/#website"},"primaryImageOfPage":{"@id":"https:\/\/ericbrooks.com\/whuzzup\/script-coding-build-a-full-stack-ai-note-taking-app-with-nextjs-and-supabase-ndash-tutorial\/#primaryimage"},"image":{"@id":"https:\/\/ericbrooks.com\/whuzzup\/script-coding-build-a-full-stack-ai-note-taking-app-with-nextjs-and-supabase-ndash-tutorial\/#primaryimage"},"thumbnailUrl":"https:\/\/i3.ytimg.com\/vi\/6ChzCaljcaI\/hqdefault.jpg","datePublished":"-0001-11-30T00:00:00+00:00","breadcrumb":{"@id":"https:\/\/ericbrooks.com\/whuzzup\/script-coding-build-a-full-stack-ai-note-taking-app-with-nextjs-and-supabase-ndash-tutorial\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/ericbrooks.com\/whuzzup\/script-coding-build-a-full-stack-ai-note-taking-app-with-nextjs-and-supabase-ndash-tutorial\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/ericbrooks.com\/whuzzup\/script-coding-build-a-full-stack-ai-note-taking-app-with-nextjs-and-supabase-ndash-tutorial\/#primaryimage","url":"https:\/\/i3.ytimg.com\/vi\/6ChzCaljcaI\/hqdefault.jpg","contentUrl":"https:\/\/i3.ytimg.com\/vi\/6ChzCaljcaI\/hqdefault.jpg"},{"@type":"BreadcrumbList","@id":"https:\/\/ericbrooks.com\/whuzzup\/script-coding-build-a-full-stack-ai-note-taking-app-with-nextjs-and-supabase-ndash-tutorial\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/ericbrooks.com\/whuzzup\/"},{"@type":"ListItem","position":2,"name":"[#Script #Coding] Build a Full Stack AI Note Taking App with Next.js and Supabase &ndash; Tutorial"}]},{"@type":"WebSite","@id":"https:\/\/ericbrooks.com\/whuzzup\/#website","url":"https:\/\/ericbrooks.com\/whuzzup\/","name":"WHUZZUP!","description":"What&#039;s new at EricBrooks.Com plus news and gossip all over CyberTown","publisher":{"@id":"https:\/\/ericbrooks.com\/whuzzup\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/ericbrooks.com\/whuzzup\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/ericbrooks.com\/whuzzup\/#organization","name":"WHUZZUP!","url":"https:\/\/ericbrooks.com\/whuzzup\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/ericbrooks.com\/whuzzup\/#\/schema\/logo\/image\/","url":"https:\/\/ericbrooks.com\/images\/posts\/cropped-favicon_64-1.png","contentUrl":"https:\/\/ericbrooks.com\/images\/posts\/cropped-favicon_64-1.png","width":512,"height":512,"caption":"WHUZZUP!"},"image":{"@id":"https:\/\/ericbrooks.com\/whuzzup\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/EricBrooksDotComWeb\/","https:\/\/x.com\/EricBrooksCom","https:\/\/www.instagram.com\/ericbrooksdotcom\/","https:\/\/www.linkedin.com\/in\/ericbrooksdotcom","https:\/\/myspace.com\/ericbrooksdotcom","https:\/\/www.pinterest.com\/ericbrookscom\/","https:\/\/www.youtube.com\/user\/ericbrooksdotcom"]},{"@type":"Person","@id":"https:\/\/ericbrooks.com\/whuzzup\/#\/schema\/person\/3b162468e1f9814f6e9f61460db00a3a","name":"Eric Brooks","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/62114f8baf9a3737e7686125b69907010ad6aff5dfc07c12707e8a18bb49bc34?s=96&d=blank&r=x","url":"https:\/\/secure.gravatar.com\/avatar\/62114f8baf9a3737e7686125b69907010ad6aff5dfc07c12707e8a18bb49bc34?s=96&d=blank&r=x","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/62114f8baf9a3737e7686125b69907010ad6aff5dfc07c12707e8a18bb49bc34?s=96&d=blank&r=x","caption":"Eric Brooks"},"description":"Web &amp; Graphic Designer, Blogger, Musician, Evil Clown. I also code websites and promote people for a living. Still kind of a jerk, though. Approach with food.","sameAs":["https:\/\/ericbrooks.com","EricBrooksDotComWeb","ericbrooksdotcom","ericbrookscom\/","https:\/\/x.com\/EricBrooksCom"],"url":"https:\/\/ericbrooks.com\/whuzzup\/author\/site-admin\/"}]}},"_links":{"self":[{"href":"https:\/\/ericbrooks.com\/whuzzup\/wp-json\/wp\/v2\/posts\/38654","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ericbrooks.com\/whuzzup\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ericbrooks.com\/whuzzup\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ericbrooks.com\/whuzzup\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ericbrooks.com\/whuzzup\/wp-json\/wp\/v2\/comments?post=38654"}],"version-history":[{"count":0,"href":"https:\/\/ericbrooks.com\/whuzzup\/wp-json\/wp\/v2\/posts\/38654\/revisions"}],"wp:attachment":[{"href":"https:\/\/ericbrooks.com\/whuzzup\/wp-json\/wp\/v2\/media?parent=38654"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ericbrooks.com\/whuzzup\/wp-json\/wp\/v2\/categories?post=38654"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ericbrooks.com\/whuzzup\/wp-json\/wp\/v2\/tags?post=38654"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}