Before anyone can start developing PCF components, they have to prepare their local machine and get it ready. This usually means that a whole bunch of tools and frameworks have to be installed. As per Microsoft documentation you need these pre-requisites:

1. Node JS
2. .NET 4.6.2 Developer Pack
3. Power Apps CLI
4. Visual Studio Build Tools (for Solution packaging)

What if you could start with just VSCode without wasting time on any of this, with a bit of templating thrown in? It is possible, with one secret ingredient: Docker.

When I started this exploration around April, I tried using Linux containers. The reason being both VS Dev Containers and GitHub Codespaces only support Linux containers. But, I faced an issue straight-away during npm build.

I tried to edit the files in node_modules and make it work but I encountered more issues, due to the fact that PCF CLI specifically targets Windows only. So, I gave up on that idea and until about a couple of weeks back.

I thought, why not use Windows containers in Docker, rather than Linux containers. The first image of my choice was nanoserver, because of the image size. But, nanoserver images does not seem to play nicely when I wanted to install VS Build Tools and chocolatey in the image, so I ended up moving to Windows Server Core.

Below are the relevant links you can look into for the Docker file and the image:

1. Repo – https://github.com/rajyraman/pcf-docker
2. Image – https://github.com/users/rajyraman/packages/container/package/pcf

Now lets us see how you can use this image to start your PCF Development.

Step 1: Install Docker Desktop from https://www.docker.com/get-started

Step 2: Once Docker is up and running, right click on the icon and choose “Switch to Windows Containers”. The screenshot below is displaying Linux Containers because I am already using Windows Containers

Step 3: Choose the folder where you want your sourcecode, and create two items: a folder called src and a file called pcf.env

Step 4: Add the details about your PCF Component on the pcf.env file. These correspond to the commandline args in PCF CLI. Below is a sample

namespace=RYR
name=TestComponent
template=field
publishername=natraj
publisherprefix=ryr

Step 5: Install Docker extension for VSCode, if you want to use the GUI, rather than commands for working with containers.

Step 5: Run the command below in VSCode’s PowerShell Terminal window to create the container from the image in GitHub Container Registry. I have specified the name of the container as “TestComponent” in the example below, but pick a different name based on the component name for the container.

docker run -it -v $pwd\src:c:\src –name TestComponent -p 8181:8181 –env-file pcf.env ghcr.io/rajyraman/pcf

Once you run this command, Docker will automatically pull the image from the registry and start building the local container.

It will also start running the PCF CLI commands inside the container.

Now if you check your local machine, you would see all the files generated by PCF CLI.

You can also see the container up and running.

You can also build the repo inside the container. Confirm that you are in the container’s terminal and not on your local machine’s terminal.

You can also build the solution using MSBuild inside the container.

Since the container’s port 8181 is mapped to the local machine’s port 8081, you can also run npm start and open the test harness on your local machine.

If you want to exit out of the container’s prompt into your host machine’s prompt just run “exit” command.

To see the list of all the containers, including this ones that are not running run the command below, or use the Docker extension.

docker ps -a

If the container is not running, run the command below to start the container and open the terminal. In the example below, the name of my container is “TestComponent”.

docker start -ai (docker ps –filter “name=TestComponent” -aq)

Now, you can just focus on writing your PCF Component without installing all the required pre-requisites on your local machine.