In my previous blog post, I have explained about canvas apps and model driven apps. Let us first see how to build a canvas app in PowerApps.
Development for PowerApps can be done either in web PowerApps studio or desktop PowerApps studio. First step is to create the Environment for the development. You can start with the trial version for free.
Login to the Powerapps.microsoft.com
Let us first create the environment to create our app.
To create the environment follow the steps as shown in following screenshots
Click on the setting icon at the right top of the screen and select Admin center.
Then click on the Create New Environment again at the top right corner.
Enter the details about the new environment and create the new environment.
Once you create the environment, you can select that environment to start the app development. Make sure that you have chosen the right environment and then start with the application development.
We can develop apps based on various backends such as CDS, Excel, OneDrive, Sharepoint etc Let us build our first app for some specific requirement in Dynamics 365 CE for the scenario mentioned below:
A product company, has a call center and sends the service mechanics to repair existing machines or install new machines at the customer site. They are always on the move and while doing assigned jobs if they find that there is additional work to be done, they should be able to create the case or opportunity on their mobile quickly.
As a first step, select Apps from the left menu as shown in below screenshot and click on create an app button.
Powerapps studio would provide you options to select the base data on which you want to create an app. Here since we want to create case or Opportunity in Dynamics 365, select Dynamics 365 as show in below snip.
Studio would guide you to step by step to connect the D365 instance
Once you are connected to D365 CE, you have to select the entity on which you would like to do the operations through the PowerApps app.
Let us select case entity and see what PowerApps does it for you.
Just save the app with appropriate name and even you can select icon for the same.
PowerApps would build the complete app for you to view the cases, view the case details and editing particular case or creating a new case as shown below
Let us see all these screens in details one by one
Browser screen : It is a list screen where you can find all the cases, you can search for specific cases, you can sort the order of the cases. All these functionalities are given by PowerApps automatically and you don’t have to do anything to achieve the same.
Now let us see the components of this screen. Major component is BrowserGallery1. This is the gallery control which can be connected to the the database table Case. You can see the property pane at If you look at the properties of the gallery, Data is the most important property of the gallery which connects to the data. With this property you can change the data source if required. 
With the layout property, you can change the way your data is displayed, even select the columns which should be displayed in the gallery.
When you see the items property of the gallery, you can see below text
SortByColumns(Search(Cases, TextSearchBox1.Text, “description”), “description”, If(SortDescending1, Descending, Ascending))
This function actually works for the sorting and searching functionality. I would recommend you to go through the all controls present on the screen and try to understand their properties.
Once you understand these properties, you will be able to play with those based on your requirements. These are very intuitive and can be easily learned
If you click on the “>” next to any item in this gallery , that record would open in edit mode in the new screen. Just check the action defined to achieve this functionality.
Similarly you can see the “+” symbol which would navigate to the new entry page and you can create new case from this screen. Just check the action defined to achieve this functionality.
Now let us see second screen in this App.
In the second screen, you would understand the usage of data card control of the PowerApps. This screen has DetailForm which consists of various data cards.
The form is bound to the data source and the record which is selected in previous screen.
The datacard is created for each field and fields can be selected from the layout.
Based on the type of the field, the type of data card is selected, which can be changed later if required. If you want to do any changes in datacard, you must first unlock it and do the changes.
Each Datacard consists of a Value and Key which represents the actual data value and field name correspondingly I would recommend you to look at the various properties of these data cards and understand how intuitive it is to use.
I am hoping you must have understood of the basics of PowerApps app development with this post.
Thanks for reading. In case you have any questions about the PowerApps, please leave in comments and I would get back to you.
If you like my blog, please hit the like button or share with others
PowerApps Model Driven/Canvas Apps
PowerApps Case Studies : Its much more than just replacement of Infopath
Vrushali's Techno Blog 