Question regarding React Todo Tutorial

The “tasks” variable is defined in Index.js by setting it equal to the “DATA” object constant.

In App.js, we reference “tasks” when we create the “taskList” constant. So how do we access to the the “tasks” variable when it is defined in Index.js?


Hi @johnson.elugbadebo and welcome to the community :wave:

I’m not a React developer, but I think I get it:
With <App tasks={DATA} /> in index.js we create a property for the “App” component called “tasks” which contains the required information. Properties are an interface between a component and its parent code. They are comparable with function arguments. Such a property can then be used inside this component.
When we now look at “App.js” the main function starts with

function App(props) {
  const [tasks, setTasks] = useState(props.tasks);

That’s the moment we assign the property “tasks” to a variable (with the same name) inside the “App” component. After this line we can now use the tasks variable.

By the way, I’m sorry you never got an answer to your Electron question. It seems no one here has any experience with it (me included). :slightly_frowning_face:

Have a nice weekend,

Hi Michael,

I now get it, thanks for the explanation.

By the way, I went to the React docs page and read the tutorial “Thinking in React” at, and that example crystalized for me what React is all about.

Thanks! And no worries about Electron. My main question was about setting up a web application – along with a desktop app interface so my users don’t have to open a browser and navigate to the page to login. But I don’t think there are major issues with maintaining both the web and desktop app if they are “plugged” into the same back-end.

1 Like

I’m glad it was helpful.
Thanks for the link. Since I’m currently coding with “Vue” I see a lot of conceptual similarities between those two. :slightly_smiling_face: That was an interesting read.

Good luck on your developer journey.

PS: Your email address is visible in your post. It ended up in the optional “name” field of your profile. I recommend removing it.