Task 2: Create the Banner Component
Create Banner.jsx
Create a new file named
Banner.jsx
inside thecomponents
directory.Inside this file, create a function called
Banner
.This function should return a
<header>
tag that says: “Orbit Report”.Below the
<header>
create a<p>
tag with instructions for users.Here is an example message:
Click on the buttons to see the satellites in that orbit type
Make sure that you are exporting this function.
Open
App.jsx
- Import the new
Banner
component you created. - Nest the
Banner
component inside theApp()
function.
10 11 12 13 14 15 16 17 18
function App() { return ( <div> <Banner /> <Buttons /> <Table /> </div> ); }
- Import the new
Check to see if your
Banner
renders.