Modifying a React app

Open your React app folder with VS Code by selecting File | Open folder. You should see the app structure in the file explorer. The most important folder in this phase is the src folder, which contains the JavaScript source codes:

Open the App.js file from the src folder in the code editor. Remove the line that shows the image and save the file. You don't need to know anything more about this file, yet. We will go deeper into this topic in the next chapter:

Now, if you look at the browser, you should see immediately that the image has disappeared from the page:

To debug React apps, we should also install React Developer Tools, which are available for Chrome or Firefox browsers. Chrome plugins can be installed from the Chrome Web Store (https://chrome.google.com/webstore/category/extensions) and Firefox add-ons from the Firefox add-ons site (https://addons.mozilla.org). After you have installed the React Developer Tools, you should see a new React tab in your browser's developer tools after you navigate to your React app. The following screenshot shows the developer tools in the Chrome browser:

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset
3.143.17.27