front-end developer capstone coursera week 2 quiz answers
Knowledge check: Semantic structure
1. Which of the following are semantic HTML tags? Choose all that apply.
- <header>
- <h1>
- <table>
- <div>
- <article>
2. Complete the sentence: Semantic tags are a way to...
- Create a table of data.
- Add style to a webpage or document.
- Give meaning to the content of a webpage or document.
- Create a layout for a webpage or document.
3. What is Open Graph protocol (OGP)?
- A protocol for describing the shared content on social media platforms
- A protocol for sending and receiving email messages
- A protocol for encrypting data transmitted over the internet
- A protocol for transmitting audio and video over the internet
4. HTML meta tags are used to provide information about a webpage to search engines and other web services.
- True
- False
5. Which of the following meta tags are valid? Choose all that apply.
- viewport
- og:title
- description
- responsive
Knowledge check: Styling and responsiveness
6. What is the fr unit in CSS grid?
- A length unit used only for the texts in the grid
- A flexible color unit to be used in the grid
- A flexible length unit that grows or shrinks based on the available space in the grid
- A flexible length unit used only for the images in the grid
7. Choose the correct explanation for how the CSS code below works.
@media (max-width: 700px) {
.grid-adjustable-columns {
display: grid;
grid-auto-flow: row;
}
}
@media (min-width: 701px) {
.grid-adjustable-columns {
width: min(1000px,75rem);
margin: 0 auto;
grid-auto-flow: column;
gap: 1em;
}
}
- On small resolutions it stacks the grid items in a column and on large resolutions it lines them up in a single row.
- This code doesn’t work.
- On large resolutions it stacks the grid items in a column and on small resolutions it lines them up in a single row.
8. Which of the following statements about CSS Grid is true?
- CSS Grid is a layout system that allows developers to create grid-based layouts using rows and columns.
- CSS Grid is a programming language used for creating dynamic and interactive web applications.
- CSS Grid is a design tool used for creating graphics and visual elements for webpages.
- CSS Grid is a styling system that allows developers to apply styles to specific elements of a webpage.
9. In CSS Grid, horizontal tracks are also known as:
- Grid items
- Rows
- Columns
10. True or false: CSS Grid layout automatically adjusts the size of grid tracks.
- True
- False
Knowledge check: Adding components
11. Choose the correct statement about the following code:
< >
< h1>...< /h1>
< p>...< /p>
< />
- This is a valid HTML tag
- This is valid React code.
- This is valid JavaScript code
- This is not valid React code
12. In React, you can only have one root element in a component.
- True
- False
13. Which of the following statements are true about JSX?
Choose all that apply.
- JSX elements must be self-closing.
- JSX allows you to include expressions in your code.
- JSX elements can have multiple children.
- JSX allows you to use JavaScript functions as attributes
- JSX elements must be written in all uppercase.
14. What is the output of the following JSX code block?
const myList = ['apple', 'banana', 'orange'];
const listItems = myList.map((item) =>
< li key={item}>{item}< /li>
);
return (
< ul>{listItems}< /ul>
);
- <li>apple</li><li>banana</li><li>orange</li>
- <ul><li>apple</li><li>banana</li><li>orange</li></ul>
- [<ul>,<li>apple</li>, <li>banana</li>, <li>orange</li>,<ul>]
- <ul> [<li>apple</li>, <li>banana</li>, <li>orange</li>] </ul>
15. Which of the following is true about props in React?
- Props are mutable and can be changed within a component.
- The prop value must be wrapped in quotes.
- Props should be used for values that will not change within a component.
- Props should only be used for simple data types, such as strings and numbers.
Module Quiz: Project Foundations
16. What are semantic tags in HTML?
- They are the tags that include data about your website’s encoding.
- A way to describe the meaning of your website through the tags you use.
- Semantic tags hold metadata about the website, such as the website version number.
- A way in which you can reduce the number of tags used by using more general tags like <div>.
17. What are the benefits of semantic HTML? Select all that apply.
- Improves SEO
- Improves performance
- Allows for more styling options
- Makes the code easier to read and understand
- Improves accessibility
18. Which Open Graph tag should be used if you want to provide a title to a shareable link of your web page?
- og:head
- og:header
- og:description
- og:title
19. Which of the following are valid values for the CSS display property? Select all that apply.
- float
- flex
- grid
20. Which of the following CSS selectors is an example of an adjacent sibling selector?
- div p
- div + p
- div > p
21. You’ve designed a website for a client, and they’ve presented you with some feedback and suggestions they’d like implemented. One of the suggestions pertains to responsive design where the client would like to have the text change color to red when hovering over navigation links. Which one of the following would achieve this using pseudo-classes?
- a:hover { color:red; }
- a:link { color:red; }
- a:visited { purple:red; }
- a:class { color:red; }
22. You’re designing a responsive portfolio website to show off your skills as a front end developer. Where possible you are trying to avoid absolute units of measurement in favor of relative values so that your portfolio website can be easily viewed across different viewport sizes. Which of the following are relative units of measurement? Select all that apply.
- in
- rem
- px
- vh
23. True or False: HTML event attributes don’t use parentheses; React event attributes use parentheses
- True
- False
24. In React, which type of data is stored internally inside a component?
- props
- super
- state
- tangible
25. True or False: The following is valid JSX code:
export default function Body() {
return
< div className="body-grid">
< h1>This is the main body< /h1>
< /div>
}
- True
- False