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
Auf dieser Seite können Sie das Online-Video Day 10: The Admin Panel — Next.js, React & TypeScript Explained mit der Dauer stunde minuten sekunde in guter Qualität ansehen, das der Benutzer DevKey Tech. 30 Juni 2026 hochgeladen hat, den Link mit Freunden und Bekannten teilen, dieses Video wurde auf Youtube bereits 16 Mal angesehen und es wurde von 1 den Zuschauern gefallen. Viel Spaß beim Betrachtenden Zuschauern gefallen!
