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
En esta página del sitio puede ver el video en línea Day 10: The Admin Panel — Next.js, React & TypeScript Explained de Duración hora minuto segunda en buena calidad , que subió el usuario DevKey Tech. 30 junio 2026, comparta el enlace con amigos y conocidos, en youtube este video ya ha sido visto 16 veces y le gustó 1 a los espectadores. Disfruta viendo!
