"Using Redux with React" question in Chapter 20?

programming web dev
1

Hi,

There is a point I don’t understand. On page 260, it has the following code in the index.js.

import App from “./App”;

But there is no “App” component being defined in the App.js (on page 263).
The end example is working fine, but I am curious is there a typo or something? Why is the example still working even if we import something (“App” component) that doesn’t exist?

Thank you :slight_smile:

2

It is strange, but here is what is happening. The import is just for the JS file. Anything can be in the JS file you are importing. The part where the compiler is more strict is with the render function, which does expect a component called App. How do we explain that strangeness?

Inside App.js, what we are exporting is a component via connectedComponent. More specifically, what gets returned is a new component that maps to App. That is why the compiler doesn’t complain when you build the app, for the App component does get created in a roundabout way!

3

Hi Kirupa,
I think I sort of get it.
Thank you very much for your help. :grinning:

4

Another thing that may help. If you bring up the React Dev Tools (as part of the Chrome Dev Tools), you can see the App component being returned by connectedComponent when you inspect the React-ified DOM tree.