ZTM Next - Js Course Code Guide
ZTM Next - Js Course Code Guide
Master project #1: Build your first Next.js app | Coffee Connoisseur
App background
● https://meshgradient.com/
● Unique Mesh Gradient Used
Routing in Next.js
● https://nextjs.org/docs/routing/introduction
● https://developer.mozilla.org/en-US/docs/Web/API/History_API
● https://reactrouter.com/
Setup Fonts
● https://fonts.google.com/specimen/IBM+Plex+Sans?query=ibm+plex+sans
Document in Next.js
● https://nextjs.org/docs/advanced-features/custom-document
Fallback: true
● https://nextjs.org/docs/basic-features/data-fetching#fallback-true
What is Airtable
● https://airtable.com/
Airtable Library
● https://github.com/airtable/airtable.js/
● https://airtable.com/api
Deployment to Vercel
● https://nextjs.org/docs/deployment
● https://vercel.com/dashboard
What is Netlify?
● https://www.netlify.com/
● https://www.netlify.com/with/nextjs
Netlify Deployment
● https://docs.netlify.com/configure-builds/common-configurations/next-js/
Lighthouse Performance
● https://web.dev/measure/
Setup Fonts
● https://fonts.google.com/specimen/Roboto+Slab?query=roboto+slab
● https://nextjs.org/docs/advanced-features/custom-document
NavBar Router
● https://nextjs.org/docs/api-reference/next/router
Magic Implementation
● https://magic.link/docs/api-reference/client-side-sdks/web#loginwithmagiclink
SignOut a User
● https://nextjs.org/docs/api-reference/next/link#if-the-child-is-a-custom-component-
that-wraps-an-a-tag
Loading Component
● https://projects.lukehaas.me/css-loaders/
Why GraphQL
● https://developers.google.com/youtube/v3/docs/search/list
What is GraphQL
● https://graphql.org/
GraphQL Example
● https://api.spacex.land/graphql/
What is Hasura
● https://hasura.io/
Hasura DB Architecture
● https://magic.link/docs/api-reference/client-side-sdks/web#getmetadata
What is JWT?
● https://jwt.io/
Deployment To Vercel
● https://vercel.com/dashboard
Node.js install
● https://nodejs.org/en/
Postman
● https://www.postman.com/downloads/
For more courses, resources and workshop, visit https://zerotomastery.io