> For the complete documentation index, see [llms.txt](https://program.hackyourfuture.dk/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://program.hackyourfuture.dk/course-content/foundation/intro-to-using-ai/week1/assignment.md).

# Assignment

## Build & reflect on a Personal Portfolio

### Task overview

Many people choose to have a personal portfolio website to showcase their projects, skills and experiences. It can be a nice website to share during job applications too, for hiring managers to get a quick and visual insight into who you are.

In this task, you will create the starting point of your very own portfolio. You will create a single, simple, styled page using **HTML, CSS, and JavaScript** with the support of **GitHub Copilot**. Along the way, you’ll practice writing prompts, evaluating Copilot’s outputs, and reflecting on responsible use of AI in learning.

For each step, remember to follow:

1. [The Prompting Template](/course-content/foundation/intro-to-using-ai/week1/session-plan.md#prompting-template)
2. [The AI Questions Framework](/course-content/foundation/intro-to-using-ai/week1/session-plan.md#the-ai-questions-framework)

### Part 1: Build the page

1. **Basic structure** - Create a page with a heading "About Me", a short introduction paragraph about yourself, and a list of 3 interests/skills.
2. **Add styling** - Add styling to the page to centre the heading, add a custom font, and a background color.
3. **Add interactivity** - Add a fun button on the page that changes the background to a random color when it's clicked.
4. **Make it responsive** - Use media queries to style the page for mobile and desktop size screens.

### Part 2: Reflection

Answer the following questions with short answers (3-5 sentences):

1. Identify and share **3 new things** you learned from AI in the above task.
2. Where did you have to tweak or correct Copilot’s suggestions to suit your needs?
3. How would you explain the difference between using Copilot to **generate code** for you vs. using it as an effective **learning partner**?
4. Identify **3 risks of relying too much on AI tools** when learning at HackYourFuture.

### Submission

Submit your code as usual, and create a text file named `reflection.md` alongside your code to write your answers to the above questions.

### What next?

After you've submitted this assignment, feel free to continue building and updating your portfolio as you progress through the course.

If you need some ideas about what you can add, think about:

* Project showcases - Describe and link to projects you build.
* Skills and certifications - As your learn new skills in the course, or outside of HYF, add them to your portfolio so people know what you're experienced in.
* Blog - A place to share your learnings, thoughts and write more about your projects.
* A little personality - Add photos, mini biographies, and your own design style help visitors see a little more of your personality.
* Play around and have fun - Your portfolio is a personal project that you can use to test out new technologies, tools, design ideas and fun features, so treat it like a playground to try new things.
* Host it online - Later in the course you'll learn more about deploying projects to the web. If you're too excited to wait, look into trying [GitHub Pages](https://docs.github.com/en/pages).

Need more inspiration? Find some online! Our very own mentor, Hossein, has a great example of a personal website at [hossein.dk](http://hossein.dk). There's also plenty of blog posts out there like ["Top 23 Web Developer Portfolio Examples to Inspire Your Own"](https://www.wearedevelopers.com/en/magazine/161/web-developer-portfolio-examples), so start here and explore more yourself.


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://program.hackyourfuture.dk/course-content/foundation/intro-to-using-ai/week1/assignment.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.