Getting Started with React: Your First ‘Hello World’ Project”-React(No2) Quiz

Learn the essential steps of building a simple 'Hello World' app using React, from installation to customization and production build. This quiz covers key concepts for beginners in modern frontend development.

1. Installation Requirements

   Which two tools must be installed on your computer before creating a new React app?

   1. Node.js and npm
   2. Java and Maven
   3. Ruby and Gem
   4. Python and pip

   Explanation: Node.js and npm are required to create and manage React projects since React depends on the Node ecosystem. Python and pip are for Python projects, Java and Maven for Java applications, and Ruby and Gem for Ruby projects.

2. Project Initialization Command

   What command should you use to set up a new React project called 'hello-react' without installing create-react-app globally?

   1. npx create-react-app hello-react
   2. npm install react hello-react
   3. create-react hello-react
   4. react-init hello-react

   Explanation: Using 'npx create-react-app hello-react' initializes a React app in a folder called 'hello-react' without global installation. The other options are invalid or outdated commands for modern React app setup.

3. Editing for Hello World

   Which file should be updated to make the app display 'Hello, World!' on the page?

   1. public/index.html
   2. package.json
   3. src/App.js
   4. src/index.js

   Explanation: The 'src/App.js' file contains the main component that controls what appears on the screen, so editing it ensures 'Hello, World!' is shown. 'public/index.html' provides the root HTML, 'src/index.js' handles entry-point rendering, and 'package.json' contains project settings.

4. Starting the Development Server

   Which command launches the React app locally and opens it in your default web browser?

   1. npm build
   2. react launch
   3. yarn deploy
   4. npm start

   Explanation: 'npm start' runs the local development server and opens your app, making it viewable on localhost. 'npm build' (should be 'npm run build') is for production builds, 'react launch' is not a valid script, and 'yarn deploy' is for deployments, not local development.

5. Production Build Process

   How do you generate an optimized, production-ready version of your React app?

   1. npm run build
   2. npm install production
   3. npm test
   4. npx serve

   Explanation: 'npm run build' creates a minified, optimized build suitable for deployment. 'npm test' runs tests, 'npm install production' is invalid, and 'npx serve' starts a static server but does not build the app.