Project Overview:

In this project, you will enhance a provided HTML starter file to create a single$-$page personal

portfolio website. The main objective of this site is to simulate the display of your projects,

introduce yourself, and offer a way for visitors to get in touch with you. It is important to note that

this is a simulation, and you are not obligated to use real information. Furthermore, the website

will not be published or deployed.

At the end of the assignment are screenshots of what the project should look like when you are

completed. You do not need to match the styling, you can customize that to your liking, but you

must have all the requested elements.

Detailed Instructions:

Step $1$: Edit the HTML content

$$ Opentheprovided HTML file.

$$ Replace "Your Name's Portfolio" with your own name in the header section.

$$ Write a brief introduction about yourself in the paragraph below your name in the header

section.

$$ Inthe projects section, replace "Project Name" and the corresponding description with

information about one of your mock or actual projects. For the image, use a real image

of your project $($you$\text{'}$ll add this in the CSS later$).$

$$ Duplicate the project div for as many projects as you wish to showcase. Make sure to

replace the placeholders with your actual project information.

$$ Addyourtechnical skills in the skills section. Replace "Skill $1"$ with an actual skill, and

duplicate the skill div for as many skills as you wish to showcase.

Step $2$: Update the CSS styles

$$ Inthe CSSstyle section within the head tag, replace the URLs for the header and

project background images. Look for the comment that says "You will add the URLs for

the header and project background images in the CSS section."

$$ Next, you'll add responsive styling for mobile devices. Look for the comment that says

"Your CSS for mobile screens will go here." At a minimum, you should adjust the font

size, padding of the sections, and padding of the header to better fit smaller screens.

You may also want to adjust other aspects of the design as necessary to ensure the site

looks good on mobile devices.

Step $3$: Update the JavaScript functionality

$$ Inthe script section within the head tag, add modify the JavaScript function displayYear$()$

to dynamically load the current year.

$$ Addonload$=$"displayYear$()"$ to the body tag. This will call the function as soon as

the page loads, displaying the current year dynamically in the footer.

Step $4$: Review your work

$$ Reviewall the code to make sure it's correct and complete. The provided HTML$,$ CSS$,$

and JavaScript should serve as a starting point, but your final portfolio should be unique

and reflect your own style and projects.

$$ Test the layout on different screen sizes to ensure that it's properly responsive. The text

should be readable, and no horizontal scroll should appear on mobile devices