The objective of this course is to teach participants to develop customer-facing planet-scale Websites, Full-Stack Apps and templates, Dashboards, and Muti-Cloud Serverless APIs. By the end of the quarter, the participants will be able to develop and deploy web platforms like Facebook, Shopify, etc. The technologies covered in this course will include Next.js 13, Figma, Tailwind CSS, Chakra UI, tRPC, QraphQL, Prisma, Cockroachdb Serverless (PostgreSQL Compatible), AWS Serverless Technologies, and Cloud Development Kit for Terraform (CDKTF).

1. Next.js 13 Web Development

- Next 13 Official Documentation
https://beta.nextjs.org/docs

- Latest Learn React Official Website
https://beta.reactjs.org/learn

- Learn Next.js 13 Learning Repo
https://github.com/panaverse/learn-nextjs

2. Next.js 13 using Chakra UI (Remote Zoom Class)

- CSS Flexbox Explained - Complete Guide to Flexible Containers and Flex Items
https://www.freecodecamp.org/news/css-flexbox-complete-guide/

- Chakra UI Docs
https://chakra-ui.com/getting-started

3. UI/UX Design with Figma, TailwindCSS, and Chakra UI (Remote Zoom Class)

- Designing and Prototyping Interfaces with Figma: Learn essential UX/UI design principles by creating interactive prototypes for mobile, tablet, and desktop by Fabio Staiano
https://www.amazon.com/Designing-Prototyping-Interfaces-Figma-interactive/dp/180056418X/ref=sr_1_1_sspa

- Figma Design Kit for TailwindCSS
https://www.figma.com/community/file/768809027799962739

- Chakra UI Figma Kit
https://www.figma.com/community/file/971408767069651759

4. API Routes with Next.js (Remote Zoom Class)

- API Routes
https://nextjs.org/docs/api-routes/introduction

5. APIs with Next.js and tRPC (Remote Zoom Class)

- Build a tRPC CRUD API Example with Next.js
https://codevoweb.com/build-a-trpc-crud-api-example-with-next-js/

- Stop building REST APIs for your Next.js apps, use tRPC instead
https://brockherion.dev/blog/posts/stop-building-rest-apis-for-your-next-apps/

6. SQL and Prisma (Remote Zoom Class)

- Start from scratch with relational databases
https://www.prisma.io/docs/getting-started/setup-prisma/start-from-scratch/relational-databases-typescript-postgres

- SQL For Beginners Video Tutorial
https://www.youtube.com/watch?v=5hzZtqCNQKk

- Database Management Systems and SQL – Tutorial for Beginners
Database Management Systems and SQL – Tutorial for Beginners

7. Next.js 13 using TailwindCSS (Remote Zoom Class)

- Modern CSS with Tailwind, Second Edition by Noel Rappin
https://pragprog.com/titles/tailwind2/modern-css-with-tailwind-second-edition/

8. AWS Application Composer (Remote Zoom Class)

- What is AWS Application Composer?
https://www.youtube.com/watch?v=BujE_tik5r8

- Event-driven apps with AWS Application Composer
https://www.youtube.com/watch?v=p411uh363jQ

- Visually design and build serverless applications quickly
https://aws.amazon.com/application-composer/

- AWS Free Tier
https://aws.amazon.com/free/

Note: For AWS Free Tier you will need a credit or debit card. The easiest way for Pakistani students is to open a bank account with Meezan Bank. Open a Meezan Aasan Account if you have no earning proof. Meezan Bank will charge Rs. 1100 for ATM Debit Card and there is a requirement of Rs. 100 minimum deposit. The card will be delivered in a few weeks. Our students have reported that this Debit card works with AWS.

You can also get a $300 credit
https://pages.awscloud.com/adoptf90d_GLOBAL_POC-credits.html

9. Multi-Cloud GraphQL Serverless API Development with Cloud Development Kit for Terraform (CDKTF) (Remote Zoom Class)

- Learn Multicloud Serverless API Development using CDK Terraform in Baby Steps
https://github.com/panaverse/learn-multicloud-api-development

1. Next.js Projects

2. Styling Next.js Projects using TailwindCSS and Chakra UI

3. Todo Full-Stack App

4. Build a Twitter Clone