Menu
I don't understand the structure of most boilerplates out there. I always see 2 files named "index" (one js file and an other html file). I want to understand how the main entry point works. I often see web pack for this job but my main concern is, why do am I using an index.html file when I can (I guess) do all my work in js file?
699
js , which is the entry point for the React application.
public/index. html: When the application starts this is the first page that is loaded. This will be the only html file in the entire application since React is generally Written using JSX which I will cover later.
lazy(() => import('./OtherComponent')); This will automatically load the bundle containing the OtherComponent when this component is first rendered. React. lazy takes a function that must call a dynamic import() .
super() will call the constructor of its parent class. This is required when you need to access some variables from the parent class. Hope this helps!
Well I structure my React apps like this:
index.js - calls ReactDOM.render() on app.jsx, which is the root React component.
bundle.js - This file is where index.js and all the JSX components are merged after being compiled into regular JavaScript using Webpack (hence bundle).
index.html - bundle.js is imported into the body of this html file through script tag, this is the entry point.
190
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
