In previous post on this topic, we started with the basics of React.js .
Each component has a name and three distinct characteristics:
- Props: Component can accept input from other components by using props. In JSX, these are written like HTML attributes.
- State: Components can maintain an internal state.
- Render: Component knows how to render itself.
We also learned that we can use create-react-app tool to setup a bootstrapper application. However, for our demo purposes, I am going to setup a basic environment without that tool.
Setting up Application Shell
I’ve setup a git repository with some packages installed like bootstrap, parceljs, react, react-dom etc.
Here is the initial structure looks like:
index.js file is the entry point for our application and here how it looks:
and here is how it currently looks in the browser:
Now, we saw a basic todo application example in previous post, I’ve moved that code in this repo:
and here is the updated index.js file, which renders TodoApp: