잠시만 기다려 주세요.
Lama Dev
2024. 8. 19.
React Next.js admin dashboard project tutorial for beginners. School management app design with Next.js and Tailwind. Admin, teacher, student, and parent dashboards with responsive tables and animated charts. You are watching the first part of the project (The design part) Watch the second part (Full-stack school management app): https://youtu.be/6sfiAyKy8Jo If it is valuable to you, you can support Lama Dev. Join: https://www.youtube.com/channel/UCOxWrX5MIdXIeRNaXC3sqIg/join Buy me a coffee: https://www.buymeacoffee.com/lamadev Source Code: Start here: https://github.com/safak/next-dashboard-ui/tree/starter Completed version: https://github.com/safak/next-dashboard-ui/tree/completed Join Lama Dev groups X / Twitter: https://x.com/lamawebdev Facebook: https://www.facebook.com/groups/lamadev Instagram: https://www.instagram.com/lamawebdev Discord: https://discord.gg/yKremu4mPr 00:00 Introduction 02:38 Installation 05:06 Next.js 15 Pages and Layout Tutorial 11:01 Next.js Tailwind Responsive Layout 18:10 Next.js Tailwind Responsive Menu Design 23:01 Next.js Tailwind Responsive Navbar Design 30:18 Next.js Admin Dashboard Design 39:40 Next.js Animated Chart Tutorial 40:51 Next.js Radial Chart with Re-Charts 52:19 Next.js Animated Bar Chart Example 01:00:11 React Next.js Animated Line Chart Example 01:05:54 React Calendar Tutorial 01:10:36 Events Component Design 01:15:04 Announcement Component Design 01:20:10 Next.js Student Dashboard Design 01:25:56 React Big Calendar (Schedule Calendar) Tutorial 01:43:01 School Management App Parent Dashboard Design 01:43:54 React/Next.js List Table Design with Pagination 01:53:56 React/Next.js Responsive Reusable List Table 02:11:20 School Management App Other List Pages 02:34:08 School Management App Single Teacher Page Design 02:58:15 School Management App Single Student Page Design 03:00:17 Next.js Dynamic Form Buttons (Create, Update, Delete) 03:09:12 React/Next.js Form Modal Design 03:17:11 React Next.js Form Design 03:18:35 React-Hook-Form Tutorial 03:19:35 React-Hook-Form with Zod Validation Tutorial 03:32:25 React/Next.js Form Inputs with Validation 03:47:48 Rendering Forms Conditionally in React 03:50:30 Next.js Lazy Loading Import Tutorial with dynamic() 03:54:22 Outro
In this crash course on Keystatic, you'll build a simple blog with Next.js. You'll learn about the Keystatic config, schema, collections, singletons, as well as various fields. You'll deploy the project on Vercel, and connect Keystatic to a GitHub account with the Cloud and GitHub modes. Let's dive in! # Chapters 0:00 - Keystatic CLI 1:24 Content path 4:02 New collection 7:49 Image field 11:17 Belongs-to-one relationship 12:54 Belongs-to-many relationship 16:13 Repeatable blocks field 21:09 Reader API 24:38 Display Content 26:55 Next.js’ Route Groups 32:07 Displaying Keystatic Block Fields 37:31 Retrieving ‘Has Many’ Relationships 40:59 Keystatic-generated Types 50:12 Component blocks on document field 54:33 Rendering Component Blocks 56:16 Entry layout 57:22 Singletons 1:01:15 Customising the Sidebar 1:03:37 Changing logo + site name 1:05:12 Deploy to Vercel 1:08:44 Generate Pages with generateStaticParams 1:11:05 Keystatic Cloud 1:18:04 Manually Connect to GitHub 1:24:59 Keystatic mode toggle
2023. 12. 14.
2024. 10. 21.
Join this channel to get access to perks: https://www.youtube.com/channel/UCDVpu3Y40Pcp3hN9b7se-jQ/join You can Follow me on 👇 *Twitter :-*. https://x.com/tushardotcom29 *Linkedin :-* https://www.linkedin.com/in/tushar-vashishth-b15998172/ *Instagram :* https://www.instagram.com/codingwithtushar_ *GitHub Repo Link 👇* https://github.com/TusharVashishth/clash/tree/main This complete guide will teach you how to master full-stack development using Next.js, Express, and TypeScript. Whether you are a beginner or looking to enhance your skills, this course will take you through the process step by step. By the end, you will have a solid understanding of how to build web applications with these powerful technologies. Stay tuned and start your journey to becoming a proficient full-stack developer! #nodejs #nextjs14 #typescript #backend #frontend #programming #queues #redis
2024. 7. 29.
2024. 4. 15.
Product Engineer Community 를 런칭하기에 앞서 서비스 개발기부터 모두 라이브로 공유하려고 합니다. 과정을 공유하며 함께 서비스를 만들어가면 더욱 완성도가 높아질것 같아서요. 풀스택 서비스 개발에 흥미가 있는 모든 프론트엔드 엔지니어분들 환영입니다. 🤗
2024. 8. 18.
In this video, I go over my freelancing journey and share the strategies that helped me land and onboard clients. You can implement these same strategies in your own freelancing business. Shoutout to cal.com for partnering with me on this video Checkout cal.com: https://cal.com Follow me on Twitter: https://dub.sh/ras-twitter Join my Discord: https://dub.sh/discord-rasmic My portfolio: https://rasmic.xyz My Nextjs SAAS Starter Kit: https://starter.rasmic.xyz My Blog Builder & CMS: https://tsafi.xyz Browser I use (Arc): https://dub.sh/my-browser Recording & Editing Software: https://dub.sh/my-editing
2024. 10. 21.