Showing posts with label HybridApp. Show all posts
Showing posts with label HybridApp. Show all posts

Thursday, October 8, 2020

Ionic Capacitor CI/CD using new yaml pipeline with multiple stages

The Ionic Capacitor is a new framework to build cross-platform apps. In this article, we will learn how to set up an Azure DevOps pipeline to build and deploy to AppCenter to distribute to test users.

For simplicity, I am going to build only the android project in this article. You can always add more jobs to run in parallel to build the other environments. Also, I am assuming that you have some experience build Azure pipelines and know about defining variables in the pipeline and how to store secrets in Secure Files and Variables. Please let me know in the comments if there anything specific about the pipeline you don't understand,

I started with creating an empty yaml pipeline and here you have different options to choose your repo from. I have my repo on Azure reports Git and will select that and choose my repo from the next screen. 

 

New pipeline

Once you select your repo you will get some recommendations in the Configure 
Configure your pipeline


I picked up the starter pipeline to get the basic pipeline in place, which will checkout the branch based on the trigger branch, which by default will be master.

Once you select the Starter pipeline you will get something like this.


# Starter pipeline
# Start with a minimal pipeline that you can customize to build and deploy your code.
# Add steps that build, run tests, deploy, and more:
# https://aka.ms/yaml

trigger:
master

pool:
  vmImage'ubuntu-latest'

steps:
scriptecho Hello, world!
  displayName'Run a one-line script'

script: |
    echo Add other tasks to build, test, and deploy your project.
    echo See https://aka.ms/yaml
  displayName'Run a multi-line script'

we will start to make changes to the pipeline.

Wednesday, January 2, 2019

3rd day with Xamarin

The second day with Xamarin was spent setting up the permissions and Azure build Pipeline to build the Android and iOS projects.

Today I am planning to do
  • MVVM in the app 
  • Setting up Dependency Injection 
  • Dialog Service

MVVM


MVVM is Model-View-ViewModel and you can read about it on Microsoft website Here. It is an application pattern that allows us to build de-coupled components. I would suggest reading through the article to get a better understanding of  MVVM components before reading ahead.

Monday, December 10, 2018

2nd day with Xamarin

The first day with Xamarin I able to create a new Xamarin app and integrated google maps and able to run it in the simulator.

If you read the previous post. I did make it work on the simulator using the Plugin.Permissions. However, when I ran the application in the simulator it did work but I did not see any messages requesting for access permissions.

So, I am going to try to run the app on the device and see what happens.

The device I am going to use is Moto X running Android version 6.0.1. I am not gonna bore you with how to setup the device as you may not be going to use the same device. Just the basic stuff you need

  • USB drivers for the device
  • A USB cable with data pins. Normal charging cables won't work.
  • Put the device in the debug mode.

Sunday, December 9, 2018

1st day with Xamarin

I started to create an app in Xamarin as I have been reading creating-mobile-apps-xamarin-forms by Microsoft. As a beginner, I can say that it has taught me well.

Today I thought to try and spin up a simple app using Xamarin Forms. Let's start from the start I will be putting up all the issues, bus, Environment Setup steps I had to do while doing it.

Let’s get started.

Few conventions

  • #: Issue faced and resolution

First I would suggest going through my friend Kael's blogs to get you started with the Android SDK setup. Few things which are important for Simulator.

Friday, September 4, 2015

Advanced JavaScript Topics Part 2

We were discussing the let keyword in the Part 1 of this series. We discussed what the advantages and how we can use let keyword in the code. However, let keyword has a problem it does not support hoisting, means if you have declared a variable using let keyword in the mid of the block it would not be available in the part above the declaration of the let keyword.
So you always make sure that let is declared at the top of the block.
As we discussed earlier let keyword kind of Hack the scope implicitly. We can always write the code to make sure when we see we can explicitly identify that this block is a scope. The example given the in the Part 1 of this series used the implicit way. To use the explicit way do it like this

function foo(bar) {
    "use strict"
    let (test = bar) {
        console.log(test) // "bar"  
    }
    console.log(baz) // reference error
}

However, this syntax is rejected by the committee. we can use some other way to make sure we see the block scope in the code as we read the code.

function foo(bar) {
    "use strict"
    /*let */
    {
        let test = bar
        console.log(test) // "bar"  
    }
    console.log(baz) // reference error
}

This is one way to do it. Keyle Simpson have created this great tool to help you with block scoping it is called Let-er .


