Maintenance

Site is under maintenance — quizzes are still available.

Go to quizzes
Sponsored Reserved space — layout preview until AdSense is connected
Tutorial

A Complete Guide to Setting Up a Development Portfolio Site

Learn how to build and deploy a simple, effective developer portfolio site using Flask. This step-by-step guide covers project structure, templates, styling, and free hosting on PythonAnywhere.

July 2026 10 min read 1 views 0 hearts

You've built projects, solved problems, and written code that works. But when someone asks, "Can I see your work?" — do you have a place to send them? A portfolio site isn't just a nice-to-have for developers. It's your digital handshake, your resume that never sleeps, and your chance to show what you can actually do.

At PythonSkillset, we've seen developers land jobs because their portfolio told a story their resume couldn't. Let's walk through setting up one that works for you.

Why Bother With a Portfolio Site?

Think about it. A recruiter or client gets hundreds of applications. Your resume lists "Python, Django, React" — so does everyone else's. But a portfolio site shows your projects running live, your code organized, and your thinking process visible.

It's not about being flashy. It's about being real. A simple site with three solid projects beats a fancy template with nothing behind it.

What You Actually Need

Before we dive into code, let's be honest about what matters:

  • A domain name — something like yourname.dev or yourname.io. Costs about $10-15 a year.
  • Hosting — GitHub Pages is free. Netlify is free. PythonAnywhere has a free tier for Python apps.
  • Content — your projects, a short bio, and contact info. That's it.

You don't need a database. You don't need a backend framework unless you're showing off backend skills. Keep it simple.

Choosing Your Tech Stack

Here's the thing: your portfolio site is also a project. So pick tools that show your strengths.

If you're a Python developer, consider building with Flask or Django. A simple Flask app with a few routes can serve your portfolio beautifully. You can host it on PythonAnywhere for free.

If you're more frontend-focused, static site generators like Hugo or Jekyll work great. Or just plain HTML, CSS, and JavaScript — nothing wrong with that.

If you want to go full Python, here's a minimal Flask setup:

from flask import Flask, render_template

app = Flask(__name__)

@app.route('/')
def home():
    return render_template('index.html')

@app.route('/projects')
def projects():
    return render_template('projects.html')

if __name__ == '__main__':
    app.run(debug=True)

That's it. Three routes. One for home, one for projects, one for contact. You can expand later.

What to Put on Your Site

This is where most people overthink it. Here's what actually works:

A Clear Headline

Not "John Doe, Full-Stack Developer." That's boring. Try something like "I build Python tools that save people time" or "Turning data into decisions with Python."

Your Best Projects (Not All of Them)

Pick three projects max. For each one, include:

  • What problem it solves
  • What you used (Python, Flask, Pandas, etc.)
  • A link to the live demo or GitHub repo
  • One screenshot or GIF showing it in action

Don't list every script you've ever written. Curate. A weather app that works is better than five half-finished ideas.

A Short Bio

Two or three sentences. Who you are, what you build, what you're looking for. Keep it human. "I'm a Python developer who loves automating boring tasks" is better than "Experienced professional seeking opportunities."

Contact Info

Email, LinkedIn, GitHub. That's enough. Don't make people hunt for how to reach you.

Building It Step by Step

Let's use Flask because it's Python, it's simple, and it shows you know web development.

Step 1: Set Up Your Project

Create a folder called portfolio. Inside, make this structure:

portfolio/
├── app.py
├── templates/
│   ├── base.html
│   ├── index.html
│   ├── projects.html
│   └── contact.html
├── static/
│   └── style.css
└── requirements.txt

Step 2: Write the Flask App

In app.py, start with the basics:

from flask import Flask, render_template

app = Flask(__name__)

@app.route('/')
def home():
    return render_template('index.html')

@app.route('/projects')
def projects():
    project_list = [
        {
            'title': 'Task Manager API',
            'description': 'A RESTful API built with Flask and SQLite that lets users create, update, and delete tasks.',
            'tech': 'Python, Flask, SQLite',
            'github': 'https://github.com/yourname/task-manager',
            'demo': 'https://task-manager-demo.pythonskillset.com'
        },
        {
            'title': 'Weather Dashboard',
            'description': 'Fetches live weather data from OpenWeatherMap and displays it with Matplotlib charts.',
            'tech': 'Python, Requests, Matplotlib',
            'github': 'https://github.com/yourname/weather-dashboard',
            'demo': 'https://weather-demo.pythonskillset.com'
        }
    ]
    return render_template('projects.html', projects=project_list)

