A Guide to Creating Your Portfolio

One of the most frequently asked questions in the Facebook group is about making a portfolio – what to put in it and how to make one. Here’s a guide to help you to figure this out!

You’ll learn the following:

  • the purpose of your portfolio
  • what types of projects to include
  • how to present them in your porfolio
  • how to host your portfolio


The purpose of a portfolio is to showcase your abilities, whether you’re a writer, a designer or a developer.

For a developer portfolio, you need to show that you can:

  • create websites and web applications using specific languages and frameworks
  • write clean code that others understand

Types of Projects to Include

Front-end Development

If you are a front-end developer, you need to show that you can create webpages from scratch with HTML, CSS and JavaScript.

Here are the types of projects from beginner to advanced:

  1. A simple website using HTML and CSS
  2. A game or calculator using JavaScript to show you know how to create interactions
    Ideas: tip calculator, memory matching game, blackjack
  3. Use a JavaScript framework to talk to APIs

Full-Stack Development

  1. A simple website using HTML and CSS
  2. A simple CRUD application with an MVC framework
    Ideas: To-do list, list of adoptable animals
  3. A more advanced CRUD application that uses several tables that relate to each other and interacts with a third-party API
    Ideas: a review site, social network, appointment booking system

Here are just a few ideas – there are thousands just a Google search away.

Unless you’re building the next startup, employers don’t really care if your idea is original or not. They already have their own ideas that they want you to build.

At the end of the day, it’s about the SKILLS that you have. It’s perfectly fine to re-create an existing website or web application (e.g. Twitter, AirBnB, Instagram).

Now that we’ve talked about what projects to put, let’s address how you should present them on your portfolio.

Quick Rules of Thumb

  • Make your targeted job title front and center, such as “Front-end Developer”, “Full-Stack JavaScript Developer”.
  • List the most relevant / impressive project first. You want to make a strong impression from the start.
  • Your portfolio should be responsive.
  • Keep it simple – 2-3 pages or even a single page is fine!

Presentation on Your Portfolio

Most people make the mistake of not putting enough information on the page. They put a screenshot, the name of the project and link it to the live demo.

Do you want to click on any of these to see what they’re about?

Instead, you need to include the following:

  • The name of your project.
  • 1-2 sentences about what it does.
  • The frameworks, libraries and APIs that you used
  • A longer description of the features you built and how you did it. For this, you can think about what the most exciting parts of the projects were for you and what you learned.
  • Link to the live demo Employers want to know that your code works.
  • Link to the Github repo Employers want to see your code.

This will paint a much more compelling picture on your skills and your journey to getting them through creating the projects.

A great example by Andrew Borstein


You can host your portfolio for FREE with Github pages.

Here’s what to do in a nutshell:

  1. Create a website on your computer in a folder.
  2. Upload it to Github.
  3. Configure settings on Github according to their instructions.

Custom Domains – Do you need one?

It’s really up to you. Employers aren’t going to reject you over this.

If you want to buy a custom domain, I recommend Google Domains as any DNS changes are updated very quickly.

monitor screen with mood board

Hi, I'm Jenny. I'm a developer with 3 years of experience. Welcome to the most supportive community for female developers!

Copy link
Powered by Social Snap