13
votes
Returning the last segment of a split string
I'm not entirely enthusiastic about either. The parts[parts.length - 1] using manual index lookup and subtraction may well take a moment to recognize, "Oh, ...
- 8,733
10
votes
Accepted
Generation of a <dl> in React without <div> wrapping elements
as of React 16 version you can use
<React.Fragment>
<dt>Term</dt>
<dd>Definition</dd>
</React.Fragment>
...
- 216
9
votes
Returning the last segment of a split string
tl;dr at the end.
In terms of 'performance', js engines are pretty well optimized. For something like this, performance should not be part of your argument against a given piece of code. In terms of ...
- 413
8
votes
Suppress console output from React in Jest testing output but not in browser output
Hope this helps someone else:
jest --silent
http://facebook.github.io/jest/docs/en/cli.html#silent
- 181
7
votes
Accepted
Country Guessing Game
The screen design looks very nice. It is minimalistic, yet pleasing. It almost perfectly fits on the small screen of my phone (only sometimes, I have to scroll down to see all the answer buttons). The ...
- 21.9k
7
votes
Simple checkboxes with React
I think everything Sam Onela said is great. I'm gonna add a few more things.
Don't modify your state directly
In general, it's considered bad practice to directly modify your state object. According ...
7
votes
Accepted
React hooks update array of object
Mutation You are mutating the existing state when you do
let newArr = [...rowDataTracker];
// ..
newArr[itemIndex]["payload"][columnId] = newValue;
...
- 8,733
7
votes
Accepted
Create an address self-complete bar
A few things you can improve:
Use const instead var
Don't use any as type
Move ...
- 208
6
votes
Accepted
TODO in React w/ Redux
I'm not exactly sure of your environment (I'm going to assume you're using Node), and with this assumption, I want to address a few things starting with specific things, then more general:
Specific
...
- 271
6
votes
Country Guessing Game
Feedback
Nice use of arrow functions, the fetch API (and associated promises), etc. The layout looks nice as well.
Suggestions/Review Points
Options could appear multiple times
The code in ...
- 29.6k
6
votes
Accepted
Is this a good approach for creating pages for multiple content typs with GatsbyJS?
There's definitely a lot of duplicate code in those 2 ifs. I'd extract it into function and pass different things as parameters.
Then code would look let's say:
<...
- 2,728
5
votes
Accepted
React typeahead component
I think there are many things you could improve, I will try to review your code and give some pointers.
Instead of using React.Component, you should directly ...
- 1,574
5
votes
Accepted
Jest / Enzyme test for a React component to calculate average data speed
There are two distinct parts in your test:
Testing the rendering of AvgSpeed component.
Testing the logic of getAverage() and <...
- 2,082
5
votes
Accepted
React - am i overusing props or is it exactly how they are suppoused to be used?
Use Props !
Using props to highly customize your component is good practice, but too many props isn't always good ! You need to ask yourself:
Am I trying to overly handle every situation possible ?
...
- 1,386
5
votes
Accepted
Best way to retrieve music metadata from audio files?
It appears music-metadata is the Node.js/desktop flavor of music-metadata-browser (intended for browsers). The author doesn't explain the differences between the two, but maybe the desktop variant ...
- 4,346
5
votes
Colourful block digits
squareStyle variable should be initialized in constructor instead of render. Reason being, render is called on each state update and so, if your render is called ...
- 483
5
votes
Accepted
batch progress visualization In React.js
The function render() in only supposed to render. It is not supposed to compute some style, set variables, have any logic other than render: (Functions Names Should ...
- 178
5
votes
batch progress visualization In React.js
The answer by Orlyyn explains it well. Just adding to it:
You can probably destructure your variables, this helps with readability and reuse.
Since you are not using the state of the class you can ...
- 51
5
votes
Is this a good approach for creating pages for multiple content typs with GatsbyJS?
I know this is a couple weeks old, and you already have a good solution. I just wanted to point out a method that is a bit more deterministic/declarative.
You are already using multiple instances of ...
5
votes
Returning the last segment of a split string
Well, it depends if the performance is an objective or it isn't. Now, I always would prefer good performance; now respect to the person who said "performance does not matter if you use big ...
- 1,296
5
votes
Accepted
Code to change the size of the fields based on that 2 fields are optional inside a contact form
I think your current code looks pretty reasonable. All the logic you're typing out is required, and it's quite readable as-is. There are a few tweaks you can consider, but there could well be ...
- 8,733
5
votes
Accepted
Tic Tac Toe in React (official tutorial)
First, congratulations on working code.
Recommendations:
Simplify your state
Simplify your controls
Simplify your functions
Your state is overly complex, even with no user interaction it is very ...
- 306
5
votes
Calling functions if certain strings are in an array
The first thing I would extract is the condition:
...
- 314
5
votes
React Dropdown Component
Good job in getting something handcrafted to work; must have been a fun learning experience!
With a production / longer term view on things, here's my review on what you've done:
The "click ...
- 286
4
votes
Accepted
Suppress console output from React in Jest testing output but not in browser output
Use a way of checking for the jest global that won't throw an error:
...
- 326
4
votes
onChange vs onKeyPress for input in React
Don't complicate your code; the first solution is just fine but needs some tweaking:
...
- 41
4
votes
Accepted
Factory method done on ReactJS component
When I feel a design is overcomplicated (read: "big objects/functions"), I take a step back and think about the concerns. You have multiple objects and files, so which one should you start with? I ...
- 1,110
4
votes
Accepted
Validating Array before rendering
typeof activeEvents === 'object' && activeEvents !== null can be true for both Array ...
- 618
4
votes
React For loop component
This approach is not bad but I'd highlight a few issues:
You wrap each element with a <div>, it's unnecessary and for a very long list you create many useless ...
- 10.6k
4
votes
Best way to retrieve music metadata from audio files?
Caching and Streaming.
Cache data
I can not work out if you are doing this each time your app loads. If you are and it is a slow point you should consider storing the processed data in a file or ...
- 22.9k
Only top scored, non community-wiki answers of a minimum length are eligible