Posts

Angular 4 + Cordova Boilerplate ::: Hybrid Mobile Application

Angular 4 + Cordova Hybrid Mobile App set up : ng-four-hybid-app : Angular 4 + Cordova boilerplate This project is using Angular 4 + Cordova boilerplate configurated. You can start building your great Hybrid Cordova Mobile Apps in Angular 4. Installation Install Node.js from:  https://nodejs.org/en/download/ Install Cordova using:  npm install -g cordova Clone ngCordova repository:  https://github.com/mithabavkar/ng-four-hybid-app.git Go to ngCordova repository:  cd project_name Install dependencies:  npm install Development server Development project folder is  src/ . You should start building your Angular 4 app there! Run  ng serve  for a dev server. Navigate to  http://localhost:4200/ . The app will automatically reload if you change any of the source files. Build Angular project Run  ng build  to build the Angular project. The build artifacts will be stored in the  www/  directory. Use the  -prod  flag for a production build. Adding Cordova platform

set up phonegap / cordova environment in windows

Image
CORDOVA APPLICATION Cordova wraps your HTML/JavaScript app into a native container which can access the device functions of several platforms. These functions are exposed via a unified JavaScript API, allowing you to easily write one set of code to target nearly every phone or tablet on the market today and publish to their app stores. CORDOVA INSTALLATION SETUP: There below steps to fast set up on your windows environment. 1. Install node js from below link.  https://nodejs.org/en/download/ after installation check node js is functioning or not using command prompt. 2. Install cordova using below command. 3. Create project using command prompt: Above path - C:\Users\Bhushan created project folder 4.  To check your current set of platforms:       cordova platform ls 5. Install pre-requisites for buildin

Dropdown not working in some android device

Build application using angular + ionic in some android device (i.e android version 4.2.2 or below) Below ionic html code not functioning properly on some android device: class= "list" > class= "item item-input item-select" > class= "input-label" > Lightsaber Blue selected > Green Red To overcome this issue below steps follow: Step1: Create JSON                    var fruitArrayJson = '[{"text":"Mango","value":"Mango"},{"text":"Apple","value":"Apple"}]'; Steps2: Respected Controller on page load call this JSON data              $scope.collectObj = {};              $scope.fruitJson = JSON.parse(fruitArreyJson); Steps3: This scope data bind with DOM.                                     * ng-init : when page loaded default drop down shown first data as selected.            * ng-optio

For more information about Angular js

Image
Useful information about angular js while mobile app development :

Best data persistence for Angularjs/Javascript Apps on PhoneGap

Angular remains flexible on data persistence solutions, it makes sense since it is a web framework not specifically a Hybrid app framework...  Here's an overview: Requirements Add local database to app build for preloaded data. This will be over the 5MB data limit. Load data from local database on startup. Saving updated data to local data store for persistence. Prefer schema-less if possible. Simple query interface. I could load all the data into memory and just use standard Angular filters for this, provided the performance was decent. Object query interface... something like an ActiveRecord-like ORM rather than having to write SQL in app. Options Options are following : Breezejs - Looks more focused on server.  Breeze is a JavaScript library that helps you manage data in rich client applications. If you store data in a database, query and save those data as complex object graphs, and share these graphs across multiple screens of your JavaScript client, Bre

Planning and Designing Home Screen of Android Applications. UX Designer

Image
What is the first thing anyone does grabbing their smartphone or tablet? Unlock screen, tap on some application and Voila! You find the application home screen. But do you really see it? Or is it fully cluttered with options that you mostly never use? The normal time to carry out a task on phone gets increased by few seconds or minutes as you are lost, not sure where to start and what to do. What you do next, keep an app for few more days until you find alternative (not in hurry), uninstall it right away and start looking for other alternative (urgency) or give it one more chance in hope that your goal will be achieved.  According to  report  published by Techcrunch 79% people report that they would try once or twice if failed to work first time on mobile app. Well it’s good news and bad as well, good because there are users who can give second or third chance to your app but no more.  Users have very low tolerance for cluttered, buggy applications, those which do not deliver any req

Responsive Web Design Testing Tool

Responsive Web Design Testing Tool in various devices. Check out this link.  http://responsive.pixeltuner.de/?s=http://www.caramelbudgie.com/#mobile480 Happy Coding.. :)