- 12
- 42 627
Dev Inteprid
Australia
Приєднався 30 гру 2023
🚀 Welcome to Dev Intrepid, your go-to destination for mastering the latest in web development! I'm Bipul Poudel, your guide on this coding journey. If you're passionate about building sleek, modern web applications and diving deep into cutting-edge technologies, you're in the right place.
On this channel, we explore the dynamic world of web development using tools like Next.js 14, TypeScript, Tailwind CSS, and more. Whether you're a seasoned developer looking to stay ahead of the curve or a coding enthusiast eager to learn, Dev Intrepid is here to empower you with practical tutorials, in-depth insights, and hands-on projects. We'll build real-world projects, tackle common challenges, and uncover the secrets of efficient and scalable web development.
Don't forget to hit that subscribe button, ring the notification bell, and join our community of intrepid developers. Together, let's embark on a journey of innovation, exploration, and mastery. Ready to code boldly? Let's dive in! 🚀💻✨
On this channel, we explore the dynamic world of web development using tools like Next.js 14, TypeScript, Tailwind CSS, and more. Whether you're a seasoned developer looking to stay ahead of the curve or a coding enthusiast eager to learn, Dev Intrepid is here to empower you with practical tutorials, in-depth insights, and hands-on projects. We'll build real-world projects, tackle common challenges, and uncover the secrets of efficient and scalable web development.
Don't forget to hit that subscribe button, ring the notification bell, and join our community of intrepid developers. Together, let's embark on a journey of innovation, exploration, and mastery. Ready to code boldly? Let's dive in! 🚀💻✨
Move Elements on Scroll Animation Tutorial with Tailwind, and Framer Motion | Inspired by Wix
Learn how to create stunning scroll animations where elements move dynamically to targeted positions, just like on Wix's website! In this tutorial, I'll guide you step-by-step using Next.js, Tailwind CSS, and Framer Motion. Perfect for developers looking to add interactive, visually appealing animations to their websites.
✅ GitHub Code: github.com/bipulpoudel/move-element-animation-framer-motion
This tutorial is beginner-friendly and perfect for anyone wanting to implement professional animations effortlessly. Don't forget to like, comment, and subscribe for more tutorials!
✅ GitHub Code: github.com/bipulpoudel/move-element-animation-framer-motion
This tutorial is beginner-friendly and perfect for anyone wanting to implement professional animations effortlessly. Don't forget to like, comment, and subscribe for more tutorials!
Переглядів: 136
Відео
Sign In with Social Providers (Google, Apple, Facebook) | React Native Expo | Clerk | Tutorial 2024
Переглядів 78621 день тому
Unlock the power of social authentication in your React Native Expo app! 🚀 In this step-by-step tutorial, we'll show you how to integrate Google, Apple, and Facebook sign-in using Clerk. This is the ultimate guide for seamless authentication in 2024, perfect for anyone building modern mobile apps. 💻 What You'll Learn: ✅ Setting up Clerk for your React Native app ✅ Adding Google, Apple, and Face...
Part 3: Finalized Advanced Data Table: Sorting, Searching, Pagination | Express.js, PostgreSQL
Переглядів 61821 день тому
In this video, we’ll show you how to seamlessly integrate a backend API with a frontend powered by Tanstack Table to finalize your advanced data table project. With sorting, searching, and pagination fully functional, you’ll learn how to connect the dots between your Express.js and PostgreSQL backend and a dynamic Next.js frontend. What You’ll Learn: Finalizing API endpoints for sorting, search...
Part 2: Build a Backend API for Data Table: Sorting, Searching, Pagination | Express.js, PostgreSQL
Переглядів 2,3 тис.Місяць тому
In this video, we’ll show you how to create a backend API that powers an advanced data table with features like sorting, searching, and pagination using Express.js and PostgreSQL. This step-by-step guide will help you build a robust API that seamlessly integrates with the Tanstack Table frontend for dynamic and efficient data handling. What You’ll Learn: Setting up an Express.js backend server....
Part 1: Build Advance Data Table (Next.js, Shadcn, React Table - Tanstack, Tailwind)
Переглядів 3,4 тис.Місяць тому
In this tutorial, we'll walk you through building a fully functional and stylish advanced data table using Next.js, Shadcn, Tanstack's React Table, and Tailwind CSS. This step-by-step guide will help you implement features like sorting, pagination, filtering, and custom styling, all while maintaining a responsive design. Whether you're building an admin panel, a data dashboard, or any project r...
Understanding K-Means clustering with visualization and concepts
Переглядів 834 місяці тому
In this video, we dive deep into the K-Means clustering algorithm, a popular technique in machine learning and data science. Whether you're a beginner or looking to brush up on your knowledge, this video covers everything from the basic concepts to advanced topics like K-Means initialization. We'll also walk you through practical examples and a step-by-step demonstration to help you understand ...
Day 1: Creating my first SaaS product: Building an Analytics Dashboard from Scratch
Переглядів 30310 місяців тому
Welcome to the first episode of my journey in building an analytics dashboard from the ground up! In this video, I'm taking you through the initial stages of my project - from conceptualizing the idea to laying down the first lines of code. I'll be sharing insights into the challenges and breakthroughs I encounter, the technologies I'm using, and the strategies I'm implementing to create a user...
Role-based Authentication in Next 14 using Next-Auth | App Router | Protected Routes | Custom Hooks
Переглядів 11 тис.10 місяців тому
🔒 Welcome to my comprehensive guide on implementing user-based role authentication in Next.js 14 using the Next-Auth library! In this tutorial, I'll take you on a coding journey where we explore the intricacies of setting up protected routes with middleware in Next.js 14. 👨💻 What's Inside: - A step-by-step walkthrough of the code to help you understand how to protect your routes using middlewa...
Database design: E-commerce products, categories and sub categories functionality with admin panel
Переглядів 1,3 тис.10 місяців тому
Join me in this straightforward video guide on setting up products and categories for your online store. We'll cover everything from basic database design to implementing a multi-level category system in your admin panel. First, I'll show you how to create a simple yet effective database structure that can handle products, categories, subcategories, and even deeper levels. You'll learn how to o...
Understanding Layouts and Templates in Next.js - A Comprehensive Guide | Dev Inteprid
Переглядів 68811 місяців тому
Welcome to another episode on "Dev Inteprid"! In today's video, we're diving deep into the world of Next.js, focusing on the key differences between layouts and templates. This guide is tailored for both beginners and intermediate developers who want to enhance their Next.js skills. Timeline: 0:00 - Intro Introduction to the channel and today's topic. Brief overview of Next.js and its importanc...
Dynamic Table in Next JS Tutorial: Setting Up Project and Building Frontend for Filters (Part 1)
Переглядів 7 тис.Рік тому
Welcome to Part 2 of our comprehensive Next.js Dynamic Table Tutorial series! In this episode, we continue our journey to create a powerful and interactive data table with a focus on frontend development. Key Features in This Tutorial: 🚀 Seamless Project Setup with Next.js 14 🎨 Tailwind CSS and Shadcn UI Integration for Visual Appeal 🔍 Dynamic Search Input Component for Quick Data Retrieval 🔄 L...
Mastering Next.js 14: Creating a Dynamic Sidebar with TypeScript and Tailwind CSS
Переглядів 15 тис.Рік тому
Welcome to another episode of Dev Intrepid! In this tutorial, we'll dive deep into the latest web development technologies - Next.js 14, TypeScript, and Tailwind CSS. Follow along as we build a sleek and responsive sidebar, perfect for modern web applications. 🔧 Technologies Covered: Next.js 14 TypeScript Tailwind CSS 📚 What You'll Learn: Setting up a Next.js 14 project with TypeScript Integrat...
Hey this looks great. Would you be able to build a school management app?
You mean full stack school management app in web? For tutorials?
I am currently working on similar animation effects, and this video really helped me with the step-by-step explanation. Thanks
Thank you so much for your comment, much appreciated!
Good job, Best of luck 👍🏻
Many many thanks
2:32 clerk auth chapter
Apologies, I haven't added the timeline my video, make sure, will update if from next time. Thank you.
(NOBRIDGE) ERROR Error message: Cannot read property 'captchaProvider' of undefined (NOBRIDGE) ERROR Full error: [TypeError: Cannot read property 'captchaProvider' of undefined] can you help me i always got this eeror when signing up
Hi, I am not sure, why that is happening, Can you share your code? I looked into it on search, found that there is a possibility you are missing the provider.
Solid work!
Thank you for your comment :)
bro I'm getting this weird error, after my first initial log in with google auth, when I try to log in again with different gmails, the browser doesn't pop up the account page, it just log in the first initial account automatically, how do I get the different gmails page?
I didn't receive any issue, Do you mind sharing your code? And I could look into it? Maybe it's a cache issue? And are you testing on android or ios?
how to set column filters popup panel in column header icon click?
Hi, I didn't get what you are trying to say? Do you mean you need column filters on column headers like a popover?
how to set column filters in column header icon click?
Hi, I didn't get what you are trying to say? Do you mean you need column filters on column headers like a popover?
@@DevInteprid yes
I guess you have to use popover component with button. You can see in the documentation: ui.shadcn.com/docs/components/popover
Thank you for the video !!
Thank you for your comment :). Much appericated.
This looks great, thanks for sharing the code! Keep adding videos to the playlist :D
Thank you for your comment. I have completed all videos for playlist . The next one is : Part 2: Build a Backend API for Data Table: Sorting, Searching, Pagination | Express.js, PostgreSQL ua-cam.com/video/LIv7-EKNQto/v-deo.html
And this is the final part where I integrated backend with frontend at part 3: Part 3: Finalized Advanced Data Table: Sorting, Searching, Pagination | Express.js, PostgreSQL ua-cam.com/video/XmkbfgcJqRY/v-deo.html
Thank you for tutorial, I was stuck in issue of Missing Captcha token, this video helped me. Thanks!
Thank you for your comment, yes I also faced same issue earlier so thought I should created a video around it.
Thank you for tutorial, I was stuck in issue of Missing Captcha token, this video helped me. Thanks!
Thank you for your comment, yes I also faced same issue earlier so thought I should created a video around it.
Thank you for tutorial as always! :)
My pleasure!
Hello, I appreciate the tutorials; they are very informative. How do u make the illustrations, such as the one for access denied? Is there an app for the illustrations and designs?
Thank you for your comment, much appericated! For the illustration, I use website called undraw.co/illustrations. Feel free to subscribe to my channel for new content and video, Cheers!
Thank you for the video !
My pleasure! Thank you for your support.
Thank you for the video, Really helpful tutorial as always!
Glad it was helpful!
Thank you for the video, Really helpful tutorial :)
Glad it was helpful!
Thank you for the video, Really helpful tutorial :)
Glad it was helpful!
@@DevInteprid Deployment?
Do you want me to create video on deployment?
@@DevInteprid Yeah! because at last this only matters. Its the reason to make it.
Surely, Will see if I can get time to create a deployment tutorial too. Thanks for suggestion!
Thank you for source code!
Good tutorial , thank you for the video! :)
Please Provide full UI Tutorial Video...
Hi there, surely, I will add full UI tutorial video soon.
Hi there, I have added a new video part 2 and part 3 for this video, feel free to check it out. ua-cam.com/video/LIv7-EKNQto/v-deo.html
Thank you for this tutorial, The backend api and your video was helpful.
Thank you for your comment :)
Thank you for this tutorial, The backend api and your video was helpful.
Thank you for your comment :).
Hi guys, Thank you for your support and comments. I have added new part of this playlist. ua-cam.com/video/LIv7-EKNQto/v-deo.html This video I have a tutorial for building a backend API for Data Table: Sorting, Searching, Pagination.
thank you sir. give us full tutorial please!
Thank you for your comment!, will post a full tutorial soon :)
Hi there, I have added a new video part 2 and part 3 for this video, feel free to check it out. ua-cam.com/video/LIv7-EKNQto/v-deo.html
Great work... Is this supporting server side rendering
Hi do you mean server side fetching or rendering? Because I am using use state for pagination and useTable hook, so it’s a client side rendering, but it can be separated out into a component and whole page can be made as server side rendering
@@DevInteprid i meant whole things is server side pagination get data into table search in table get data into table... And all stuff is server side
Surely, will do that, I will create a next series with adding server side content on this UI
Great work keep going @@DevInteprid
Hi there, I have added a new video part 2 and part 3 for this video, feel free to check it out. ua-cam.com/video/LIv7-EKNQto/v-deo.html
Please do share a full tutorial for this
Hi there, I have added a new video part 2 and part 3 for this video, feel free to check it out. ua-cam.com/video/LIv7-EKNQto/v-deo.html
Thank you fo sharing sir
Thank you for your comment. :)
Thank you very much for sharing this with us mate! Definitely a full video will be awesome 🙌
Thanks you for your comment. Full video you mean UI video or using this UI to integrate with backend? :), Let me know
Hi there, I have added a new video part 2 and part 3 for this video, feel free to check it out. ua-cam.com/video/LIv7-EKNQto/v-deo.html
Thank you for the source code, A full tutorial will be definitely helpful.
Hi people, Apologies for the delay, I wasn't active and wasn't in state to create any video at all for last 10 months. I have created a new video which has the github repo for frontend for complex data table. ua-cam.com/video/50lvC3g9c1c/v-deo.html Let me know, if that helps.
Bro where is part2?
Apologies for the delay, I wasn't active and wasn't in state to create any video at all for last 10 months. I have created a new video which has the github repo for frontend for complex data table. ua-cam.com/video/50lvC3g9c1c/v-deo.html Let me know, if that helps.
Where's the part 2?
Apologies for the delay, I wasn't active and wasn't in state to create any video at all for last 10 months. I have created a new video which has the github repo for frontend for complex data table. ua-cam.com/video/50lvC3g9c1c/v-deo.html Let me know, if that helps.
i need it
Since 8 month we still wait part 2.
Apologies for the delay, I wasn't active and wasn't in state to create any video at all for last 10 months. I have created a new video which has the github repo for frontend for complex data table. ua-cam.com/video/50lvC3g9c1c/v-deo.html Let me know, if that helps.
is it responsive ?
Where's the part 2?
Apologies for the delay, I wasn't active and wasn't in state to create any video at all for last 10 months. I have created a new video which has the github repo for frontend for complex data table. ua-cam.com/video/50lvC3g9c1c/v-deo.html Let me know, if that helps.
Nice explanation, first video that provide detailed explanation
Thanks for your comment !
Great explanation !!
Thank you ❤️❤️
Where is your next part :)
Apologies for the delay, I wasn't active and wasn't in state to create any video at all for last 10 months. I have created a new video which has the github repo for frontend for complex data table. ua-cam.com/video/50lvC3g9c1c/v-deo.html Let me know, if that helps.
Is it possible to get latest role and permissions to user without re-login
Yes, depends on how you structure your user role fetching.
Suprb bro! well explained doc for RABC implementing
So good 😊
Thank you :)
Greate video! It would be awesome if you make a full project video using Nextjs and prisma
Nice Tutorial, good job btw does it also work with nesting submenu?
You did great job for this app router, where i was getting confuse, bcos I know what to do for achieve this but how to implement this in new app router was big confusion. Grate Job. i have done almost similar thing using CASL library in my old next project(page router, not app router). what i have done different is: const MyProductPage = () => { ....component code here } // below is access control object for this component. and all role and permissions is already comming from DB with user login so i build ability context for later use like hide/show button or nav menu or other thing and can also do access denied kind of stuff. MyProductPage.acl = { action: permissions.VIEW, ---> 'view' subject: modules.product ---> 'product' } export default MyProductPage and i created permission check wrapper and wrap whole app. there is lot more but you will get idea.
Very good project, I liked it a lot, when you will post part 2 of how to pass the parameters to fetch
Apologies for the delay, I wasn't active and wasn't in state to create any video at all for last 10 months. I have created a new video which has the github repo for frontend for complex data table. ua-cam.com/video/50lvC3g9c1c/v-deo.html Let me know, if that helps.