DEV Community

Cover image for From Desktop to Web: A Step-by-Step Guide to Publishing and Embedding Power BI Reports
clintonmarwoka
clintonmarwoka

Posted on

From Desktop to Web: A Step-by-Step Guide to Publishing and Embedding Power BI Reports

Introduction: From Desktop to the World
In the modern data ecosystem, a report that sits on a local machine is a missed opportunity. Power BI Desktop is the engine where we perform data cleaning (Power Query), complex calculations (DAX), and modeling (Star Schema). However, the Power BI Service (SaaS) is the stage where that data becomes actionable.

Publishing and embedding reports allows organizations to democratize data, providing stakeholders with real-time insights accessible via any web browser. In this guide, we will walk through the end-to-end process of moving your "Electronics Sales" analysis from a .pbix file to a live, interactive web environment.

Phase 1: Preparing the Cloud Environment (Workspaces)
Before you can publish, you need a destination. In Power BI, this destination is called a Workspace. Think of a workspace as a collaborative container for your datasets, reports, and dashboards.

Step 1: Accessing Power BI Service

  1. Navigate to app.powerbi.com.
  2. Log in using the provided credentials:

Email: cohortseven@luxdevhq.com

Password: cohort7@123

Step 2: Creating Your Personal Workspace

  1. On the left-hand navigation pane, click on Workspaces.
  2. Click the + New workspace button.
  3. Name: Per the assignment instructions, use your Full Name (e.g., John Doe - Electronics Sales).
  4. Description: Add a brief note (e.g., "Workspace for LuxDev Data Science Assignment").
  5. Click Apply.

Phase 2: Publishing the Report from Power BI Desktop
Now that your cloud "folder" is ready, you must upload your local work.

Step 1: The Publish Command

  1. Open your Electronics Sales.pbix file in Power BI Desktop.
  2. Ensure you are signed in (top right corner) with the same credentials used for the web service. 3.On the Home tab of the ribbon, click the Publish button.

Step 2: Selecting the Destination

  1. A dialog box will appear listing all available workspaces.
  2. Select the workspace you created with your Full Name.
  3. Click Select.
  4. Wait for the "Success!" message and click "Open [File Name] in Power BI."

Phase 3: Generating the Embed Code (iFrames)
To put a report on a website, we use an iFrame. An iFrame (Inline Frame) is an HTML element that allows you to "window" another website inside your own.

Step 1: Navigating to the Report

  1. In the Power BI Service, open the workspace you just published to.
  2. Click on the Report (indicated by the blue icon).

Step 2: Creating the Public Web Link

  1. In the top menu bar of the report, go to File.
  2. Select Embed report.
  3. Choose Publish to web (public).

Note: In a corporate environment, you would usually choose "Website or portal" for security, but for public portfolios, "Publish to web" is the standard.
4.Click Create embed code and then Publish.

Step 3: Copying the HTML Code
A dialog box will appear providing two options:

Link you can send in email: A direct URL.

HTML you can paste into a website: This is your iFrame code. Copy this code.

Phase 4: Embedding the Report on a Website
Whether you are using a custom HTML site, WordPress, or a portfolio builder, the process is the same.

  1. Open the HTML editor of your website.
  2. Paste the iFrame code you copied from Power BI.
  3. Customization: You can manually adjust the width and height properties within the code to fit your website's layout.

Phase 5: Version Control with GitHub
As part of professional data engineering, your source files (.pbix) should be version-controlled.

  1. Go to GitHub and create a new repository named Power-BI-Electronics-Sales.
  2. Upload your .pbix file to this repository.
  3. Commit the changes and copy the repository URL.

Key Insights and Best Practices
Security Awareness: Never use "Publish to Web" for sensitive or private data. Once published, anyone with the link can access the data, and it may be indexed by search engines.

Workspace Organization: Always use clear naming conventions for workspaces to differentiate between Development, Testing, and Production environments.

Data Refresh: Once a report is published, you can schedule "Data Refreshes" in the workspace settings so that your embedded report updates automatically when the source data changes.

Mobile Optimization: Power BI allows you to create a "Mobile Layout." If your website is viewed on phones, ensure you have configured this view in Power BI Desktop before publishing.

Conclusion
Publishing to the web is the final "mile" of the data journey. By moving from a static file to an embedded iFrame, you transform your analysis into a living tool that can be shared with the world.

Top comments (0)