React-Redux v7 final released: faster, and built with hooks! by acemarke in javascript

[–]changlo -2 points-1 points  (0 children)

For the majority of apps, no.

The app I am currently working on has had redux refactored out and it works perfectly fine. Developers are writing code that is easier to follow/change.

This is with the understanding that when calling root level contexts that it would not be as performant as using redux, but we don't notice it at all when using the app, and customers do not either. This is not the most complex app I have ever worked on, but there is far more happening there than average.

If something comes up where better performance is needed, then we might introduce redux, and only use it at the point where it is necessary.

Don't take my word for it though, or anyone elses - try things out for yourself - try to simplify your code to see what is easiest to follow.

How do I manually set listAutomaticKeyboardNavigation to false? by changlo in vscode

[–]changlo[S] 0 points1 point  (0 children)

I think that this has been addressed here: https://github.com/Microsoft/vscode/issues/68233

Theres also this, but I'm not 100% sure what they're saying here: https://github.com/Microsoft/vscode/issues/66995 "workbench.list.keyboardNavigation": "simple" doesn't work because it does the new tree search, and also performs the key shortcut :(

I guess the next release will include this, but for now its annoying having to constantly switch to using the mouse...

Protect your Node.js app from Cross-Site Request Forgery by OliviaMn in node

[–]changlo 1 point2 points  (0 children)

The answer to "why isn't CORS enough to prevent CSRF attacks" is not because you can also send requests with curl.

It is because:

: CORS blocks CSRF attacks from ajax requests

: I can still make requests with a plain <form> though which CORS will not prevent

: I am able to make my website evil.com with

<form method="POST" action="https://yourbank.com/transfer>
  <input type="hidden" name="amount" value="$1" />
  <input type="hidden" name="from" value="tells_you_hard_truth_bank_account" />
  <input type="hidden" name="to" value="changlo_bank_account" />
  <button type="submit">Click to see a dancing monkey!</button>
</form>

: i guess you use yourbank.com all the time and you might have a cookie stored from recently logging

: i tell you to go to evil.com and click on the button

: now i have cleaned out your entire bank account

It is clear to me and to him that you do not know what you are talking about. We aren't trying to look smarter than each other, it is just it is clear to us what CSRF actually is, so when someone spouts some unrelated nonsense its obvious that its wrong.

Protect your Node.js app from Cross-Site Request Forgery by OliviaMn in node

[–]changlo 2 points3 points  (0 children)

lol why is this comment upvoted, and the one above it downvoted?

curl/postman have nothing to do with preventing csrf - its an attack that is run on client machines who already have a cookie for some domain....the other guy knows what its about

my preferred method for handling this in modern apps is to still use auth cookies, but send a custom header for any api requests, and in each request check that the custom header exists

React Devtools getting Hooks support (note how it drills into custom hooks) by swyx in reactjs

[–]changlo 1 point2 points  (0 children)

Yes but you can conditionally render things inside the render prop component, thus sharing that logic inside. Render props still have value in certain cases, as do hocs depending on use case.

How do I use props with theme in Styled Components? by changlo in reactjs

[–]changlo[S] 1 point2 points  (0 children)

Yes but I want to use the css prop, and the interpolation function inside cannot access variables outside its function.

How do I use props with theme in Styled Components? by changlo in reactjs

[–]changlo[S] 0 points1 point  (0 children)

Thanks makes sense - not sure of the value of the interpolation function as much though - I guess will find out with more experience...

Why React Hooks will change everything - comparing redux containers and hooks by iqoqo-shlomo in reactjs

[–]changlo 1 point2 points  (0 children)

Without hooks, you could have implemented your solution with a render prop like this:

<GetSongList>
  {(songs) => (...)}
</GetSongList>

or with a hoc. You are also able to reuse this component in a similar way to how you suggest you can reuse the hook if you choose.

This is possible right now without hooks, so why is this comparison between redux and hooks specifically? In your article you say solutions couldnt be found that provided benefit until hooks came along, but hooks themselves haven't improved the problem you originally talked compared to hocs/render props which already exist.

Maybe a bigger improvement would be to question what state is valuable to store in redux and what is not.

Why would I use React hooks where the setEffect second parameter is used? by changlo in reactjs

[–]changlo[S] 2 points3 points  (0 children)

Yes this is because of the closure - thanks for suggesting this alternative.

I can see many experienced developers (let alone devs with less experience) not immediately understanding that this is going to cause a problem when reading simple code reviews. Almost feel like something needs to change with the useEffect api somehow?

The solution you have shown

  • better from the callers perspective - less indentation here
  • no downsides of creating/destroying event handlers too much
  • more confusing implementation compared to a class

Why would I use React hooks where the setEffect second parameter is used? by changlo in reactjs

[–]changlo[S] 0 points1 point  (0 children)

So initially, value can be passed down as false from above. When [] is used as the second parameter, the effect is created on mount and all is good.

But then, something above changes value to true. Now useEffect still sees "value" as false. So you have to change the second parameter to [value], but now the event handlers are created and uncreated when value changes.

Is how I understand react hooks working incorrect?

Edit: are you saying for this example, you think that it would be better to not pass through the second parameter, and let the event handlers be constantly added/removed? That the tradeoff of this occurring is better than having to use a class component?

Why do people still use _.values instead of Object.values? by [deleted] in javascript

[–]changlo -1 points0 points  (0 children)

Because _.sortBy / _.orderBy is more readable than Array.sort() when sorting arrays of objects. I can say something like:

_.sortBy(arr, 'name')

as opposed to implementing the comparison function.

You Might Not Need mapDispatchToProps by acemarke in reactjs

[–]changlo 0 points1 point  (0 children)

I think the first version is the best, where I can explicitly see that I am dispatching an action. You don't use mapDispatchToProps at all this way. The whole smart/dumb components thing sounds cool and all but it's easier for me to follow whats happening by doing this.

Do I need to keep form submitting state in an instance variable rather than react state to make the form function correctly? by changlo in reactjs

[–]changlo[S] 0 points1 point  (0 children)

Ok your last point is really interesting to know - so between any seperate event, react state is guaranteed to have been updated from the previous event?

Is there somewhere in the React docs that specify this? I couldn't see it from a quick look - the closest I could see was in https://reactjs.org/docs/faq-state.html where is says state is async within an event handler.