0% found this document useful (0 votes)
5 views2 pages

Day 2 PAH

The document outlines the steps to create a simple React component called Greeting, which displays a welcome message with the current date. It includes instructions for setting up the component in a React application, installing necessary packages, and running the application. Finally, it provides steps for testing and submitting the project.

Uploaded by

2508remo
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
5 views2 pages

Day 2 PAH

The document outlines the steps to create a simple React component called Greeting, which displays a welcome message with the current date. It includes instructions for setting up the component in a React application, installing necessary packages, and running the application. Finally, it provides steps for testing and submitting the project.

Uploaded by

2508remo
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 2

Day 2 PAH

Step 1:

Create a Greeting.jsx file inside reactapp/src/components

Step 2:

Greeting.jsx

import React from 'react';

function Greeting()
{
const name = "John";
const currentDate = new Date().toLocaleDateString(undefined, {
weekday: 'long',
year: 'numeric',
month: 'long',
day: 'numeric',
});
return(
<div>
<h2>Hello, {name}!</h2>
<p>Welcome to our website. Today is {currentDate}.</p>
</div>
);
}

export default Greeting;

Step 3:

App.js

import './assets/css/App.css';
import Greeting from '.components/Greeting';
function App() {
return (
<div className="App">
<Greeting />

</div>
);
}

export default App;

Step 4:

open terminal and type

cd reactapp

npm install

npm install canvas

npm audit fix (if any vulnerabilities came means type this)

npm start

Step 5:

close the new tab and open again by pressing Port 8081, you get the result

Step 6:

1. run the test case

2. save the code for both file

3. submit project

4. Submit Test

You might also like