web
You’re offline. This is a read only version of the page.
close
Skip to main content
Community site session details

Community site session details

Session Id : bdmzy+C3ow8guyQ6snmaCR
Power Apps - Power Apps Pro Dev & ISV
Unanswered

Can someone explain to me some common usecases for building a PCF for power apps? and maybe include a tutorial on whats a good starter PCF to build to learn it?

Like (0) ShareShare
ReportReport
Posted on 2 Apr 2024 21:24:53 by 4

from my understanding, you use .net/visual studio typically to write a custom component for power apps, but my question is what these are built for, like what use case, and whats a good basic one to learn / build to understand its usefulness better?

I have the same question (0)
  • Guido Preite Profile Picture
    1,488 Super User 2024 Season 1 on 03 Apr 2024 at 09:03:56
    Re: Can someone explain to me some common usecases for building a PCF for power apps? and maybe include a tutorial on whats a good starter PCF to build to learn it?

    you can check the PCF controls hosted inside PCF Gallery, you can get an idea on how they are used.

  • cchannon Profile Picture
    4,702 Moderator on 03 Apr 2024 at 13:14:43
    Re: Can someone explain to me some common usecases for building a PCF for power apps? and maybe include a tutorial on whats a good starter PCF to build to learn it?

    A PCF is not a .net control.

     

    A PCF is a Single Page App (SPA) typically built using React (more specifically React Typescript) that allows you to inject a custom user interface component into a Power App, whether model driven or canvas.

     

    The idea here is that sometimes you need a custom interface element that can't be met by out of the box components. For example, imagine you need a field for sensitive information that does custom validation and masking, or you wanted to present a grid of records as a Gantt chart, or you want an interactive custom visualization embedded on your form.... the use cases are quite literally endless here.

     

    The best way to get a feel for what they do is to make a very simple one. There are some great tutorials on the MS Learn pages (here's a super-simple one that just puts a custom Slider control on a form for you), and in fact OOB when you just init a new virtual PCF it automatically makes a simple Hello World example for you, so you can instantly deploy and see results within a couple minutes of getting set up.

  • skoofy5 Profile Picture
    482 on 08 Apr 2024 at 00:48:42
    Re: Can someone explain to me some common usecases for building a PCF for power apps? and maybe include a tutorial on whats a good starter PCF to build to learn it?

    PCFs allows you to create custom components for Power Apps, enhancing the user experience and extending functionality with more complexity than canvas apps allow. Here are some common use cases for building PCFs:

    1. Custom UI Controls:

      • Create custom controls that aren’t available out-of-the-box in Power Apps.
      • Examples: dials, sliders, charts, gauges, or custom input fields.
    2. Data Visualization:

      • Build visualizations specific to your business needs.
      • Examples: custom charts, heatmaps, or interactive maps.
    3. Integration with External Services:

      • Connect Power Apps to external APIs or services.
      • Examples: geolocation services, weather data, or currency conversion.
    4. Enhanced User Experience:

      • Improve usability by creating intuitive components.
      • Examples: custom date pickers, autocomplete fields, or rich text editors.
    5. Complex Calculations:

      • Implement calculations or business logic that can’t be achieved using standard controls.
      • Examples: custom pricing calculators, loan amortization tools, or complex form validations.
    6. Data Transformation:

      • Manipulate data before it’s saved to the database.
      • Examples: data formatting, encryption, or data cleansing.
    7. Integration with External Libraries:

      • Leverage third-party libraries or frameworks within your components.
      • Examples: integrating with charting libraries, QR code generators, or machine learning models.

    The link above to create your first component is the simplest way to start. Before you begin your component you need to install the following components:

    • Visual Studio Code (VSCode) (Ensure the “Add to PATH” option is selected during installation).
    • node.js (LTS version is recommended).
    • Microsoft Power Platform CLI (You can use either Power Platform Tools for VSCode or Power Platform CLI for Windows).
    • .NET Build tools (Choose one of the following):
      • Visual Studio 2022 (for Windows & Mac).
      • Build Tools for Visual Studio 2022.
      • Alternatively, you can use the .NET 6.x SDK instead of Build Tools for Visual Studio.

    If you have no background in JavaScript/TypeScript you are likely going to have a difficult time creating your own components.

Under review

Thank you for your reply! To ensure a great experience for everyone, your content is awaiting approval by our Community Managers. Please check back later.

Helpful resources

Quick Links

Responsible AI policies

As AI tools become more common, we’re introducing a Responsible AI Use…

Chiara Carbone – Community Spotlight

We are honored to recognize Chiara Carbone as our Community Spotlight for November…

Leaderboard > Power Apps

#1
WarrenBelz Profile Picture

WarrenBelz 714 Most Valuable Professional

#2
Michael E. Gernaey Profile Picture

Michael E. Gernaey 419 Super User 2025 Season 2

#3
developerAJ Profile Picture

developerAJ 243

Last 30 days Overall leaderboard
Loading complete