Power App template with reusable header, footer & left navigation

Summary

This tablet-based canvas app helps to kickstart the development in Power Apps using reusable header, footer and left navigation components.

Applies to

Compatibility

Contributors

• Vipul Jain

Version history

Version	Date	Comments
1.0	Feburary 23, 2025	Initial release

Prerequisites

• This app uses Office365.Users connection (data source).
• This app uses SharePoint as a data source and requires a SharePoint List with the following fields:
  • List Name: NavigationItems
  • List Fields:
    1. Title (Single line of text)
    2. Screen (Single line of text) => E.g. - Dashboard, Create
    3. OrderID (Number)

Minimal path to awesome

Using the solution zip

• Download the .zip from the solution folder
• Within Power Apps Studio, import the solution .zip file using Solutions > Import Solution and select the .zip file you just packed.

Using the source code

You can also use the Power Apps CLI to pack the source code by following these steps:

• Clone the repository to a local drive

• Pack the source files back into a solution .zip file:

  pac solution pack --zipfile pathtodestinationfile --folder pathtosourcefolder --processCanvasApps
  

  Making sure to replace pathtosourcefolder to point to the path to this sample's sourcecode folder, and pathtodestinationfile to point to the path of this solution's .zip file (located under the solution folder)

• Within Power Apps Studio, import the solution .zip file using Solutions > Import Solution and select the .zip file you just packed.

Features

This sample illustrates the following concepts:

• Creating reusable components in Power Apps
• Creating a base/template app which helps in faster development

Help

We do not support samples, but this community is always willing to help, and we want to improve these samples. We use GitHub to track issues, which makes it easy for community members to volunteer their time and help resolve issues.

If you encounter any issues while using this sample, you can create a new issue.

For questions regarding this sample, create a new question.

Finally, if you have an idea for improvement, make a suggestion.

Disclaimer

THIS CODE IS PROVIDED AS IS WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING ANY IMPLIED WARRANTIES OF FITNESS FOR A PARTICULAR PURPOSE, MERCHANTABILITY, OR NON-INFRINGEMENT.