Reactjs Clock problems

The tests are having trouble saying “Timer has not reached 00:00” on all the failed ones. I don’t know what this means.
I pasted the link, but let me know if you need me to paste the code here.

One thing that I notice is that if I start the clock and then stop it, I can’t restart it.

Also, your app is going to be difficult to debug. Part of what makes React great is the ability to break things into pieces. But you’ve created one big “god” component that houses everything. That is missing part of the value of React and making it more difficult to understand your code.

Was I not supposed to create a single return component? I thought one of the tests was if there was an element that contained all others.

The test only checks the HTML and the values. It doesn’t care how you structure the code as long as the final output is within the requirements.

Yeah, you can make it pass the tests that way. Heck, you don’t even have to use React. My point was that that is bad React practice. I know it is a small app so you can kind of get away with it, but it is a very bad habit. And you can make your code more logical and easier to debug by breaking it up.

Was I not supposed to create a single return component?

I mean, I’m not sure what that means. “single return component” Any JSX hierarchy (that you return) needs to have at it’s root a single component. And (consequently) your app must eventually tree down to a single JSX element. It must have a single entry point, often a component called App.

But you can definitely have different components - it’s even recommended. Strongly. Very strongly. It’s a little weird in codepen because you end up with them all in the same file. You could do that in “real world” programming, but with a bundler, usually you end up breaking them up so each component is in its own file, or even in its own folder.

It does tend to happen when people use Codepen for React. Not that you can’t create separate components inside a single file.

Having an environment like Stackblitz or CodeSandbox lends itself better to creating components when you have access to files and folders.

Yeah, that’s what I meant. I thought you were supposed to do it with only one component…

No, that applies for everywhere you have JSX. But it is relative to each component. You could also have helper functions return JSX (like the callback in a map function) or store it in variable. But you should have multiple components.

Okay, thanks for explaining. That could have made the task so much easier.

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.