@app.route('/contact')
def contact():
    return render_template('contact.html')

Notice how we pass data to the template. That's the Flask way — clean and readable.

Step 3: Build the Templates

Create templates/base.html as your layout:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>{% block title %}My Portfolio{% endblock %}</title>
    <link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
</head>
<body>
    <nav>
        <a href="/">Home</a>
        <a href="/projects">Projects</a>
        <a href="/contact">Contact</a>
    </nav>
    <main>
        {% block content %}{% endblock %}
    </main>
</body>
</html>

Now templates/index.html:

{% extends "base.html" %}
{% block title %}Home - My Portfolio{% endblock %}
{% block content %}
<h1>Hi, I'm [Your Name]</h1>
<p>I build Python tools that make life easier. From data pipelines to web apps, I turn ideas into working code.</p>
<p>Check out my <a href="/projects">projects</a> or <a href="/contact">reach out</a>.</p>
{% endblock %}

And templates/projects.html:

{% extends "base.html" %}
{% block title %}Projects{% endblock %}
{% block content %}
<h1>My Projects</h1>
{% for project in projects %}
<div class="project-card">
    <h2>{{ project.title }}</h2>
    <p>{{ project.description }}</p>
    <p><strong>Tech:</strong> {{ project.tech }}</p>
    <a href="{{ project.github }}">GitHub</a> | <a href="{{ project.demo }}">Live Demo</a>
</div>
{% endfor %}
{% endblock %}

Step 4: Style It Simply

In static/style.css, keep it clean:

body {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    max-width: 800px;
    margin: 0 auto;
    padding: 20px;
    line-height: 1.6;
    color: #333;
}

nav a {
    margin-right: 20px;
    color: #0066cc;
    text-decoration: none;
}

.project-card {
    border: 1px solid #ddd;
    padding: 20px;
    margin-bottom: 20px;
    border-radius: 8px;
}

That's it. No CSS framework needed. Just readable, responsive, and fast.

Hosting Your Site

For a Flask portfolio, PythonAnywhere is the easiest free option:

  1. Sign up for a free account.
  2. Upload your files via the web interface or Git.
  3. Set up a web app pointing to your Flask app.
  4. Your site is live at yourusername.pythonanywhere.com.

If you want a custom domain, you can point it there too. PythonAnywhere has clear docs for that.

What Makes a Portfolio Stand Out

From what we've seen at PythonSkillset, the best portfolios share a few things:

  • Live demos — not just GitHub links. Let people click and see your app working.
  • Real projects — not tutorials. Build something that solves a problem you actually had.
  • Clear writing — explain what you built and why. Don't assume people will figure it out.
  • One call to action — "Hire me" or "Let's talk" or "See my resume." Make it obvious.

Common Mistakes to Avoid

  • Too many projects — three strong ones beat ten weak ones.
  • Broken links — test every link before you share your site.
  • No mobile view — most people will look on their phone. Make sure it works.
  • Outdated info — if you haven't touched it in two years, it looks like you stopped coding.

A Real Example

Let's say you built a tool that scrapes job listings and sends you an email when new Python jobs appear. Your portfolio entry could say:

"Built a Python scraper that checks job boards daily and emails me new Python developer positions. Uses BeautifulSoup for scraping, smtplib for email, and runs on a cron job. Saved me hours of manual searching."

That's specific. That's useful. That shows you solve real problems.

Going Further

Once your basic site is up, you can add:

  • A blog section where you write about what you're learning
  • A live demo of a small app embedded in the page
  • A dark mode toggle (shows attention to detail)
  • Analytics to see what people click on

But start simple. Launch first, improve later.

Your Next Step

Pick one project you've already built. Write a short description. Create a GitHub repo if you haven't already. Then build the Flask app above and deploy it.

You'll have a portfolio site live by the end of the day. And that's one more thing checked off your list.

At PythonSkillset, we believe the best portfolio is the one you actually finish. So go build yours.

Comments

Questions, corrections, and tips stay visible for everyone reading this page.

0 in thread

Join the discussion

Shown next to your comment.

Up to 4,000 characters

No comments yet

Be the first to leave a note — it helps the next reader.