So, as we started to talk about tools you might want to take a look at traceur-compiler it generates ES 5 code from ES 6 code. As there is development going on in ES 6 you should start writing your code in ES 6 and use a transpiler to convert the ES 6 code to ES 5. You can use grunt-traceur . Other than this you might wanna take a look at the tools for ES 6.


Hoisting


Hoisting is a concept which is developed to understand how JavaScript works when we declare the variables and functions. Take a look at the code below

Thursday, August 27, 2015

Advanced JavaScript Topics Part 1

If you are writing Hybrid Mobile Applications than JavaScript should in your blood. So, I am trying to write something about JavaScript today.


Some Resources

  • https://github.com/rwaldron/idiomatic.js : It is a write up of idiomatic code that is widely accepted across the developer to write consistent JavaScript code. You may not agree with all the code which is there but it is a great place to start. There are couple of quotes written on the git page, which I like it is
         "Arguments over style are pointless. There should be a          style guide, and you should follow it"                
         Rebecca Murphey
  • http://addyosmani.com/resources/essentialjsdesignpatterns/book/ : This is one stop shop for design patterns in JavaScript and if you are going to write a clean code in JavaScript and Follow a Design to solve the problems in JavaScript you should go through this.

  •     http://www.ecma-international.org/ecma-262/6.0/ : JavaScript is EEMA Script if you don’t know. This is the language specification and I am sure many of you have not referred to this. If you are referring to this means you are writing some serious efficient JavaScript Code.

Thursday, August 13, 2015

Introduction to Facebook Parse SDK

Parse was acquired by Facebook in 2013 and they have announced Open Source SDKs. Open Sourced all of SDKs related to iOS, OSX, and Andriod. Code for all the SDKs is available on Github ParsePlatform.

Mobile Developers were using these SDKs for Development but were not aware of what is happening behind the scenes. 

Parse Team has started to write updates about the Parse SDKs on the blog. The very first blog "The Parse SDK : What's inside" tells about how Asynchronous APIs works in Parse.


Parse Asynchronous API



















WKWebView for Hybrid Apps in iOS 8

With the release of iOS 8, Apple has brought so many changes in the Framework existing classes and have introduced new classes.

For Hybrid App development we introduced UIWebView, Which is used for displaying the Web content. 

However, with the release of iOS Apple has introduced a new class called WKWebView. which is derived from UIView here is the inheritance chain for WKWebView.

NSObject
|
UIResponder
|
UIView
|
WKWebView

WKWebView is also derived from UIView similar to UIWebView, So what are the difference in both.


Performance


Wednesday, August 12, 2015

Hybrid App Development Part 1

So, in the previous blog Introduction to hybrid app development we learn about what is hybrid app. Today, we will learn more about hybrid app.
  1. Hybrid App Architecture : Hybrid App Development Part 1
  2. Development tools           : Hybrid App Development Part 2
  3. Debugging techniques      : Hybrid App Development Part 3
  4. Building Hybrid App        : Hybrid App Development Part 4
    1. UI Development     : Part 4.1
    2. Fetching Data and Angular Caching : Part 4.2
  5. Testing the App                : Hybrid App Development Part 5
  6. Deployment of App          : Hybrid App Development Part 6
We will talk about Architecture of Hybrid Mobile Application. We will discuss each of the component in detail. 

So first question that came to my mind when I think of Hybrid App Development is that what is it that enables this?


Answer to this Question is 

Saturday, August 8, 2015

Introduction to Hybrid App Development

History


With the Origin of mobile operating systems like iOS, Andriod, Windows and Others in the market. There are variety of devices in with different form factors and different hardware specifications. With the evolution of the Mobile Operating System, Mobile Devices hardware has evolved a lot. We will not deep into hardware development but yes we will talk more about the Software part.

So, What are the ways we can develop a Mobile Application?
  1. Using xCode with Swift, Objective - C and using their UI Libraries we can build Apps for iOS. you can go to Apple Developer Site to know more about it.
  2. Android Application development using Java. Getting Started with Android.
  3. Windows phone application development using .Net Framework and C#. Windows phone App Development getting started.
As Listed above if you need to build an App for multiple devices you would think I would need to learn all these technologies and believe me I have not listed all the Technologies which are used, I have just mentioned the programming languages.

So now you can understand what could be the problem with this. Anyway, I will mention it explicitly, Now I want to develop an App for all 3 Operating Systems. I have to develop it in 3 different plateforms to support 3 different mobile operating systems. Which I think would be huge effort for Developers and Enterprise Softwares. This problem leads to the evolution of Hybrid Mobile Application development with mainly involve development with PhoneGap (Currently known as Cordova).