Day 10: The Admin Panel — Next.js, React & TypeScript Explained
Day 10 of the Kamiyab Kisaan FYP course! 🌾
Now we build the admin's command center — the web panel. I explain Next.js, React and TypeScript, how the site is organised with the App Router, and how it's kept strictly admin-only.
In this video you'll learn:
✅ The tools — React, Next.js, TypeScript, Tailwind, Radix/shadcn, Recharts, Axios
✅ The App Router & route groups (folders become pages)
✅ How the site is protected (admin-only auth guard)
✅ How it talks to the backend (Axios + service files)
✅ How a typical admin page loads data (and auto-refreshes)
All examples come straight from the real Kamiyab Kisaan project built with Node.js, Express, MongoDB, React Native and Next.js.
⏱️ TIMESTAMPS
00:00 Intro
00:40 The tools (Next.js, TypeScript & more)
02:30 The App Router & folder structure
04:30 How the site is protected (admin-only)
06:30 Talking to the backend (Axios + services)
08:00 How a page loads data
09:00 Key terms + Viva questions
10:00 What's next (Day 11 — Admin Features)
🎤 Designed to help you UNDERSTAND your project and PASS your FYP viva.
📖 Read the full notes (free): https://dilawarkhaninfo.github.io/kam...
🐙 GitHub: https://github.com/Dilawarkhaninfo
👉 Watch in order: Overview → Day 1 → … → Day 10 → …
🔔 Subscribe so you don't miss Day 11!
#NextJS #React #TypeScript #WebDevelopment #AdminPanel #TailwindCSS #FYP #ComputerScience #FrontendDevelopment #KamiyabKisaan #FinalYearProject
On this page of the site you can watch the video online Day 10: The Admin Panel — Next.js, React & TypeScript Explained with a duration of hours minute second in good quality, which was uploaded by the user DevKey Tech. 30 June 2026, share the link with friends and acquaintances, this video has already been watched 16 times on youtube and it was liked by 1 viewers. Enjoy your viewing!
