04 CREATING PROJECTS TO START DEVELOPMENT (for XAMARIN apps) - chempkovsky/CS2WPF-and-CS2XAMARIN GitHub Wiki

Any application has two main parts:

• Client side
• Server side

This presentation explains how to create projects for the client and server sides.

• Let's start by organizing folders:

  • Suppose, the root folder name for all projects will be

    C:\Development\XamarinDemo

Creating C# projects for the Client side.

Creating Blank Solution.

• Run Visual Studio
• Click File/New/Project menu item
• In the dialog select “Blank Solution” and click “next”
• Enter “XamarinDemo” for the Solution name
• Select “C:\Development\” for the location
• Click “Create”

Creating "ServerProjects" Solution folder.

• Run Visual Studio
• Open “XamarinDemo” solution
• In the Solution Explorer right-click the solution node and select “Add/New Solution Folder”-menu item
• name the folder as "ServerProjects"

Creating "ClientProjects" Solution folder.

• Run Visual Studio
• Open “XamarinDemo” solution
• In the Solution Explorer right-click the solution node and select “Add/New Solution Folder”-menu item
• name the folder as "ClientProjects"

Creating "ClientProjects/Shared" Solution folder.

• Run Visual Studio
• Open “XamarinDemo” solution
• In the Solution Explorer right-click "ClientProjects"-folder of the solution node and select “Add New Project”-menu item
• name the folder as "Shared"

Creating "ClientProjects/Models" Solution folder.

• Run Visual Studio
• Open “XamarinDemo” solution
• In the Solution Explorer right-click "ClientProjects"-folder of the solution node and select “Add New Project”-menu item
• name the folder as "Models"

Preliminary result.

Creating C# project for Common Interfaces (Client side).

• Run Visual Studio
• Open “XamarinDemo” solution
• In the Solution Explorer right-click "ClientProjects/Shared"-folder of the solution node and select “Add New Project”-menu item
• In the dialog select “Class library (.Net Standard or .Net Core)” and click “next”
• Enter “CommonInterfacesClassLibrary” for the Project name
• Click “Next”
• Select ".Net Standard 2.0"
• Click “Create”

Creating C# project for Common Xamarin Custom Controls (Client side).

• Run Visual Studio
• Open “XamarinDemo” solution
• In the Solution Explorer right-click "ClientProjects/Shared"-folder of the solution node and select “Add New Project”-menu item
• In the dialog select “Class library (.Net Standard or .Net Core)” and click “next”
• Enter “CommonCustomControlLibrary” for the Project name
• Click “Next”
• Select ".Net Standard 2.0"
• Click “Create”

Creating C# project for Common Xamarin User Controls (Client side).

• Run Visual Studio
• Open “XamarinDemo” solution
• In the Solution Explorer right-click "ClientProjects/Shared"-folder of the solution node and select “Add New Project”-menu item
• In the dialog select “Class library (.Net Standard or .Net Core)” and click “next”
• Enter “CommonUserControlLibrary” for the Project name
• Click “Next”
• Select ".Net Standard 2.0"
• Click “Create”

Creating C# project for Common Services Prism Module (Client side).

• Run Visual Studio
• Open “XamarinDemo” solution
• In the Solution Explorer right-click "ClientProjects/Shared"-folder of the solution node and select “Add New Project”-menu item
• In the dialog select “Prism module (Xamarin)” and click “next”
• Enter “CommonServicesPrismModule” for the Project name
• Click “Create”

Creating C# project for Model Interfaces (Client side).

• Run Visual Studio
• Open “XamarinDemo” solution
• In the Solution Explorer right-click "ClientProjects/Shared"-folder of the solution node and select “Add New Project”-menu item
• In the dialog select “Class library (.Net Standard or .Net Core)” and click “next”
• Enter “ModelInterfacesClassLibrary” for the Project name
• Click “Next”
• Select ".Net Standard 2.0"
• Click “Create”

Creating C# project for Model Services Prism Module (Client side).

