Code Dusting
Code Dusting
  • 58
  • 54 116
16. Finalizing design optional + useSearchParams + searchParams | NextJS App Router Crash Course
16. Finalizing design optional + useSearchParams + searchParams | NextJS App Router Crash Course
-----------------------------------------------------------------------------------------------------------
Timestamps:
00:00 - Page Designing (optional)
19:48 - useSearchParams hook (client-side)
24:36 - searchParams (server-side)
27:00 - Auth forms - Login and Signup Designs (optional)
32:00 - Blog designing (optional)
-----------------------------------------------------------------------------------------------------------
GitHub Repo: github.com/codedusting/next-crash-course
Complete Playlist: th-cam.com/play/PLSJT2JkBBWbGADVH8ENbu_FFWoQ-68LSX.html
------------------------------------------------------------------------------------------------------------
Social:
Twitter: codedusting
Hindi Channel: www.youtube.com/@codedustinghindi
------------------------------------------------------------------------------------------------------------
#crashcourse #nextjs #nextjs14
มุมมอง: 226

วีดีโอ

15. Blog Design + Dynamic Routes + Error Handling | NextJS App Router Crash Course
มุมมอง 1677 หลายเดือนก่อน
15. Blog Design Dynamic Routes Error Handling | NextJS App Router Crash Course Timestamps: 00:00 - Blog Design (optional) 03:00 - Dynamic Routes GitHub Repo: github.com/codedusting/next-crash-course Complete Playlist: th-cam.com/play/PLSJT2JkBBWbGADVH8ENbu_FFWoQ-68LSX.html Social: Twitter: codedusting Hindi Channel: www.youtube.com/@codedustinghindi #crashcourse #nextjs #nextjs14
14. Starting blog design and custom not found page | NextJS App Router Crash Course
มุมมอง 1317 หลายเดือนก่อน
14. Starting blog design and custom not found page | NextJS App Router Crash Course In this video, we will look custom not found page in NextJS 13/14 Timestamps: 00:00 - Error Page GitHub Repo: github.com/codedusting/next-crash-course Complete Playlist: th-cam.com/play/PLSJT2JkBBWbGADVH8ENbu_FFWoQ-68LSX.html Social: Twitter: codedusting Hindi Channel: www.youtube.com/@codedustinghin...
13. Server and Client Component Boundary Concept | NextJS App Router Crash Course
มุมมอง 1617 หลายเดือนก่อน
13. Server and Client Component Boundary Concept | NextJS App Router Crash Course In this video, we will look client vs server boundary concept in NextJS 13/14 Timestamps: 00:00 - Mental Model Concept GitHub Repo: github.com/codedusting/next-crash-course Complete Playlist: th-cam.com/play/PLSJT2JkBBWbGADVH8ENbu_FFWoQ-68LSX.html Social: Twitter: codedusting Hindi Channel: www.youtube...
12. Server Actions, Client Form, and useTransitionHook | NextJS App Router Crash Course
มุมมอง 882ปีที่แล้ว
12. Server Actions, Client Form, and useTransitionHook | NextJS App Router Crash Course
11. Route Groups | NextJS App Router Crash Course
มุมมอง 477ปีที่แล้ว
11. Route Groups | NextJS App Router Crash Course
10. More Routing Concepts | NextJS App Router Crash Course
มุมมอง 480ปีที่แล้ว
10. More Routing Concepts | NextJS App Router Crash Course
9. Link Client Component and Custom Hook | NextJS App Router Crash Course
มุมมอง 1Kปีที่แล้ว
9. Link Client Component and Custom Hook | NextJS App Router Crash Course
2. Setup WSL2 & Windows Terminal for Web Development | Oh-My-Zsh, zsh, nvm, nodejs, pnpm, yarn
มุมมอง 765ปีที่แล้ว
2. Setup WSL2 & Windows Terminal for Web Development | Oh-My-Zsh, zsh, nvm, nodejs, pnpm, yarn
8. Link, Navigation, Header Design, Footer Design, Container | NextJS App Router Crash Course
มุมมอง 1.5Kปีที่แล้ว
8. Link, Navigation, Header Design, Footer Design, Container | NextJS App Router Crash Course
1. Setup Windows for Web Development | VSCode, NodeJS, Git
มุมมอง 263ปีที่แล้ว
1. Setup Windows for Web Development | VSCode, NodeJS, Git
7 . How Data Flows Work? | NextJS App Router Crash Course
มุมมอง 944ปีที่แล้ว
7 . How Data Flows Work? | NextJS App Router Crash Course
6 . Pages and Layouts | NextJS App Router Crash Course
มุมมอง 1.2Kปีที่แล้ว
6 . Pages and Layouts | NextJS App Router Crash Course
5. Static Routing | NextJS App Router Crash Course Series
มุมมอง 1.1Kปีที่แล้ว
5. Static Routing | NextJS App Router Crash Course Series
4. App Routing Concept | NextJS App Router Crash Course Series
มุมมอง 1.4Kปีที่แล้ว
4. App Routing Concept | NextJS App Router Crash Course Series
3. MockAPI.io + Local DB data | NextJS App Router Crash Course Series
มุมมอง 1.7Kปีที่แล้ว
3. MockAPI.io Local DB data | NextJS App Router Crash Course Series
2. Setup Mock Backend | NextJS App Router Crash Course Series
มุมมอง 1.7Kปีที่แล้ว
2. Setup Mock Backend | NextJS App Router Crash Course Series
1. Installation | NextJS App Router Crash Course Series
มุมมอง 5Kปีที่แล้ว
1. Installation | NextJS App Router Crash Course Series
4 | NextJS 13 App Router - Continues | Learning in Public
มุมมอง 357ปีที่แล้ว
4 | NextJS 13 App Router - Continues | Learning in Public
Why Web Accessibility Matters? Let's talk about Accessibility...
มุมมอง 71ปีที่แล้ว
Why Web Accessibility Matters? Let's talk about Accessibility...
Build a freeCodeCamp Survey Form Clone using HTML5 & CSS3 Flexbox 2023
มุมมอง 13K3 ปีที่แล้ว
Build a freeCodeCamp Survey Form Clone using HTML5 & CSS3 Flexbox 2023

