You've learned a lot this semester: from basic command line tools to complex git workflows, from HTML semantics to organizing large pages and projects, from simple text formatting with CSS to all the ways to make the same layout with different properties.
Now you'll put it all together and build your own portfolio website!
For developers, a portfolio of work can be even more important than your resume. It's a place to showcase your work and your skills to the world. Here are some of my favorites from professional designers and developers:
Of course, I won't compare yours to a professional's, and neither should you! Use these as inspiration not a measuring stick. Here are some that former students have built:
The first step is to search around and find at least two sources of inspiration. You might find the tone of the content interesting, or you think it's a well organized layout, or you might just like the color or font choices. We're not going to rip off the design, of course, but it helps to find things we like in order to emulate them. Post your links to your Slack group and explain why it's inspired you.
The next step is to figure out your content, the whole purpose of your site. Read this guide to website structure and simple planning on MDN and go through the exercise at the bottom. This article teaches you a few more HTML elements that we haven't talked about yet. They'll be handy for this site build and we'll work more with them later. The exercise called "Planning a simple website" introduces the idea of Information Architecture, the process of organizing content for a good user experience.
To plan your portfolio, follow this exercise and complete the five steps on paper. Take a photo and post them in a thread on your Slack group. Think of this as a rough draft. Here are some things you should think about:
Do not start coding yet! We'll review the plans together in groups and you must be approved before moving on to the next step.