Codeek
Codeek
  • 39
  • 18 263
JSON vs Plain Objects: Why JSON Strings Are Essential for Data Fetching
Are you confused about the difference between JSON and plain objects in JavaScript? In this video, we’ll dive into what sets JSON apart from plain objects, and why JSON strings are the go-to choice for data handling in web development. Whether you're dealing with APIs, local storage, or data interchange, understanding these differences can boost your coding skills and improve your applications. Watch till the end to learn practical examples and best practices for using JSON effectively
Stack overflow's answer:
stackoverflow.com/questions/54122999/is-json-a-string/69490422#69490422
มุมมอง: 76

วีดีโอ

How to Maintain Aspect Ratio with Fixed Width and Auto Height in Next.js Image Component | Tips
มุมมอง 2142 หลายเดือนก่อน
In this video, you will learn how to use the Next.js Image component with a fixed width and an auto-adjusted height while maintaining the aspect ratio of your images as a part of nextjs tips and tricks. This is a common problem that many developers face, especially when trying to make their images responsive. I'll walk you through step-by-step solutions, including code examples and best practic...
Scroll Restoration in React: Smooth User Experience Tips & tricks
มุมมอง 4802 หลายเดือนก่อน
Want to enhance your React app's user experience? Learn all about scroll restoration in React! In this video, we'll dive into the best practices for preserving scroll positions, making your web apps feel more intuitive and user-friendly. We'll cover: Basics of scroll restoration in React Using useEffect for scroll management Implementing react-router for seamless navigation Advanced tips for ma...
useMemo vs useCallback in React: Optimize Your App's Performance Like a Pro! React tips and tricks
มุมมอง 2163 หลายเดือนก่อน
Discover the secrets to boosting your React application's performance by understanding the differences between useMemo and useCallback. In this video, we dive deep into how and when to use these powerful hooks, with practical examples and performance tips. Whether you're a beginner or an experienced developer, this guide will help you write more efficient and maintainable React code. 🔗 Resource...
Fixing Spinners or Animations Not Working: A Quick Fix
มุมมอง 693 หลายเดือนก่อน
Are your loading spinners stuck and not spinning in your web applications? In this video, we dive into the common issues that cause spinners to stop working and provide step-by-step solutions to get them spinning smoothly again. From CSS to JavaScript fixes, we've got you covered. Whether you're using React, Vue, or vanilla JavaScript, this tutorial will help you troubleshoot and fix your spinn...
Boost Your React App Performance with Lazy Importing | React optimization tips and tricks
มุมมอง 1343 หลายเดือนก่อน
Welcome to our latest React tutorial! 📚 In this video, we dive into one of the important tips and tricks of react optimization, concept of lazy importing and lazy loading in React to supercharge your app's performance! 🚀 What You'll Learn: 🌟 How to implement lazy importing in React ⚡ Boosting React app performance with code splitting 🛠️ Step-by-step guide on using React.lazy and Suspense 📉 Redu...
Visual Studio VS code shortcuts to increase your productivity | VS code tips and tricks
มุมมอง 364 หลายเดือนก่อน
This video tutorial explains some of the useful visual studio VS code shortcuts to increase productivity of developers while coding or programming #coding #programming #webdevelopment #reactjs #nextjs
Why does modern Javascript use e.preventDefault-Essential Javascript tip
มุมมอง 535 หลายเดือนก่อน
Welcome to our comprehensive guide on e.preventDefault() in JavaScript! In this video, we'll dive deep into one of the most essential methods in web development that helps you control the behavior of events. e.preventDefault() is a method in JavaScript that prevents the default action that belongs to the event. For example, if you use it in a form submission event, it prevents the browser from ...
Why Nullish Coalescing operator is used in modern Javascript than OR operator | Nullish vs OR
มุมมอง 805 หลายเดือนก่อน
This video is all about Nullish coalescence or nullish coalescing operator vs or operator in javascript Dive into the world of JavaScript operators with this comprehensive guide! In this video, we'll explore the nuances between the Nullish Coalescing Operator (??), also called as nullish coalescence and the OR Operator (||) in the context of JavaScript, React, and Next.js. Whether you're a begi...
Master the Optional Chaining Operator in JavaScript|React|Nextjs - Essential Coding Techniques 2024
มุมมอง 866 หลายเดือนก่อน
Unlock the full potential of JavaScript with our comprehensive guide to the optional chaining operator (?.). This powerful feature simplifies how you access properties and methods in complex objects, ensuring your code is more readable and robust against null or undefined errors. 🔍 What You'll Learn: Understand what the optional chaining operator is and why you need it. Step-by-step examples to...
Solve build error in Nextjs | part 2 | Nextjs tutorial
มุมมอง 5206 หลายเดือนก่อน
Solve build error in Nextjs | part 2 | Nextjs tutorial
Function type vs Return type in typescript | Typescript tutorial
มุมมอง 697 หลายเดือนก่อน
Function type vs Return type in typescript | Typescript tutorial
Non Null Assertion operator| Exclamation mark in typescript expression explained| Typescript
มุมมอง 1867 หลายเดือนก่อน
Non Null Assertion operator| Exclamation mark in typescript expression explained| Typescript
How to add a loader or loading screen | loading UI in nextjs
มุมมอง 2.2K8 หลายเดือนก่อน
How to add a loader or loading screen | loading UI in nextjs
Installing latest nextjs project in 30 seconds | nextjs tutorial
มุมมอง 1279 หลายเดือนก่อน
Installing latest nextjs project in 30 seconds | nextjs tutorial
Login logout | Signin Signout in react and nextjs | Token based authentication
มุมมอง 7089 หลายเดือนก่อน
Login logout | Signin Signout in react and nextjs | Token based authentication
Hostname vs Domain, origin, path, searchparams in URL explained | Mastering the URL core concepts
มุมมอง 809 หลายเดือนก่อน
Hostname vs Domain, origin, path, searchparams in URL explained | Mastering the URL core concepts
Solving Export Encountered error | Build Error in Nextjs | Nextjs tutorial
มุมมอง 3.6K9 หลายเดือนก่อน
Solving Export Encountered error | Build Error in Nextjs | Nextjs tutorial
how to make a not found page or 404 page in nextjs
มุมมอง 16810 หลายเดือนก่อน
how to make a not found page or 404 page in nextjs
Getting pathname and navigating between routes in Nextjs
มุมมอง 85510 หลายเดือนก่อน
Getting pathname and navigating between routes in Nextjs
Detect device type in react and nextjs | Mobile & Desktop screen for responsive website
มุมมอง 2K10 หลายเดือนก่อน
Detect device type in react and nextjs | Mobile & Desktop screen for responsive website
Fetch and Error handling for data fetching in javascript
มุมมอง 6111 หลายเดือนก่อน
Fetch and Error handling for data fetching in javascript
How to apply multiple transform in css | HTML/CSS
มุมมอง 106ปีที่แล้ว
How to apply multiple transform in css | HTML/CSS
Reusability | Best practices in Frontend development | Software Engineering
มุมมอง 35ปีที่แล้ว
Reusability | Best practices in Frontend development | Software Engineering
Naming convention in HTML and CSS | Best practices in Front end development
มุมมอง 515ปีที่แล้ว
Naming convention in HTML and CSS | Best practices in Front end development
Aspect ratio of img | Width and height in img tag | Css best practices
มุมมอง 56ปีที่แล้ว
Aspect ratio of img | Width and height in img tag | Css best practices
Defer explained more practically with code | HTML|Javascript
มุมมอง 63ปีที่แล้ว
Defer explained more practically with code | HTML|Javascript
event bubbling and e.stopPropagation explained
มุมมอง 24ปีที่แล้ว
event bubbling and e.stopPropagation explained
how to add svg in background as URL in HTML/CSS
มุมมอง 3.1Kปีที่แล้ว
how to add svg in background as URL in HTML/CSS
how to find or change Xampp Mysql username and password
มุมมอง 318ปีที่แล้ว
how to find or change Xampp Mysql username and password

