How to operate Face Hugging to host your portfolio for free

Photo by the author

# Entry

An online portfolio is no longer optional. This is usually the first thing people check when they want to see what you can actually do. Not your CV. Not your LinkedIn. Your job. If you create as a developer, data scientist, ML engineer, designer, or even just learning, a portfolio will give your projects a place to live. And you don’t need paid hosting for this.

Face hugging is one of those tools that people overlook. It’s free, uncomplicated to implement, and good enough to host a neat personal website with live demos. You can keep it uncomplicated or add interactive elements if they fit your work. In this article, we’ll discuss what Hugging Face Spaces is, why it’s great for a portfolio, and how you can implement yours step by step.

# What is facial space hugging?

Hugging Face Spaces is a platform that allows you to host web applications directly from a GitHub repository, making implementation uncomplicated and accessible even for beginners. Although it was originally designed to showcase machine learning demos, the platform has evolved significantly and now supports a wide range of applications, including inert websites, Python-based applications, interactive user interfaces, and full-featured AI-based demos. You can build spaces with:

• Stagnant HTML/CSS/JS
• Gradio (Python UI framework)
• Streamlined

For wallets, this flexibility is a huge advantage. Let’s see step by step how to host your portfolio on Hugging Face Spaces for free.

# Step 1: Create a faceshake account

Go to Hug Face and sign up.

# Step 2: Prepare your wallet

You can choose one of the following approaches:

// Option A: Stagnant website (HTML/CSS/JS)

Your folder may look like this:

portfolio/
│── index.html
│── style.css
│── script.js

// Option B: Python-based portfolio (Gradio/Streamlit)

This includes files such as:

# Step 3: Creating a fresh space

1. Click Novel Space

   

   This will open the next page

   
   

2. To choose:

   • Owner: your username
   • Space name: e.g. my-portfolio
   • License: MIT (recommended)

3. Select SDK:

   • Stagnant for HTML, CSS and JS portfolios
   • Gradio for Python-based interactive portfolios
   • Streamlined for data dashboards

4. After completing, click Create space.

   
   

# Step 4: Uploading or linking code

You can upload files directly or connect to the GitHub repository.

• For a inert SDK, simply upload Index.html and assets.
• For Gradio or Streamlit, make sure:
• app.py exists
• the requirements.txt file contains a list of dependencies

Hugging Face automatically builds and implements your space. For example, since I have selected Gradio, I will click create app.py file:

Then the following page opens:

I will modify the app.py file as follows:

import gradio as gr

def contact_message(name, message):
    return f"Thanks {name}! Your message has been received 😊"

with gr.Blocks(title="Eisha's Portfolio") as demo:
    gr.Markdown(
        """
        # 👋 Hi, I'm Kanwal  
        ### AI / ML Enthusiast | Python Developer  

        Welcome to my portfolio!  
        I enjoy building AI-powered applications and neat backend systems.
        """
    )

    gr.Markdown("## 🚀 Projects")
    gr.Markdown(
        """
        **🔹 PDF Parser with LangChain**  
        Custom PDF parsing with header/footer removal and LLM integration.

        **🔹 Case Similarity Finder (FYP)**  
        Finds similar medical/legal cases using LLaMA-based embeddings.

        **🔹 AI Chatbot Demo**  
        Conversational AI built using Hugging Face models.
        """
    )

    gr.Markdown("## Resume")
    gr.Markdown(
        "[Download my resume](https://example.com/resume.pdf)"
    )

    gr.Markdown("## Contact Me")
    name = gr.Textbox(label="Your Name")
    message = gr.Textbox(label="Your Message", lines=3)
    output = gr.Textbox(label="Response")
    submit = gr.Button("Send Message")
    submit.click(contact_message, inputs=[name, message], outputs=output)

    gr.Markdown(
        """
        ---
        🔗 **GitHub:** https://github.com/yourusername  
        🔗 **LinkedIn:** https://linkedin.com/in/yourprofile  
        """
    )

demo.launch()

After editing the app.py file, click Commit fresh file in the main file:

# Step 5: Your portfolio is busy

Now on the same page, click on the app to view your portfolio.

After clicking you can see your portfolio:

Alternatively, you can also visit https://–.hf.space to view your portfolio. This is your busy portfolio link that you can share. A portfolio doesn’t have to be inert. You can include:

• About me section
• Projects with live demonstrations
• Resume download
• Contact links
• GitHub and LinkedIn

With Gradio you can turn it into an interactive experience.

# Tips to make your portfolio stand out

1. Add live demos:
   • ML models
   • Chatbots
   • NLP tools
   • Data visualizations
2. Keep it delicate: Free spaces have resource limits, so optimize your resources
3. Utilize a neat UI: Minimalist design with impressive animations
4. Add the README.md file: Your Space page displays README content, so operate it wisely

# Final thoughts

Hugging Face Spaces is more than just a demo platform. It is a free, newfangled and competent wallet hosting solution. If your work involves code, data, or AI, hosting your portfolio on Spaces instantly sets you apart from customary inert sites. Your portfolio shouldn’t be circumscribed to what you can do. It’s worth showing it live.

Kanwal Mehreen is a machine learning engineer and technical writer with a deep passion for data science and the intersection of artificial intelligence and medicine. She is co-author of the e-book “Maximizing Productivity with ChatGPT”. As a 2022 Google Generation Scholar for APAC, she promotes diversity and academic excellence. She is also recognized as a Teradata Diversity in Tech Scholar, a Mitacs Globalink Research Scholar, and a Harvard WeCode Scholar. Kanwal is a staunch advocate for change and founded FEMCodes to empower women in STEM fields.