Visit brilliant.org/Sahand 🚀 if you want to master a programming language and tackle real-world problems. Begin your 30-day trial using the link (and if you're among the first 200 users, you'll also enjoy an extra 20% off).
Looking to master Next.js 14? Look no further! Dive into our comprehensive Next.js tutorial where we cover everything from the basics to advanced techniques. Whether you're starting a Next.js project or building a full Next.js and Tailwind CSS website, this crash course has you covered. Explore the latest features of Next.js 14 and learn how to create stunning portfolios and projects. With our Next.js 14 full course, you'll be equipped with the skills to tackle any Next.js challenge. Join us on this exciting Next.js journey and level up your development skills today!
Source code and final version: github.com/sahandghavidel/goo...
Eraser diagram: app.eraser.io/workspace/yVKH1...
timestamp:
00:00 - Intro
01:46 - Resources
03:40 - Next.js 14 app directory file and folder structure
20:12 - Install Next.js and tailwind CSS and create the first template
31:19 - Add home header component
39:29 - Add body section
01:05:06 - Add footer component
01:15:26 - Create search page for web and image
01:21:03 - Update the search header component
01:28:12 - Complete the search box component
01:38:21 - Complete the search header options
01:48:28 - Fetch data from google search API and show the titles
01:54:56 - Handle possible errors
02:03:17 - Create search result component
02:16:38 - Add image results
02:26:23- Add pagination component
02:39:00 - Add loading effects for web and image pages
02:49:04 - Deploy to Vercel
30 июл 2024