ความคิดเห็น

  • @md.joynalabedin2696
    @md.joynalabedin2696 หลายเดือนก่อน

    Thank you.

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

    Best explanation

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

    Thank you so much for the video, just 53 seconds into the video I got my build error solved. The error that I have been battling with for hours.

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

      glad to hear your problem got solved!

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

    Great!

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

      Glad to hear your appreciation! 😀

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

    Full video in just 1:20 minute: th-cam.com/video/lIVngCxky38/w-d-xo.html

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

    I have been using just useState and useEffect my whole life! How many fucking hooks are there? Fuuuuuuuuuuuuuck!

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

    Nullish coalescing is more specific than or. Isnt it?

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

      Yes exactly!

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

    Great great job but i wonder why do these libraries dont do these kind of optimizations by default?

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

      space for optimizations maybe😀

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

    Your like and subscription help the channel make more videos you need

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

    Your like and subscription help the channel make more videos you need

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

    Your like and subscription help the channel make more videos you need

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

    Your like and subscription help the channel make more videos you need

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

    Dai Maile khi bujena 😅😅

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

    you explained it in the easiest way possible i hope you get more subscribers (i did) and if possible can you give me some tips on how to be a better front end developer

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

      Thankyou for your kind compliments! I think keeping yourself up to date by following blogs and tutorials and regular learning will help you create a strong foundation to be a better frontend developer.

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

    Adding: "engines": { "node": "20.x" } in package.json solve the problem in my case.

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

      Thankyou for your contribution! I hope this method would help lot of developers

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

    thanks, this partially solves the problem. but perhaps someone had a similar problem with the fact that locally on Windows build builds fine, but on vps ubuntu this error occurs?

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

      Did you try methods in this other video? th-cam.com/video/PHlqVjuT1No/w-d-xo.htmlsi=MQX_DG7xvkfGlphg

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

      the problem was that in nextjs 13, ui components were stored in the pages layer and these components were exported by default (export default TaskBtn etc...) and inside similar ui components, new ui architectures were exported by export const Btn (import {Btn} due what was the problem. Thanks to the idiot who wrote the code before me, now on our project every fucking button and ui component is a bitch page, which is why the build takes longer, etc. WARNING don't be like this idiot, don't write UI components in the pages layer

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

      ​@@codeek0 no, unfortunately it didn't work. thanks for the answer. i tell about problem in other comment

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

    hey thanks so much, i was struggling with this for a long time, and your solution fixed it! subscribed

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

      Glad to hear it! Thankyou😃

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

    Thank you

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

      glad to know the video helped you! Thankyou for the motivation

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

    Full video link: th-cam.com/video/ANUbrMYZXCs/w-d-xo.html

  • @UsmanTariq-xy5jd
    @UsmanTariq-xy5jd 6 หลายเดือนก่อน

    thanks buddy, i was getting diff kind of errors while making build in nextjs 14. doing the dynamic import in one of my component in which i was using a third party map solved the problem.

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

      Glad to hear it helped you😀!

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

    🔥Full video link: th-cam.com/video/qYF9L5x2Bz0/w-d-xo.htmlsi=cXtff4Xe7zmzgK8y

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

    For full video: th-cam.com/video/PHlqVjuT1No/w-d-xo.html

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

    If this wont solve, you may try this one: th-cam.com/video/5UsIO-feZBY/w-d-xo.html

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

    If this approach didnt solve the issue, this another video may help you: th-cam.com/video/PHlqVjuT1No/w-d-xo.html

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

    Full video(2 min): th-cam.com/video/39w59QGqRMo/w-d-xo.htmlsi=7qCTDDlSUotps4hL

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

    Very helpful. Thanks for the video.

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

      i am glad to know it helped!

  • @SattwikSahu-f3s
    @SattwikSahu-f3s 7 หลายเดือนก่อน

    No need to fake the accent man

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

      No, i am just trying to excel my fluency and pronunciation. Thanks for your warm comment though

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

    Learn more about data url: developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/Data_URLs

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

    Full video: th-cam.com/video/jHUg0saEurI/w-d-xo.html

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

    Bro can please solve this error: error occurred prerendering "/", "/about" etc please...😢😢

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

      go to the main page i.e / and about page and check the terminal in server side and there you will find the error!

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

      @@codeek0 how to check in server side terminal please help me im a beginner...🥺

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

      the terminal is where you have typed the command npm run dev to start the development server! There you can check the error after your page has been loaded! @@SanjayNG125

  • @tiavina-mika
    @tiavina-mika 7 หลายเดือนก่อน

    how to detect it server side with nextjs 14?

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

    what if window is undefined?

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

      That mean the page is getting rendered in the server side. Nextjs prerenders every components in server side first and then in client side. Since window is only accessible in client side, we make a condition to check if typeof window is not undefined, which indicated that the page is getting rendered in the client side.

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

      @@codeek0 this is obvious. But what if its ssr component and window isundefined?

    • @WilliamPorto-ux1lc
      @WilliamPorto-ux1lc 7 หลายเดือนก่อน

      ​@@lenyacher8344 for Server Side Rendering, you should use the "headers" library from NextJs. It checks the header of the request from the user and then knows if the user is coming from a mobile or not. But then, if your component uses state or anything like it, you'd have to refactor to create two components: the server-side one, which uses the header's function, and the client-side one, which uses the states, and call the client-side from within the server component pass down a prop telling which kind of screen will be rendered. The problem: THIS ONLY WORKS WHEN YOU REQUEST THE PAGE TO THE SERVER. If you need your component to know the resize happened in real-time, you cannot run from the Javascript event listener and use the windows, as far as I know. OBS: I was going to do something like this, but decided to go the other way. All the knowledge is from reading the docs and trying to figure Nextjs out. If I'm wrong for any reason, please let me know.

    • @wtf-is-this-974
      @wtf-is-this-974 4 หลายเดือนก่อน

      @@codeek0any code run in useeffect will only get executed in the client so there is no need to check if the window exists because it always will

  • @Sandeep.off.30
    @Sandeep.off.30 8 หลายเดือนก่อน

    New here 😀

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

      you are most welcome!

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

    thanks a lot dear

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

      Glad to know it helped you! Your positive feedbacks are actually a motivation for me!

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

    Kada daju👍

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

      Thankyou daju!

  • @LokeshSai-iv8sk
    @LokeshSai-iv8sk 8 หลายเดือนก่อน

    bro if you want a teach as these things please make sure that you have a proper set up and be prepared before only so that it will be great

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

      Sure brother! I will care about it! Please suggest me where i could make things improved.

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

    POV: Install latest nextjs project really fast

  • @md.zobayerhossain3862
    @md.zobayerhossain3862 9 หลายเดือนก่อน

    bro i am facing this problem "Export encountered errors on following paths: /(dashboard)/deliver-order/page: /deliver-order"

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

      You can see what is causing the error in terminal in server side!

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

    So, how can I ensure that layout elements like header and footer are not rendered during error?

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

      For that you can make an organizational route and then create a layout inside this route and add not-found.js! For more you can follow this link: nextjs.org/docs/app/building-your-application/routing/route-groups

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

    Good job bro keep it up ❤❤

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

      Thankyour brother!

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

    Great. keep going with these useful tutorials.

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

    best tutorial on fetch. thank you for the video

  • @mr.biibek
    @mr.biibek ปีที่แล้ว

    ROCKS

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

    bhai rocks

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

    daju rocks ..