22
5 506

Learn Next.js Basics by Building a Random Number Generator App

12:58

Responsive Header in tailwindcss and Nextjs

12:05

Learn to Build a Multi-Step Form in Nextjs 14 by Creating a Job Application Form

1:41:16

Get Form Submissions to your Inbox in Nextjs 14 with web3forms

17:59

How to Build a Book Library (CRUD App) with Nextjs 14, AWS Lambda, AWS Api Gateway and DynamoDb

1:02:29

I Asked ChatGPT for the 10 Best VS Code Extensions, Here’s What I Got

8:59

How to Build an MDX Blog with Next.js 15

A Blog app built using Next.js 15, MDX (markdown), Prismjs and Tailwind CSS,. This app is static site that renders the markdown posts.
🔗 Links:
Checkout the complete code for this project here: github.com/thetechmaze/nextjs-mdx-blog
Checkout the figma file here: www.figma.com/community/file/1216616090937021365/free-blog-template-modern-creative-design
prismjs (syntax highlighting): prismjs.com/index.html
nextjs - mdx : nextjs.org/docs/app/building-your-application/configuring/mdx
tailwindcss typography plugin : github.com/tailwindlabs/tailwindcss-typography
🔧 Technologies Used:
- Next.js 15
- Tailwind CSS
- MDX
- Prismjs
🔔 Don't forget to subscribe!
If you found this tutorial helpful, please like the video, comment, and subscribe for more tech tutorials!
⏰ Timestamps:
00:00:00 - Demo
00:01:19 - Creating next app
00:03:54 - Creating ThemeProvider
00:09:14 - Creating the Header
00:18:56 - Modify tailwind.config,ts
00:19:37 - Creating the Footer
00:22:51 - Hero
00:28:48 - adding mdx
00:32:10 - creating MDX layout
00:37:46 - creating posts frontmatter in json format
00:41:25 - Adding Posts in Home Page
00:49:50 - Adding Posts in Blog Page
00:50:49 - Adding blog posts
00:52:05 - Adding Thumbnail in Blog Post
00:59:37 - Adding Syntax Highlighting
01:09:57 - npm run build

มุมมอง: 218

วีดีโอ

Learn Next.js Basics by Building a Random Number Generator App

12:58

Learn Next.js Basics by Building a Random Number Generator App

มุมมอง 482 หลายเดือนก่อน

In this video, we will go through the basics of nextjs 15 by building an random number generator app 🔔 Don't forget to subscribe! If you found this tutorial helpful, please like the video, comment, and subscribe for more tech tutorials! ⏰ Timestamps: 00:00 - Intro 00:18 - Creating the project 02:18 - Removing Default template 03:20 - Coding page.tsx 06:14 - Creating Client Component 12:09 - npm...

Responsive Header in tailwindcss and Nextjs

12:05

Responsive Header in tailwindcss and Nextjs

มุมมอง 1062 หลายเดือนก่อน

Building a mobile friendly responsive header in Tailwindcss and Nextjs 🔧 Technologies Used: Next.js Tailwind CSS 🔔 Don't forget to subscribe! If you found this tutorial helpful, please like the video, comment, and subscribe for more tech tutorials! 📦 Some Other Videos: Learn to Build a Multi-Step Form in Nextjs 14 by Creating a Job Application Form - th-cam.com/video/xgveNLZ2Rh4/w-d-xo.html How...

Learn to Build a Multi-Step Form in Nextjs 14 by Creating a Job Application Form

1:41:16

Learn to Build a Multi-Step Form in Nextjs 14 by Creating a Job Application Form

มุมมอง 6522 หลายเดือนก่อน

A multi-step Job Application form built using Nextjs 14, Zustand for state management, and Zod for schema validation. This form captures personal information, experience, and educational background from applicants, with validation to ensure correctness of the data entered. 🔗 GitHub Repo: github.com/thetechmaze/job-app-multi-step-form-nextjs 🔧 Technologies Used: Nextjs Tailwind CSS Zustand Zod 📦...

Get Form Submissions to your Inbox in Nextjs 14 with web3forms

17:59

Get Form Submissions to your Inbox in Nextjs 14 with web3forms

มุมมอง 1372 หลายเดือนก่อน

In this video, I’ll guide you on how to create a form that sends submissions to our email inbox. We will be using Next.js and Web3Forms. 🔗 GitHub Repo: Check out the complete code for this project here: github.com/thetechmaze/forms-web3forms 🔔 Don't forget to subscribe! If you found this tutorial helpful, please like the video, comment, and subscribe for more tech tutorials! ⏰ Timestamps: 00:00...

How to Build a Book Library (CRUD App) with Nextjs 14, AWS Lambda, AWS Api Gateway and DynamoDb

1:02:29

How to Build a Book Library (CRUD App) with Nextjs 14, AWS Lambda, AWS Api Gateway and DynamoDb

มุมมอง 1.4K3 หลายเดือนก่อน

📘 Project Overview: A simple Book Library app built using Next.js 14, Tailwind CSS, AWS DynamoDB, AWS Lambda and AWS API Gateway. This app showcases CRUD (Create, Read, Update, Delete) operations for managing books, with server actions in Next.js and DynamoDB as the database. 🔗 GitHub Repo: Check out the complete code for this project here: github.com/thetechmaze/book-library-next-dynamo Check ...

I Asked ChatGPT for the 10 Best VS Code Extensions, Here’s What I Got

8:59

I Asked ChatGPT for the 10 Best VS Code Extensions, Here’s What I Got

มุมมอง 1563 หลายเดือนก่อน

In this video, you will see vs code extension that i got from chatgpt and also 3 bonus extensions that i use daily 🔔 Don't forget to subscribe! If you found this video helpful, please like the video, comment, and subscribe for more tech tutorials! ⏰ Timestamps: 00:00 - Intro 00:13 - Extension 1: CodeSnap 02:11 - Extension 2: Peacock 02:47 - Extension 3: Better Comments 03:32 - Extension 4: Todo...