Clean Up React Code with useReducer | Code Renovation

Поділитися
Вставка
  • Опубліковано 24 лис 2024

КОМЕНТАРІ • 18

  • @Stoney_Eagle
    @Stoney_Eagle 3 дні тому +3

    Sometimes extra boilerplate code "reduces" complexity and makes things more managible.
    Man these CJ videos are a freaking goldmine for new developers, I wish I had these when I started!
    (I do miss your shenanigan live streams CJ) 😊

  • @madmaxdev
    @madmaxdev 3 дні тому +6

    Sometimes, I find it challenging to work with TypeScript, particularly when it comes to defining and integrating types in a way that flows seamlessly within the code. I watched your Hono Starter API video, where you wrote TypeScript effortlessly and seamlessly. Could you please create a video explaining how to work with TypeScript effectively, focusing on proper practices for defining and integrating types?

    • @StingSting844
      @StingSting844 2 дні тому

      Yeah I need this too. But I'm afraid we'll get the knowledge only by building lots of small things and gaining through pain. Every OSS project starts with rudimentary types and then someone comes along and makes it super well typed!

  • @thedelanyo
    @thedelanyo 3 дні тому +1

    I'm primarily a Svelte developer but I'm learning a good stuffs watching you write ReactJs 😅😅😅

  • @daveisdead
    @daveisdead 3 дні тому +2

    CJ always comes in with the bangers

  • @St0rMsk
    @St0rMsk День тому +1

    Someone call 🚒 CJ is on 🔥

  • @marwen_dev
    @marwen_dev 3 дні тому

    Thanks CJ, great insights 🎉! Waiting for your take on tanstack start.

  • @AlbertoVasquez1
    @AlbertoVasquez1 3 дні тому

    Thank you very much for the amazing example!

  • @MrCloudTel
    @MrCloudTel 3 дні тому +1

    This is awesome

  • @DarrylHebbes
    @DarrylHebbes 19 годин тому

    This is more about types and less about reducers and why they differ from regular state

  • @DontFollowZim
    @DontFollowZim 3 дні тому +1

    Yup, still hate this pattern. Why would we prefer to put all these actions into a single function and call them using a string name rather than creating a function for each action so we don't rely on magic strings and switch statements?
    I also hate the { ...state, ...payload} pattern that functional programming and immutability force on you. I'm so much happier with Vue's reactive state.

    • @syntaxfm
      @syntaxfm  2 дні тому +1

      This pattern is definitely not for everyone. One of the main benefits is consolidation / colocation of logic.
      The action types as plain strings only makes the most sense when working with TypeScript. The custom action types I created enforce the combination of a type and payload (you cannot mix and match or you will get a type error).

    • @BekhzodIsmoiliy
      @BekhzodIsmoiliy 2 дні тому +1

      @@syntaxfmbut you can use the same type protection for your function params using “pick” utility type. So I either cannot understand the benefit of using additional string property. Why use so many extra code with types string properties switch cases extra if statements, when you can recreate it using functions for each of your actions. And you can still manage to have pure functions if you wish

  • @ayatullah8748
    @ayatullah8748 3 дні тому +1

    I recently reduced 5-6 useState with a single reducer. just props drilling the state and dispatch. Without props drilling what else i can use any suggestions??

    • @syntaxfm
      @syntaxfm  3 дні тому +2

      The Context API would allow you to put the reducer state / dispatch into context, and then bring it into any component with useContext and no prop drilling.

  • @lnard0
    @lnard0 3 дні тому

    code for the finished reducer pls

  • @oWeRQ666
    @oWeRQ666 2 дні тому

    I don't understand, why not just use one state, and instead of action creator make functions that accept and return a state, compatible with setState.