• Run Visual Studio
• Open “XamarinDemo” solution
• In the Solution Explorer right-click "ClientProjects/Models"-folder of the solution node and select “Add New Project”-menu item
• In the dialog select “Prism module (Xamarin)” and click “next”
• Enter “ModelServicesPrismModule” for the Project name
• Click “Create”

Creating C# project for Feature Services Prism Module (Client side).

• Run Visual Studio
• Open “XamarinDemo” solution
• In the Solution Explorer right-click "ClientProjects/Models"-folder of the solution node and select “Add New Project”-menu item
• In the dialog select “Prism module (Xamarin)” and click “next”
• Enter “FeatureServicesPrismModule” for the Project name
• Click “Create”

Creating C# project for Prism Demo App (Client side).

• Run Visual Studio
• Open “XamarinDemo” solution
• In the Solution Explorer right-click "ClientProjects"-folder of the solution node and select “Add New Project”-menu item
• In the dialog select “Prism blank app (Xamarin Forms)” and click “next”
• Enter “PrismDemoApp” for the Project name
• Click “Create”
• "Prism Project Wizard"-dialog will be shown
• Select Platforms
• Select "Dryloc" and click "Create project"-button

Preliminary result.

PREPARATION STEPS AFTER CREATING PROJECTS (Client side).

• Step #1:

  • Run Visual Studio 2019
  • Open the “XamarinDemo” solution, which is located in the folder:
    • C:\Development\XamarinDemo
  • Remove "Class1.cs" from each project:
  • CommonInterfacesClassLibrary
  • CommonUserControlLibrary
  • ModelInterfacesClassLibrary
  • CommonCustomControlLibrary

• Step #2:

  • Run Visual Studio 2019
  • Open the “XamarinDemo” solution, which is located in the folder:
    • C:\Development\XamarinDemo
  • Remove "ViewModels" and "Views" folders from each project:
  • FeatureServicesPrismModule
    • In addition, modify "FeatureServicesPrismModuleModule.cs"-file of the FeatureServicesPrismModule-project. Remove invalid "using"-operators and registrations.
  • ModelServicesPrismModule
    • In addition, modify "ModelServicesPrismModuleModule.cs"-file of the ModelServicesPrismModule-project. Remove invalid "using"-operators and registrations.
  • CommonServicesPrismModule
    • In addition, modify "CommonServicesPrismModuleModule.cs"-file of the CommonServicesPrismModule-project. Remove invalid "using"-operators and registrations.

• Step #3:

  • Run Visual Studio 2019
  • Open the “XamarinDemo” solution, which is located in the folder:
    • C:\Development\XamarinDemo
  • Right Click Solution Node and select "Manage NuGet Packages"
  • Check "Select All Packages"
  • Click "Update"

• Step #4:

  • Run Visual Studio 2019
  • Open the “XamarinDemo” solution, which is located in the folder:
  • right click "CommonInterfacesClassLibrary"-project and select "Manage Nuget package"
  • install "Xamarin.Forms"
  • install "Newtonsoft.Json"
  • The result should be as follows:

• Step #5:

  • Run Visual Studio 2019
  • Open the “XamarinDemo” solution, which is located in the folder:
  • right click "CommonCustomControlLibrary"-project and select "Manage Nuget package"
  • install "dotMorten.Xamarin.Forms.AutoSuggestBox"
  • install "Xamarin.Essentials.Interfaces"
  • install "Xamarin.Forms"
  • add reference onto "CommonInterfacesClassLibrary"
  • The result should be as follows:

• Step #6:

  • Open the “XamarinDemo” solution
  • right click "CommonUserControlLibrary"-project and select "Manage Nuget package"
  • install "Xamarin.Forms"
  • install "Prism.Forms"
  • install "Prism.Forms.Regions"
  • add reference onto "CommonCustomControlLibrary"
  • The result should be as follows:

• Step #7:

  • Open the “XamarinDemo” solution
  • right click "ModelInterfacesClassLibrary"-project and select "Manage Nuget package"
  • install "Newtonsoft.Json"
  • install "System.ComponentModel.Annotations"
  • The result should be as follows:

