Learning React, Node & Express by Building Real Projects Quiz

Quickly gain hands-on skills in React and Node.js by immediately building simple projects. Practice essential frontend and backend concepts crucial for modern web development.

1. Getting Started with React

   Which tool is commonly used to quickly create a new React application and set up its basic structure?

   1. node-init
   2. create-react-app
   3. express-generator
   4. npm run dev

   Explanation: create-react-app is a popular tool for bootstrapping new React projects and configuring the build process automatically. express-generator is for Express server scaffolding, not React. npm run dev is a command for running development scripts, not initializing projects. node-init is not a real tool for React project setup.

2. Understanding React Components

   In React, what is the primary role of a component?

   1. A function that returns UI elements
   2. A database connection manager
   3. A stylesheet for page layout
   4. A module that manages server routes

   Explanation: A React component is essentially a function (or class) that generates UI elements based on data and state. Managing server routes is a backend responsibility, handled by frameworks like Express. Database connections and stylesheets are unrelated to React components.

3. React State and Events

   Which React hook is typically used to manage and update local state within a functional component, such as the count in a counter app?

   1. useState
   2. useFetch
   3. useRoute
   4. useConnect

   Explanation: useState is designed for declaring and updating state variables in functional React components. useRoute does not exist in React's core API, useFetch refers to data fetching patterns, and useConnect is not a built-in React hook.

4. Setting Up a Node.js Backend

   What is the purpose of running 'npm init' when starting a new Node.js project?

   1. To create a package.json file and initialize the project
   2. To install React dependencies
   3. To connect the project to a remote database
   4. To run the backend server

   Explanation: 'npm init' generates a package.json file that defines project metadata and dependencies in Node.js. Installing React dependencies is a different process, running the backend server requires a separate command (like node index.js), and connecting to databases is not handled by 'npm init'.

5. Express API Basics

   How does Express typically allow a backend server to receive data and respond to GET and POST requests in a simple API?

   1. By defining route handlers for each method
   2. By using only static HTML files
   3. By modifying frontend components directly
   4. By setting environment variables

   Explanation: Express creates API endpoints by defining route handlers for HTTP methods like GET and POST. Modifying frontend components is unrelated to backend logic. Serving only static HTML does not process dynamic data, and setting environment variables manages configuration rather than request handling.