software

How to Publish and Share a Power BI Report Online

Published: (April 5, 2026 at 09:28 PM EDT)
6 min read
Source: Dev.to

Source: Dev.to

Publishing a Power BI Report to the Web

As we continue to explore Data Science and Analytics, this week’s deliverable was to build an electronics‑sales dashboard in Power BI and publish it online. Publishing a report is a common request in data analytics, so in this article we walk through the full process—from clicking Publish in Power BI Desktop to getting a shareable link that anyone can open in a browser.

Quick Overview of the Report

ItemDetails
Dataset100 electronics retail transactions across 10 products, 9 cities (USA & Canada), and 3 sales representatives.
Data preparation• Loaded raw Excel data into Power Query.
• Cleaned, validated, and normalized the data.
• Converted CAD transactions to USD at a rate of 0.74.
• Built a star schema with six dimension tables (Products, Customers, Cities, SalesReps, PaymentMethod, DateTable) linked to a central fact table.
DAX measuresTotal Revenue, Total Profit, Total Orders, Average Profit Margin, Average Shipping Cost, and a calculated Date Table using CALENDAR().
Dashboard pagesPage 1 – Executive Dashboard – KPI cards, sales by product, revenue by category, sales‑rep distribution, payment‑method breakdown, interactive slicers.
Page 2 – Product Analysis – Revenue & profit comparison by product, geographic maps, profit‑margin rankings.
Page 3 – Sales Reps & Customers – Customer rankings, sales‑rep performance combo chart, customer‑age distribution.

1️⃣ Publish from Power BI Desktop

  1. Open your .pbix file in Power BI Desktop.
  2. In the Home ribbon, click Publish (right side of the toolbar).
    • If you’re not signed in, you’ll be prompted to sign in with your Microsoft account (the one linked to your Power BI Service subscription).
  3. Choose a destination workspace:
    • You’ll see a list of available workspaces.
    • If you haven’t created any custom workspaces, only My workspace will appear (the default personal workspace).
  4. Click Select. Power BI Desktop uploads the report (a few seconds, depending on file size).
  5. When the upload finishes, you’ll see a success confirmation.
    • Click Open in Power BI to jump directly to the report in the browser, or click Got it to stay in Desktop.

2️⃣ Verify the Report in Power BI Service

  1. Go to app.powerbi.com and navigate to the workspace you selected.
  2. You should see your report listed there.
  3. Open the report and check:
    • Do all visuals render correctly?
    • Do slicers filter across all charts as expected?
    • Do navigation buttons (if any) work?
    • Are the KPI numbers matching what you see in Desktop?

Screenshot note – The left sidebar shows the Pages panel listing all pages (Dashboard, Products, Sales Reps, …). The toolbar at the top includes File, Export, Share, Explore, Set alert, Monitor, and Edit. The options we’ll use for sharing are File, Export, and Share.

3️⃣ Share the Report Publicly (Publish to Web)

Important: This method makes the report public—anyone with the link can view it without signing in. Use it only for data that can be shared openly.

  1. In Power BI Service, go to File > Embed report > Publish to web (public).
  2. Power BI generates two items:
    • Direct URL – opens the report in any browser.
    • iFrame embed code – can be pasted into a website, blog, or portfolio page.

Example outputs

Direct URL:
https://app.powerbi.com/view?r=eyJrIjoi...
<!-- iFrame embed code (example) -->
<iframe width="800" height="600" src="https://app.powerbi.com/view?r=eyJrIjoi..." frameborder="0" allowFullScreen="true"></iframe>

Anyone with the link can view and interact with the report; no sign‑in is required.

4️⃣ Host the Embedded Report

Option A – Simple index.html page

Create an index.html file (or any HTML page) and paste the iframe code. Below is a ready‑to‑use template:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Electronics Sales Dashboard</title>
    <style>
        body {
            margin: 0;
            font-family: Arial, sans-serif;
            background: #f5f5f5;
        }
        .header {
            background: #1B2A4A;
            color: white;
            padding: 20px 40px;
        }
        .header h1 {
            margin: 0;
            font-size: 24px;
        }
        .header p {
            margin: 8px 0 0;
            font-size: 14px;
            color: #B5D4F4;
        }
        .container {
            max-width: 1200px;
            margin: 24px auto;
            padding: 0 20px;
        }
        iframe {
            width: 100%;
            height: 600px;
            border: none;
            border-radius: 8px;
        }
    </style>
</head>
<body>
    <div class="header">
        <h1>Electronics Sales Dashboard</h1>
        <p>Power BI Report – January 2026</p>
    </div>
    <div class="container">
        <!-- Replace YOUR_EMBED_URL_HERE with the URL generated in step 3 -->
        <iframe src="YOUR_EMBED_URL_HERE"></iframe>
    </div>
</body>
</html>

Option B – Host on GitHub Pages

If your project already lives in a GitHub repository:

  1. Create a sub‑folder (e.g., electronics-sales/).
  2. Place the index.html file inside that folder.
  3. Commit & push the changes.
  4. In the repository settings, enable GitHub Pages and point it to the folder you just created.

Your dashboard will now be publicly accessible at https://<username>.github.io/<repo>/electronics-sales/.

🎉 Summary

  1. Publish the .pbix from Desktop to a Power BI workspace.
  2. Verify that all visuals, slicers, and navigation work in the Service.
  3. Use File > Embed report > Publish to web to obtain a public URL and iframe code.
  4. Host the iframe on any web page (simple HTML file or GitHub Pages).

You now have a fully interactive, publicly shareable electronics‑sales dashboard that anyone can view in a browser—perfect for portfolios, blogs, or showcasing your data‑analytics skills. Happy visualizing!

Deploying Your Project to GitHub Pages

  1. Push your code to GitHub.

  2. In your repository, go to Settings → Pages.

  3. Set the source to Deploy from the main branch.

  4. Wait a minute or two – your site will be live at

    https://yourusername.github.io/repo-name/electronics-sales/

  5. Multiple projects?

    • If the repo contains several sub‑folders, each folder that has its own index.html will be served as a separate page under the same base URL.
    • You only need to enable GitHub Pages once per repository.

Power BI Publishing Workflow

  1. Build the report in Power BI Desktop.
  2. Publish the report to a workspace in the Power BI Service.
  3. Verify that everything works correctly in the browser.
  4. Share the report using one of the available methods:
    • Publish to web
    • Direct share
    • Export (PDF, PowerPoint, etc.)
  5. Embed the report on a website or GitHub Pages if you want a standalone, hosted version.

Want to explore the full project?

Check out the GitHub repository that contains the complete Electronics Sale Dashboard, the underlying data, and additional insights:

🔗 Electronics Sale Dashboard – GitHub Repo (replace with your actual URL)

0 views
#powerbi #data-visualization #dashboard #publishing #web-share #dax #power-query #excel
View source
Share:
Back to Blog

Related posts

Read more »