• Step #8:

  • Open the “XamarinDemo” solution
  • right click "CommonServicesPrismModule"-project and select "Manage Nuget package"
  • install "Xamarin.Forms" (already installed)
  • install "Prism.Forms" (already installed)
  • install "Prism.Forms.Regions"
  • add reference onto "CommonUserControlLibrary"
  • The result should be as follows:

• Step #9:

  • Open the “XamarinDemo” solution
  • right click "ModelServicesPrismModule"-project and select "Manage Nuget package"
  • install "Xamarin.Forms" (already installed)
  • install "Prism.Forms" (already installed)
  • install "Prism.Forms.Regions"
  • add reference onto "CommonInterfacesClassLibrary"
  • add reference onto "ModelInterfacesClassLibrary"
  • add reference onto "CommonUserControlLibrary"
  • The result should be as follows:

• Step #10:

  • Open the “XamarinDemo” solution
  • right click "FeatureServicesPrismModule"-project and select "Manage Nuget package"
  • install "Xamarin.Forms" (already installed)
  • install "Prism.Forms" (already installed)
  • install "Prism.Forms.Regions"
  • add reference onto "CommonInterfacesClassLibrary"
  • add reference onto "ModelInterfacesClassLibrary"
  • add reference onto "CommonUserControlLibrary"
  • The result should be as follows:

• Step #11:

  • Open the “XamarinDemo” solution
  • right click "PrismDemoApp"-project and select "Manage Nuget package"
  • install "Xamarin.Forms" (already installed)
  • install "Prism.DryIoc.Forms" (already installed)
  • install "Prism.Forms" (already installed)
  • install "Prism.Forms.Regions"
  • add reference onto "CommonUserControlLibrary"
  • add reference onto "CommonServicesPrismModule"
  • add reference onto "ModelServicesPrismModule"
  • add reference onto "FeatureServicesPrismModule"
  • The result should be as follows:

• Step #13:

  • Open the “XamarinDemo” solution
  • Open "CommonCustomControlLibrary"-project
  • Add Folder: "Resources"
  • Add Folder: "Fonts" into "Resources"-folder
  • Download "MaterialIcons-Regular.ttf" and copy this file into "Fonts"-folder
  • Change "build action" to "Embedded resource"
  • The result should be as follows:

• Step #14:

  • Open the “XamarinDemo” solution
  • right click "PrismDemoApp.Android"-project and select "Manage Nuget package"
  • add reference onto "CommonCustomControlLibrary"

• Step #15:

  • Open the “XamarinDemo” solution
  • right click "PrismDemoApp.iOS"-project and select "Manage Nuget package"
  • add reference onto "CommonCustomControlLibrary"

• Step #16:

  • Open the “XamarinDemo” solution
  • right click "PrismDemoApp.UWP"-project and select "Manage Nuget package"
  • add reference onto "CommonCustomControlLibrary"

Creating C# projects for the Server side.

• CS2WPF is solution level tool. So, let's create four projects, one for each type of object (Only for cross-project demonstration):
  • Dm01Entity for Entities Framework Entity classes
  • Dm02Context for Entities Framework DB Context Classes
  • Dm03Views for Views (or ViewModels)
  • Dm04WebApp for Web-Api services

Creating Blank Solution (if you start from the server side).

• Run Visual Studio
• Click File/New/Project menu item
• In the dialog select “Blank Solution” and click “next”
• Enter “XamarinDemo” for the Solution name
• Select “C:\Development\” for the location
• Click “Create”

Creating "ServerProjects" Solution folder.

• Run Visual Studio
• Open “XamarinDemo” solution
• In the Solution Explorer right-click the solution node and select “Add/New Solution Folder”-menu item
• name the folder as "ServerProjects"

Creating "ClientProjects" Solution folder.

• Run Visual Studio
• Open “XamarinDemo” solution
• In the Solution Explorer right-click the solution node and select “Add/New Solution Folder”-menu item
• name the folder as "ClientProjects"

