# Module Quiz : Component Use and Styling - React Basic

1. **Why is React using the concept of components?**
    
    * It helps accessibility readers for people who are visually impaired.
        
    * It improves the styling of your pages.
        
    * It allows the browser to render your pages faster.
        
    * <mark>It allows you to build more modular apps.</mark>
        
2. **What is the absolute minimum code that a component must have to be able to show something on a screen when rendered?**
    
    * <mark>A named function declaration and a return statement with at least a single element with some text inside of it.</mark>
        
    * A named function declaration and an array of items inside of the function's body.
        
    * A named function declaration and some variables in the function’s body.
        
    * A named function declaration.
        
3. **What are the benefits of using props?**
    
    * Props allow developers to write custom HTML tags.
        
    * <mark>Props allow parent components to pass data to children components.</mark>
        
    * Props allow children components to update the values of each prop independent from their parent component.
        
4. **You are tasked with building a web layout using React. The layout should have a header, a footer, and three products showing various data in the main part of the page. Choose the preferred component structure.**
    
    * <mark>It should have the following components: Header, Main, Product, Footer (with the Product component being imported into Main and rendered three times).</mark>
        
    * It should have a separate component for each link, paragraph, heading, etc.
        
    * It should all fit into a single component named App component.
        
5. **Which of the following keywords can you usually find in a React component?**
    
    * function, props, export, import, contain
        
    * module, function, prop, exported, default
        
    * <mark>function, props, return, export, default</mark>
        
    * modular, expression, prop, default
        
6. **What is create-react-app?**
    
    * It’s a command you run when you want to serve your app in the browser.
        
    * <mark>It’s an npm package used to build a boilerplate React app.</mark>
        
    * It’s a command you can use in a component.
        
    * It’s a stand-alone application on the web.
        
7. **Imagine you want to build a brand new React app, named “example”. Choose the correct command to build a starter React app to work off of.**
    
    * npm install react-app example
        
    * node init react-app example
        
    * <mark>npm init react-app example</mark>
        
    * npm initialize react-app example
        
8. **True or false? When you write arrow functions, for any number of parameters other than a single parameter, using parentheses around parameters is compulsory.**
    
    * <mark>True.</mark>
        
    * False
        
9. **True or false? You can use function calls in JSX.**
    
    * <mark>True</mark>
        
    * False
        
10. **True or false? When an arrow function has a single parameter, you do not need to add parentheses around the item parameter (to the left of the arrow).**
    
    * <mark>True</mark>
        
    * False