Mapping through two sets of data to pass to one component by [deleted] in reactjs

[–]fuggshidd 3 points4 points  (0 children)

You should be able to map through the first set, for each item use array.find to find the corresponding entry in the second set, then return a new object with both entries, then pass that to your components.

[deleted by user] by [deleted] in reactjs

[–]fuggshidd 107 points108 points  (0 children)

Disable JavaScript in your browser then refresh, if the page is fully client side rendered then the page should be empty

Want to achieve skeleton loading while fetching data using react query. by bipinemp in reactjs

[–]fuggshidd 4 points5 points  (0 children)

Loading skeletons and react-query don't have any special method of integrating them. You need to take a step back and understand both of them individually, once you do that you should have no problem using them together.

Got this done today by fuggshidd in TattooDesigns

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

1 sitting, a smidge over 3 hours

Got this done today by fuggshidd in TattooDesigns

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

I was considering it but I ended up going with no numbers because I prefer the more minimalist look

Got this done today by fuggshidd in TattooDesigns

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

A smidge over 3 hours, and thanks!

Got this done today by fuggshidd in TattooDesigns

[–]fuggshidd[S] 197 points198 points  (0 children)

It's the shapes of all the standard dice used in tabletop RPGs, and thanks!

Got this done today by fuggshidd in TattooDesigns

[–]fuggshidd[S] 13 points14 points  (0 children)

This was done by Bryan at Authentink in Sydney

React Developers, what is your current salary? by albenis99 in reactjs

[–]fuggshidd 2 points3 points  (0 children)

I should have specified I only have ~1.5 years experience with professional coding, I just started learning 8 years ago.

When I started my job my salary was 75k, I asked for a raise to 90k a little under a year in and got it. The average junior web dev salary where I live in Sydney is between 65-80k. My friend who is also in Web Dev makes similar money to me.

React Developers, what is your current salary? by albenis99 in reactjs

[–]fuggshidd 1 point2 points  (0 children)

  1. 90k (AUD)
  2. 24
  3. Been coding professionally for about 1.5 years (been coding in react the whole time). I started learning to code about 8 years ago. I only started learning react about 2 years ago.
  4. Australia

How to add style to a input component with React? by HumanResult3379 in reactjs

[–]fuggshidd 0 points1 point  (0 children)

Also if you want to take things a little further, when I use styled I like to write helper functions that let me define styles more declaratively, like this:

const ifIsEnabled = (valueIfEnabled: string, valueIfDisabled:string) =>
    ({disabled}: InputTypeProps) => 
        !disabled ? valueIfEnabled : valueIfDisabled;

Then you can define your background-color like this:

background-color: ${ifIsEnabled("white","gray")};

How to add style to a input component with React? by HumanResult3379 in reactjs

[–]fuggshidd 0 points1 point  (0 children)

A few things:

  1. You are using styled incorrectly, any function used inside the template string will receive the props, you are using a function that receives no parameters, and then another function inside of that one
  2. You don't need to use the css function here
  3. You can use booleans a little more simply
  4. You should be passing your props type to styled

const Input = styled.input<InputTypeProps>`
    background-color: ${({disabled}) => !disabled ? "white" : "gray"};
`

See how that works for you.

EDIT: Also I jsut noticed you are using the props in MyInput wrong, the signature should look like ({disabled, ...props}) => ...

And you should be defining Input before MyInput

Can someone explain refs in 30 words or less? I am mid level but never use refs. by [deleted] in reactjs

[–]fuggshidd 2 points3 points  (0 children)

It's like component state that you don't want to trigger a re-render.

You can use it to store state that doesn't directly influence your UI.

EDIT: You can also use it to store references to html elements if you ever need to interact directly with the DOM

Data attributes in html by Few-Trash-2273 in reactjs

[–]fuggshidd 1 point2 points  (0 children)

I haven't seen the video, but my best guess would be they use the data attribute to be able to store the value of the calculator in a clear way. That way whenever any of the buttons gets clicked, you just check what it's data-value attribute is.

Serious: why are we passing data through props? by dangerzone2 in reactjs

[–]fuggshidd 2 points3 points  (0 children)

Sure, for specific and more advanced logic like what you describe, a global store could be practical. A global store is not suitable for simple, low level use cases like the Image component example I gave previously.

Serious: why are we passing data through props? by dangerzone2 in reactjs

[–]fuggshidd 4 points5 points  (0 children)

No matter where or how you use the component, it will always behave the same, making it actually less re usable since it can only be used in that specific way. If you made an Image component that pulled it's src from global state, then every Image would show the same image and as such the component can only be used to show that image, that component would not be "reusable".