ความคิดเห็น

  • @codedusting
    @codedusting วันที่ผ่านมา

    We talked about AI, Job scenarios, Politics, an accusation on chat about degrading my country when I am talking about civic sense of my country's people and don't want the image to be ruined on the international platform, why you need to expand your horizon beyond what you specialise in. Finally we talked about Helix editor and some examples and what I will be building in Livestream 008 Next Sunday.

  • @SaurabhSrivastava-i1q
    @SaurabhSrivastava-i1q 5 วันที่ผ่านมา

    Thanks. Waiting for another stream...

  • @codedusting
    @codedusting 13 วันที่ผ่านมา

    GitHub: github.com/codedusting/anime-cards-php Part 2 will be coming soon...

  • @muhammadiqbalid83
    @muhammadiqbalid83 14 วันที่ผ่านมา

    Thanks sir

    • @codedusting
      @codedusting 14 วันที่ผ่านมา

      You're welcome. Share it with your friends in another platforms if you think it's helpful

  • @codedusting
    @codedusting 15 วันที่ผ่านมา

    Learn Web A11y: ​​web.dev/learn/accessibility GitHub: github.com/codedusting/next-15-crash-course Live Demo: next15crash.codedusting.in/

  • @skullhunter7342
    @skullhunter7342 17 วันที่ผ่านมา

    Sir your linkedin

    • @codedusting
      @codedusting 17 วันที่ผ่านมา

      You can connect with me on Twitter. LinkedIn is private due to some safety issues for the time being.

  • @skullhunter7342
    @skullhunter7342 17 วันที่ผ่านมา

    Literally amazing 🎉

    • @codedusting
      @codedusting 17 วันที่ผ่านมา

      Thanks 🙏

  • @OnlyJavascript
    @OnlyJavascript 18 วันที่ผ่านมา

    can you please cover RBAC and ABAC concepts?

    • @codedusting
      @codedusting 18 วันที่ผ่านมา

      Yes. I can do it. Thanks for the recommendation. I'll show how to do it from scratch first. Otherwise services like Clerk and others exist.

    • @OnlyJavascript
      @OnlyJavascript 17 วันที่ผ่านมา

      @codedusting do it from scratch please. No third party packages. Thank you in advance ☺️

    • @prashlovessamosa
      @prashlovessamosa 17 วันที่ผ่านมา

      Can you please rbac with better auth Library auth js sucks

    • @codedusting
      @codedusting 17 วันที่ผ่านมา

      @@prashlovessamosa I'll do next video with basic conceptual level RBAC from scratch like other 3 previous videos because I think most people find it confusing and some sort of big thing, when it's not. In later video where we will build todoer app as per production grade, I'll show through library which might be more secure underneath if required.

  • @codedusting
    @codedusting 19 วันที่ผ่านมา

    Learn Web A11y: ​​web.dev/learn/accessibility GitHub: github.com/codedusting/next-15-crash-course Live Demo: next15crash.codedusting.in/

  • @codedusting
    @codedusting 22 วันที่ผ่านมา

    Learn Web A11y: ​​web.dev/learn/accessibility GitHub: github.com/codedusting/next-15-crash-course Live Demo: next15crash.codedusting.in/

  • @codedusting
    @codedusting 23 วันที่ผ่านมา

    GitHub: github.com/codedusting/next-15-crash-course Live Demo: next15crash.codedusting.in/ Regex for password: /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?&])[A-Za-z\d@$!%*?&]{12,}$/

  • @SaurabhSrivastava-i1q
    @SaurabhSrivastava-i1q 25 วันที่ผ่านมา

    Keep it up!

    • @codedusting
      @codedusting 24 วันที่ผ่านมา

      Thanks! 🙏

  • @codedusting
    @codedusting หลายเดือนก่อน

    Internet went off so will continue again once it's back 🎉

  • @codedusting
    @codedusting หลายเดือนก่อน

    Returning back now - Hate editing videos so now it will live streams 3 times a week (as a aim).

  • @lakshmanguntupalli2495
    @lakshmanguntupalli2495 4 หลายเดือนก่อน

    Why do we need to use a hash path for client routing?

    • @codedusting
      @codedusting 4 หลายเดือนก่อน

      We don't have to. In this version of the tutorial, router.asPath doesn't exist and we needed #paths for showing active link so we had to create custom hooks

  • @lakshmanguntupalli2495
    @lakshmanguntupalli2495 4 หลายเดือนก่อน

    Thanks, It's a really nice tutorial. Can you tell me the theme you have used in Visual Studio Code and Terminal?

    • @codedusting
      @codedusting 4 หลายเดือนก่อน

      I don't remember tbh. I no longer use the same theme.

  • @greennmrtnm3342
    @greennmrtnm3342 5 หลายเดือนก่อน

    nice! so great!

  • @UtsargoRoy
    @UtsargoRoy 6 หลายเดือนก่อน

    The not found page was not working. Then I refactor the code like this: `import { notFound } from "next/navigation"; const isEmptyObject = (obj: Object) => { return obj && Object.keys(obj).length === 0 && obj.constructor === Object; }; const Blogs = async () => { try { const response = await fetch(`${process.env.JSON_API_URL}/articles`); if (!response.ok) { console.error(`HTTP error! status: ${response.status}`); return notFound(); } const articles = await response.json(); if (!articles || articles.length === 0 || isEmptyObject(articles)) { return notFound(); } console.log(articles); return ( <div> <h1>Blogs (public)</h1> {/* Render your articles here */} </div> ); } catch (error) { console.error("Error fetching articles:", error); return notFound(); } }; export default Blogs;` Then it worked fine! 😁

    • @codedusting
      @codedusting 6 หลายเดือนก่อน

      Thanks. Pinned your comment.

  • @Rajputana1974
    @Rajputana1974 7 หลายเดือนก่อน

    Can you create a separate video which explains how can I create model and schemas using typescript and zod at production ready

    • @codedusting
      @codedusting 7 หลายเดือนก่อน

      Sure. Give me few days.

  • @codedusting
    @codedusting 7 หลายเดือนก่อน

    Watch at 1.25x or 1.5x speed if required. 3 more videos are also uploaded simultaneously.

    • @akaleshtanwer1690
      @akaleshtanwer1690 6 หลายเดือนก่อน

      I am waiting for the optimization

    • @codedusting
      @codedusting 6 หลายเดือนก่อน

      @@akaleshtanwer1690 I'll edit and upload them by next week during weekends. In the meantime, you can look into the live section of my channel where you'll find the image optimization part.

  • @codedusting
    @codedusting 7 หลายเดือนก่อน

    Watch at 1.25x or 1.5x speed if required. 3 more videos are also uploaded simultaneously.

  • @codedusting
    @codedusting 7 หลายเดือนก่อน

    Watch at 1.25x or 1.5x speed if required. 2 more videos are also uploaded simultaneously.

  • @codedusting
    @codedusting 7 หลายเดือนก่อน

    Watch at 1.25x or 1.5x speed if required. 3 more videos are also uploaded simultaneously.

  • @tomasburian6550
    @tomasburian6550 7 หลายเดือนก่อน

    Thank you for also considering Typescript. We all use it in the pro world, and some tutorials just omit it, which makes things more complicated.

  • @SaurabhSrivastava-i1q
    @SaurabhSrivastava-i1q 9 หลายเดือนก่อน

    It seems the laptop heat messed up the audio in the latter part of your video???

  • @codedusting
    @codedusting 9 หลายเดือนก่อน

    Turso Installation for those who want to do themselves: orm.drizzle.team/learn/tutorials/drizzle-with-turso PS: My health is a major issue right now. I am hoping for it to be fine in 2-3 months. Have finally consulted with the doctor. In the meantime, I will try to keep up with the streaming and completing the editing and uploading the remaining NextJS 13-14 app tutorial.

    • @fosbergaddai4996
      @fosbergaddai4996 9 หลายเดือนก่อน

      You will be well Bro. Thanks for this video

    • @codedusting
      @codedusting 9 หลายเดือนก่อน

      @@fosbergaddai4996 thanks brother

  • @Learning-king210
    @Learning-king210 10 หลายเดือนก่อน

    I'm happy that I found this channel, ❤ do you have any react Js playlist or Js playlist ?

    • @codedusting
      @codedusting 10 หลายเดือนก่อน

      Not yet.

  • @bipolarbear91
    @bipolarbear91 10 หลายเดือนก่อน

    Hi THANK YOU for this amazing video. I just started html/css and couldnt make the survey on my own, it was soo ugly. I didnt even think of putting everything in their own DIV, so that they became block element. Your explanations are the best out of all videos on this topic BY FAR. I guess that is why it is 1 hour long Thanks again!

    • @codedusting
      @codedusting 10 หลายเดือนก่อน

      Glad it helped. All the best on your journey

  • @haikelareff
    @haikelareff 11 หลายเดือนก่อน

    i hope you can showcase more on how to utilise Link component for example how to use link params and change background/theme of category page and also using modal component for dynamic route

    • @codedusting
      @codedusting 11 หลายเดือนก่อน

      The modal component part is going to be covered without CSS. In the projects which I do live, I will use it if required.

  • @AliRaza-nm3eu
    @AliRaza-nm3eu ปีที่แล้ว

    thanks sir i was strggling from a whole day inside app/xyz then inside xyz/pages.tsx but its wil be page.tsx thanks for these mini duration video thanks alot

  • @mohammedhussainali2930
    @mohammedhussainali2930 ปีที่แล้ว

    Good way of teaching by background history and compiling it with current scenarios, good job brother....

  • @Rajesh-rg6fw
    @Rajesh-rg6fw ปีที่แล้ว

    I just completed mern stack. Checked almost all the videos, but didn't foubd a product ready project on mern. Product grade in the sense, clean code, modular approach, seo accessibility, with all the best practices followed in industry standard codebase. 1st let's build some full stack projecs on mern then move to next and typescript.

    • @codedusting
      @codedusting ปีที่แล้ว

      I see. But I don't use the MERN stack tbh. I use NextJS in typescript for most production based projects in 2023-2024. Express is still used by the backend team which we sync with API. Anyways, you can try finding some mern stack projects on TH-cam if you want to learn to create one. Try Hitesh Chaudhary.

    • @Rajesh-rg6fw
      @Rajesh-rg6fw ปีที่แล้ว

      @@codedusting thanks for the response. I will definitely check that.

  • @codedusting
    @codedusting ปีที่แล้ว

    This is a long video which contains optional designing and server actions. Optional designing because the course is not focused on designing and as you'll see in future, we'll not be making a complete blog either. EDIT: Subtitles are up.

  • @sayandutta2038
    @sayandutta2038 ปีที่แล้ว

    Can you also throw some light on how to find off campus jobs, really struggling to find one.

    • @codedusting
      @codedusting ปีที่แล้ว

      Market is quite bad right now. I would advise honing your skills, participating in open source, applying to as many companies as possible through LinkedIn, naukri dot com, peerlist, showcase, wellfound, etc. sites. Also trying freelancing if required from fever and upwork. You can also try uplers where you pass their test and try your luck. And networking in LinkedIn and peerlist might help. Also, advertise your talent on twitter (make a new account which isn't political or religious to be clean), linkedin, peerlist, showcase type of sites. Create full stack projects and put them out and also add them to your upwork and Fiverr profiles to showcase potential clients.

  • @codedusting
    @codedusting ปีที่แล้ว

    This video covers Route Groups and we also remove our client link as we no longer need it. You can keep it if you want. I have scheduled it for tomorrow but will make it public as soon as HD version is processed. Now off to sleep. 1 AM here!

  • @SaurabhSrivastava-i1q
    @SaurabhSrivastava-i1q ปีที่แล้ว

    Thanks

  • @codedusting
    @codedusting ปีที่แล้ว

    It's been long since I uploaded any videos. Due to some family situation (loss of one of the family member in distant family relationship), I wasn't at home. Now the festivals are beginning so I plan to release the whole NextJS 13.5.6-14 tutorial videos daily or one in every 2 days. Hope you all understand!

    • @sayandutta2038
      @sayandutta2038 ปีที่แล้ว

      Sorry for the loss. But I'm glad you're back.

    • @codedusting
      @codedusting ปีที่แล้ว

      @@sayandutta2038 Thanks 🙏

  • @fakeITDevTeam
    @fakeITDevTeam ปีที่แล้ว

    this is what we need. thank you!

  • @becomeveer
    @becomeveer ปีที่แล้ว

    Bro, which tool is this you're using to create a basic structure or layout ?

  • @archend8087
    @archend8087 ปีที่แล้ว

    Thanks!

  • @sashirkl
    @sashirkl ปีที่แล้ว

    I am subscribing just to see some good industry grade project In future

  • @irfansaeedkhan7242
    @irfansaeedkhan7242 ปีที่แล้ว

    waiting for more videos like them, this is great concept to teach in real way showing real problem

  • @ShivamSingh-dg6sv
    @ShivamSingh-dg6sv ปีที่แล้ว

    which vscode font and theme are you using ?

    • @codedusting
      @codedusting ปีที่แล้ว

      GitHub immersive dark. I keep changing tbh.

  • @arupde6320
    @arupde6320 ปีที่แล้ว

    be regular

    • @codedusting
      @codedusting ปีที่แล้ว

      After the 15th will return because of the family member's demise.

  • @LengerDev-fi9gc
    @LengerDev-fi9gc ปีที่แล้ว

    Thanks you very much, it is really helpful. But can you show your setup to your Visual Studio code? I would be appreciate if you can show the full extension that you use.

    • @codedusting
      @codedusting ปีที่แล้ว

      I keep changing it because of my OCD 😅 I'll show it in my next video. Currently busy because of the demise of one of the family members so will continue after 10-15 December. However, it will be different, for sure.

  • @sai7743
    @sai7743 ปีที่แล้ว

    I need protected routes how to use it my backend is not nextjs and only front end is nextjs

    • @codedusting
      @codedusting ปีที่แล้ว

      Can you elaborate more? I didn't get it.

    • @sai7743
      @sai7743 ปีที่แล้ว

      @@codedusting How to protect the routes in nextjs

    • @codedusting
      @codedusting ปีที่แล้ว

      @@sai7743 We will do it in this project series. But you can for now, check protected routes in Nextjs tutorials. Most people use middleware to authenticate if the user is authorised or not.

  • @masar-at
    @masar-at ปีที่แล้ว

    Thank you Very much, this is really helpful, may we know when you will continue this course? Thanks Again.

    • @codedusting
      @codedusting ปีที่แล้ว

      This weekend or as soon as I get the time this week.

    • @masar-at
      @masar-at ปีที่แล้ว

      @@codedusting looking forward to it, all the best

  • @codedusting
    @codedusting ปีที่แล้ว

    LATEST EDIT [April 2nd]: PLANETSCALE HAS STOPPED THE HOBBY PLAN. SO PLEASE DELETE THE PLANETSCALE ACCOUNT IF YOU HAVE CREATED IT DURING THIS VIDEO. I'LL WILL BE CREATING THE PART 2 OF THIS VIDEO TO SHIFT TO NEW DATABASE BEFORE STARTING THE DEVELOPMENT. Thanks for watching. If you liked it, please subscribe and wait for more 🙏 Edit: The key takeaway for beginners here is that no tutorial creator, sir, bhaiya, ma'am, didi, etc. are perfect. It involves a lot of retakes and editing to get that one perfect shot right and then when you stich it all, we create an illusion of a development process where we are perfect developers/engineers. In reality, it's all the same. A lot of bugs, errors, stack-overflow, google, reddit, docs, etc. So, don't be discouraged and good luck!

    • @dipangshu3877
      @dipangshu3877 ปีที่แล้ว

      Thankyou sir for this raw project building sessions. I don't understand why is this channel underrated, I think you should plan some content and market yourself strategically maybe. You are a really cool developer.