Creating C# project for Entity classes (Server side).

• Dm01Entity for Entities Framework Entity classes:
  • Run Visual Studio
  • Open “XamarinDemo” solution
  • In the Solution Explorer right-click "ServerProjects"-folder of the solution node and select “Add New Project”-menu item
  • In the dialog select “Class library (.Net Framework)” and click “next”
  • Enter “Dm01Entity” for the Project name
  • Click “Create”

Creating C# project for Entity Framework Dbcontext classes (Server side).

• Dm02Context for Entity Framework dbcontext classes:
  • Run Visual Studio
  • Open “XamarinDemo” solution
  • In the Solution Explorer right-click "ServerProjects"-folder of the solution node and select “Add New Project”-menu item
  • In the dialog select “Class library (.Net Framework)” and click “next”
  • Enter “Dm02Context” for the Project name
  • Click “Create”

Creating C# project for Views(or ViewModels) classes (Server side).

• Dm03Views for for Views (or ViewModels) :
  • Run Visual Studio
  • Open “XamarinDemo” solution
  • In the Solution Explorer right-click "ServerProjects"-folder of the solution node and select “Add New Project”-menu item
  • In the dialog select “Class library (.Net Framework)” and click “next”
  • In the dialog select “Class library (.Net Framework)” and click “next”
  • Enter “Dm03Views” for the Project name
  • Click “Create”

Creating C# projects for Web-Api services (Server side).

• Dm04WebApp for Web-Api services:
  • Run Visual Studio
  • Open “XamarinDemo” solution
  • In the Solution Explorer right-click "ServerProjects"-folder of the solution node and select “Add New Project”-menu item
  • In the dialog select “Asp.Net Web Application (.Net Framework)” and click “next”
  • Enter “Dm04WebApp” for the Project name
  • Click “Create”
  • On the “Create a New Asp.Net Web Application”-dialog
  • Select Web Api
  • Under “Authentication” click change and select
  • Individual user account
  • Click “Create”

PREPARATION STEPS AFTER CREATING PROJECTS

• Step #1:

  • Run Visual Studio 2019
  • Open the “XamarinDemo” solution, which is located in the folder:
    • C:\Development\XamarinDemo
  • Remove "Class1.cs" from each project:
  • Dm01Entity
  • Dm02Context
  • Dm03Views

• Step #3:

  • Run Visual Studio 2019
  • Open the “XamarinDemo” solution, which is located in the folder:
    • C:\Development\XamarinDemo
  • Add “Literature” folder to each project:
    • Dm01Entity
    • Dm02Context
    • Dm03Views

• Step #4:

  • Open the “XamarinDemo” solution
  • Add reference to
    • System.ComponentModel.DataAnnotations
  • to each project:
    • Dm01Entity
    • Dm02Context
    • Dm03Views

• Step #5:

  • Open the “XamarinDemo” solution
  • For Dm02Context project add the following NuGet package:
    • EntityFramework
  • For Dm03Views project add the following NuGet package:
    • Newtonsoft.Json
  • For Dm04WebApp project add the following NuGet package:
    • Microsoft.AspNet.WebApi.Cors

• Step #6:

  • Open the “XamarinDemo” solution
  • In Dm04WebApp project open file:
    • App_Start\WebApiConfig.cs
    • Add “using”:
      • using System.Web.Http.Cors;
    • In the body of the “Register” method add:
      • config.EnableCors(new EnableCorsAttribute("*", headers:"*", methods:"*"));
  • In Dm04WebApp project open file:
    • Providers\ApplicationOAuthProvider.cs
    • In the body of the “GrantResourceOwnerCredentials” method add:
      • context.OwinContext.Response.Headers.Add("Access-Control-Allow-Origin", new[] { "*" });

• Step #7:

  • It is highly recommended to install in your network or virtual environment the following software:
    • MSSQL 2019 Developer Edition (Free Server)
    • SQL Server Management Studio 18.5 (Free Studio)