Assemble the Word Counter
While the other components map to a single user interface element, the WordCounter assembles the other components and computes their props. Since we can determine the word count and progress from the text and the target word count, it will take just two props: a text and a target word count. It will calculate the word count and progress and pass these values as props to Counter and ProgressBar.
We need to write some code to count the words in a string. When you’ve got code that has nothing to do with rendering a user interface, store it in a separate function. That way, you don’t need to recreate the whole React element just to test the output of the function, and you can rearrange your components more easily as the ...
Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
and much more.
Read now
Unlock full access