cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
TylerBurnett
Frequent Visitor

Portals Development Workflow

Hello, 

We are a dev team that has migrated from common dev workflows like react, angular etc to this platform to see if it can tailor to our needs in a pilot project. 

 

At the moment, its getting difficult to continue to develop as a set of three developers since we are constantly overwriting each others styles and templates by simply developing at the same time. As well as the simple fact that developing/ testing in portals is tedious. In many normal development workflows (like react, angular etc.) there Is there a development server that spins up locally from which you can develop code on your own branch without interfering with others work. Is this possible in Power Apps Portals?

 

We've noticed that you have a CLI in preview which we plan to implement soon, but this CLI as a dev pipeline would actually cause more issues as it would hard overwrite all files in the portal. Which would make multiple branch development in source control very difficult, since changes would be constantly overwritten no matter what section of the code you are working on.

6 REPLIES 6
ragavanrajan
Super User
Super User

Hi @TylerBurnett 

I am from the same background and we have switched to the portal. Maybe I can share our experience how we are successfully utilising it so far. 

 

1. We have a team of developers where tasks will be assigned in each sprints. 

2. Normally, if we take a page, the design and its functional tasks will be assigned to one person. So others don't touch their page. 

3. You can plan in the same way, where they have a dedicated page to work for the cycle. 

4. Currently, we are utilizing  "Portal studio helper" by @OOlashyn. The good part about this vscode extension is you will have full freedom of viewing HTML, CSS and JS pages in VSCODE. Once we did our dev then we upload it back to the portal.  I personally like it a lot because of the convenience and background experience from open source. 

5. On the other hand, DevOps pipeline is released recently along with CLI. Arpit has created an article to configure the DevOps pipeline. It will be useful. 

https://arpitpowerguide.com/2021/12/15/powerapps-portals-build-tools-automate-portal-deployment/ 

Hope it helps. 
------------

If you like this post, give it a Thumbs up. Where it solved your request, Mark it as a Solution to enable other users to find it.

 

chleverenz
Super User
Super User

Hi @TylerBurnett ,

 

we also do it like @ragavanrajan mentioned. Nevertheless its sometimes hard to split up the work like that.

 

I have no idea about the costs, but you could provision another dataverse and add a portal. You could then share

the code via git and use for example branching and everybody works on his/hers version and deploys it directly to her own instance.

You just have to provision a portal, upoload the existing portal via the cli tool and use the just uploaded portal.

 

For really heavy developement in react/vue/elm/knockout/.. (you name it 🙂 ) i usually have some mockdata, which i use to build up my stuff and test it locally in the usual environments. Having a draft version i then integrate it into the existing code.

 

Another good experience was to use "inheritance" in portals. You might have noticed, that liquid supports {% extends %} as a keyword. You could design a hosting page and get diffrent content from diffrent templates. If you do so, you could easily split up work for diffrent blocks of the page. Also {% include %} is very helpful in this approach. This splits up your work in smaller pieces.

 

So, hopefully this did not produce too much fog in all heads,

  Christian 

This is also what we're doing (separating work between pages and functionality), unfortunately this would also mean we have create a temp style sheet for each page we develop on to remove issues. It can be considered a method of doing this. But another issue is that we use the source code version of bootstrap from which we compile into CSS from source LESS. 

 

Ideally a way of previewing these pages locally and developing locally is what we would like.

Hi @TylerBurnett 

 

You can use the vscode extension by Oolashyn which I have mentioned in the post. In addition, as @chleverenz mentioned, you can spin up dev environment and develop it locally. 

Hope it helps.

------------

If you like this post, give it a Thumbs up. Where it solved your request, Mark it as a Solution to enable other users to find it.

 

chleverenz
Super User
Super User

@TylerBurnett : for compiling bootstrap and not using theming i would like to give 100 thumbs up 🙂

eugenevanstaden
Helper II
Helper II

@TylerBurnett 

Not much tooling will solve this - only discipline will.


I manage a large team that only develop Portal solutions - it takes time to work out what works within your team. 

On custom script development for example, we never build any javascript in EntityForm, Lists or in Web templates. These are all developed, built, packed and added as webfile as either part of our local development process or during the build in pipeline. Same for CSS.

Liquid templates will be the main issue in terms of having multiple people working on them - again discipline will be the key and who works on what.

Helpful resources

Announcements
Power Platform Conf 2022 768x460.jpg

Join us for Microsoft Power Platform Conference

The first Microsoft-sponsored Power Platform Conference is coming in September. 100+ speakers, 150+ sessions, and what's new and next for Power Platform.

365 EduCon 768x460.png

Microsoft 365 EduCon

Join us for two optional days of workshops and a 3-day conference, you can choose from over 130 sessions in multiple tracks and 25 workshops.

Top Solution Authors
Users online (1,912)