Showing posts with label android sdk. Show all posts
Showing posts with label android sdk. Show all posts

Friday, 5 September 2014

Ionic & Yeoman

Ionic HTML5 Mobile App Framework 
# create new folder for app and open it
mkdir my-ionic-project && cd $_
# clear npm cache. more info @ NPM config 
rm -rf ~/.npm 
npm clear cache
# install generator-ionic globally
npm install -g generator-ionic
# installs:
  • Lo-Dash.js (Utility Library. Superset of Underscore.js)
  • Chalk (Package for Terminal string styling)
  • MOUT { Modular JS Utility Collection. Use whole package or individual Modules (Helper Methods) }, includes Dependencies:
    • Commander.js (Node.js Full Command-Line Interface Utility)
    • Handlebars (Semantic templates)
    • Istanbul (JS code coverage)
    • Jasmine-Node (Node.js integration of Jasmine Spec Framework)
    • JSHint (JS error detection)
    • MDOC (Markdown based documentation generator)
    • Nodefy { convert AMD JS modules (RequireJS define(..) into Node.js format (module.exports...) }
    • Regenerate (JS RegEx generator
    • RequireJS { Node.js Adapter for RequireJS (loading AMD Modules) incl. Optimiser (Minifies Scripts, CSS Inlined w/out Comments) }
    • RimRaf { Node.js deep Deletion Module (rm -rf) }
    • Rocambole { Recursive walk and manipulate EcmaScript Abstract Syntax Tree (AST) to Compile code (i.e. Rocambole Visualiser) }
  • Yeoman-Generator { Rails-inspired Generator System to Scaffold apps }, adds Additional Dependencies:
    • Dargs { Spawn CLTs by Converting Options Object into Command-Line (CL) Args }
    • Diff { Text Differences for JS (Sample) } 
    • Debug { Node.js Debugging Utility }
    • Mime { Mime-type Mapping API includes Node.js and Apache Project extensions }
    • Text-table { Text Tables borderless and aligned to print to STDOUT }
    • Async (Node.js Utility Module with Functions for Asynchronous JS)
    • Mkdirp (Node.js Recursively create Nested Directories)
    • Isbinaryfile (Node.js check if file is binary)
    • Shelljs (Node.js portable Unix Shell commands)
    • Underscore.string (Underscore.js String manipulation for JS) 
    • Iconv-lite (Convert character encoding/decoding in JS)
    • Glob (Pattern Matching search walking either Sync/Async)
    • Findup-sync (Pattern Matching first File found in current or nearest Ancestor Directory)
    • File-utils { User CLT Sync File and Directory Utils (do not use on Node.js server as is equivalent to Grunt.file) } 
    • Cheerio (Lean Server implementation of core jQuery)
    • Request {Node.js HTTP and HTTPS Request Client (Forwarding, File Streaming, Piping, Proxies, Unix Sockets, Form Data URL Encoding, HTTP Auth, OAuth Signing, Custom HTTP Headers) }
    • Inquirer { Node.js Collection of Common Interactive CLIs (lightweight form of Commander.js }
  • Cordova { Platform to build Native Mobile apps using HTML, CSS, JS }, adds Additional Dependencies:
    • Q { Tool for creating Promises in JS. then method resolves handling eventual return value (fulfillment) or thrown exception (rejection) asynchronously and mitigates the Pyramid of Doom } UncommonJS Promises Manager
    • Semver (NPMs semantic parser of package versions in package.json file)
    • Underscore (Helper Library for JS is Underscore.js)
    • Plist-with-patches (Node.js parsing of Property List files (.Plist) or string into native JS object with Pull requests applied)
    • Optimist (lightweight Option Parsing with Argv Hash)
    • Npmconf (NPM configuration. Alternative RC)
    • Xcode (Node.js parser of xcodeproj/project.pbxproj files)
    • Tar (compression)
    • Elementtree { Module for XML serialization (creation) and parsing }
    • Plugman (Install/Uninstall Cordova plugins)
yo ionic
# installs:


# ionic starter blank creates:
  • Gruntfile.js
  • .gitignore
  • hooks/after_prepare/icons_and_splashscreens.js (Scripts executed before and after directory-related commands) Example Hooks
  • test/spec/controllers.js
# bower_components folder (similar to the /vendor folder in Rails) updated with: 
  • Collide (JS animation engine built by Ionic Framework team allowing developers to hook into every frame)
  • Angular-ui-router (AngularJS flexible routing with nested views to organise parts of interface into a state machine)
  • Angular-mocks (testing)
  • Angular-sanitize (Parse HTML using tokens to avoid unsafe input with ngSanitize)
  • Angular-animate (Animation hooks for common Directives using ngAnimate)
  • Angular-scenario
    • TODO: 
    • TODO - Test Driven Development (TDD)
      • Karma { Cross-browser HTML Test Server & Runner } uses Plugins / Adapters
        • Jasmine { AngularJS Testing Framework
        • Protractor { AngularJS Testing Framework End-to-end using Jasmine as Test Interface and Selenium Server to control browsers}
        • Mocha { JS Testing Framework. Integrates with GitHub }
          • Chai { Assertion Library }
        • PhantomJS { Testing code on Headless Instance }
        • Istanbul { Automatic Coverage Report Generation }
        • RequireJS { Modular Script and Source File Loader. Optimises and Minifies JS for Deployment }
        • QUnit { EmberJS Testing Framework }
      • Continuous Integration & Deployment Pipeline
        • Adobe PhoneGap Build { Free for Open Source. JS. GitHub Integration. }
        • Codeship  { Free for Open Source. Multiple Languages / Endpoints / Tools / Databases. GitHub Integration. }
        • Jenkins CI { AngularJS Automated Tests. GitHub Integration }
        • Travis CI { Automated Tests. GitHub Integration. Integrated using a YAML file. Results in Pull Requests }
        • Semaphore CI { GitHub Integration. Platform includes NodeJS, PhantomJS, and Headless Firefox }
        • CircleCI $19/mth+ { Multiple Languages. GitHub Integration. Fast }
      • Beta Testing
      • Sass
      • Encryption
        • Database Encryption
      • UI Libraries & Tools
      • Scaffolding Tool (modular code shell generator similar to the role of Rails)
        • Yo (Yeoman)
          • Package.json { informs Node.js of specific packages and version the specific project needs installed (instead of all installed globally) }
          • Bower.json { informs Bower of JS and CSS components to install in /app/bower_components }
          • Gruntfile.js { set of task instructions on specific project for Grunt } 
          • Angular Generator of Boilerplate  
            • Generates Modules { controllers, directives, filters, routes (controller + view), services (providers, factories, values, constants), decorators (with config and delegate), views }
            • Modules (resources)
            • Bootstrap
      • Build & Utility Tools (modular Configuration & Tasks)
        • Grunt { i.e. optimisation tasks including JS and CSS concatenation and/or minification (__.main.css, __.plugins.js, __.scripts.js), running local server, JS error checking and unit tests, Grunt server (uses Node.js) for live reload of changes with re-compiled Sass and CoffeeScript. Similar to Ant for Java }
        • Gulp
      • Packaging
      • Package Manager (Dependency Managers. use npm install (or update) [-g] and bower install to install tools in Package.json into /app/node_packages and Bower.json into /app/bower_components)
        • npm (Node Package Manager) { Installation Utility }
        • Bower { Web component dependency installer (i.e. bower install --save __ to add to list of dependencies in Bower.json). Similar to Maven and Ivy in Java }
        • Wiredep { Bower dependency Injection from Grunt into HTML. Manage JS and CSS includes. }
      • APIs
        • Google Maps
        • PubNub (Websockets)
  • Alias Ionic Unix Commands
    • Setup an alias function in your .bash_profile
gii() { gulp sass ; ionic build ios ; ionic emulate ios ; }



Sublime Text 2
  • Custom Tab Spaces
    • Open a document in Sublime Text 2 with the File Extension that you want to apply custom tab spacing to (i.e. two tab spaces preceding the code instead of the default of four spaces when you press the 'tab' key on your keyboard)
    • Go to the Menu and select: Sublime Text 2 > Preferences > Settings - More > Syntax Specific - User
    • Paste the following in the file that has opened automatically and then save it 
{
  "tab_size": 2,
  "translate_tabs_to_spaces": true,
  "detect_indentation": false
}

Contributions

Links

    Friday, 6 June 2014

    Progress Update - Keepal, iOS, Android SDK, MBT, Swift, Photography Masterclass

    Progress @ Keepal
    • Reviewed iOS - DONE
    • ObjectAid UML Explorer for Eclipse IDE - Testing
      • Class Diagrams
      • Sequence Diagrams

    Progress @ Lynda.com

    Android SDK Essential Training (with David Gassner) -DONE
    • Android Market Fragmentation Recent Statistics { OS, Screen Size, Pixel Density, Vendors } and Strategies { DP, Multi-Screen Drawable Resources }
      • 9 Patch Resizer Tool 
        • Converts Multiple Images into Multiple Sizes that Map to the Multiple Drawable Folders in the Resources Directory of Package Explorer to enabling Graphics selected by Application Framework correctly for any Device
      • 9 Patch Drawable Graphics { stretch and adapt automatically to different screen densities and sizes }
      • Simple Nine-Patch Generator (Android Asset Studio) { regardless of screen size and pixel density it always positions graphic with correct aspect ratio on screen by handling both borders and multiple versions of pixel densities }
    • Android Development Toolkit (ADT) Plugin
    • Android Debug Bridge (ADB) Platform Tool
      • Debug Perspective Tools
        • LogCat Tool (Custom Messages, Filtering)
          • Tracing State Changes (Lifecycle Debugging where Events triggered by moving between Activities that are associated with a Method)
        • Toast Messages
        • Breakpoints 
        • Watchlists
      • Refactoring with Extract to Constants (CMD+1) 
      • Dalvik Debug Monitor Service (DDMS) Perspective 
        • Screen Captures
        • Heap Memory Usage of Device at Runtime by causing Garbage Collection (GC)
        • Persistent Data Storage 
        • Emulator Control (SMS, Voice)
    • Eclipse Java IDE
    • Manifest File (Activities, Intent Filter, Themes)
      • Custom Themes (using Android SDK)
    • Multiple Activities and Layouts 
      • Types (Linear, Relative, and Containers)
      • Layout Manipulation (Margins, Padding, Gravity, Nesting)
      • Java Views (Visual Widgets)
      • Content Assistant (CTRL+SPACE)
      • Java Classes, Importing (CMD + Click) or Quick Fix (CMD + 1) and XML elements mapping
      • Java Code to display Visual Objects, resize, or reposition in View Layouts at Runtime
      • Creating Binding Multiple Layouts (XML) and Activities (Java Classes)
      • Overriding existing Methods of the Super Class with new Method Stubs
      • Cross-Browser Compatibility including Scale-Independent Pixels, Device-Independent Pixels (DP), and Conversion
      • Resources (String, Image) and Literals
      • Resources Identifiers and the dynamically generated R Class
      • Downcasting to Classes
      • Navigating between Multiple Activities and Layouts
        • Explicit Intents
        • Implicit Intents
      • Event Handler Custom Methods
        • Inline Event Handlers with all Code in Java File (easier for Debugging instead of Splitting code between Event Handlers Declared in XML file and Event Handler Methods in Java File)
        • Options Menu { Refactor Architecture by Replacing Buttons with Items in Options Menu using Switch Statement for Event Handling of each Intent } 
      • System Level Event Handling with Broadcast Receiver
        • Permission Granting
        • Extend Java Class BroadcastReceiver to Phone State Change and subsequent Intent generated by OS to Manage Switch b/w Phone and App
        • Debugging Reference to Extras KVPs (i.e. TelephonyManager) that describe State (i.e. Ringing) and comprise each Instance of Class Bundle
        • Registering Broadcast Receiver Class in Manifest with Intent Filter with Actions for Phone State Changes
        • Testing Virtual Device in Emulator with DDMS Emulator Control (i.e. Ringing) and LogCat
      • Constructors and Arguments (Current Context Activity "This", Class Fields i.e. "DetailedActivity.class") 
      • Action Bar and Options Menu
        • Converting Launcher Button of Action Bar into an Up Button (Strategy Complies with Android Design Guidelines)
        • Displaying Menu Items in Action Bar in Primary and Secondary Activities (Never, Always, IfRoom)
      • Activity Lifecycle and Activity Stack Rules
        • Stages { Created, Started, Resumed, Paused, Stopped, Destroyed }
        • Methods { onCreate(), onStart(), onResume(), onPause(), onStop(), onRestart(), onDestroy() }
        • Tasks containing Activities, which are Grouped into Stacks
        • Second Activity launched to Top Stack pushes Primary Activity to Back Stack
        • Starting and Finishing Activities
        • Transient and Resting States
          • States associated with Events that are associated with Methods containing Code
          • Note: Running App after "Home" button bypasses onCreate method. Running App after "Back" button does not, and removes memory. 
      • Custom Styles defined in single XML file with Attributes to control appearance of Widgets in Activity Layouts for the User Interface (similar to web page CSS) and apply throughout the app
        • Parent Attribute to Inherit Existing Styles (including Android SDK Pre-Defined Styles)
      • Widgets
        • ScrollView in Composite Category
        • ListView 
          • ArrayAdapter Class that grabs the Data to add to List and expects Arguments Context, Resource, and List of Data. Use of Layout for each List Item (from R Class, part of Android SDK, Simple List Item  that Displays a Single String) to pass Resource Argument
          • Customise Appearance of ListView MainActivity by creating a Custom Item Layout, Creating a Custom Adaptor Class (Subclass of ArrayAdapter), and Saving Private References to the Context and List of Data so it Persists for Life of Adapter, and using Layout Inflators to present instance View Objects containing Data (i.e. Image and TextView)
      • Fragments API { Architect Adaptable Multiple Fragment Screen Layouts for flexibility across Multiple Device Screen Sizes }
        • Master/Detail Flow Template with Modifiable Dummy Content for Data-Centric Apps
      • Multi-Activity Data Transfer using Intent Extras (KVPs)
        • Sending and Receiving Data between Secondary and Calling Activities using startActivityForResult method (i.e. Add to Shopping Cart)
    • Auto-Indentation ( CMD + I )
    • Emulation and Testing with Launch Configuration to Run on Multiple Virtual Devices Concurrently (Phones, Tablets)
      • Rotate 90 Degrees ( LEFT CTRL + F12 ) Tests Adaptability to Orientation Changes
      • Prevent Recreation on each Orientation Change
        • Override Auto Recreation on Orientation Configuration Change in Manifest File
        • Override Configuration Changed Class with Event Handler to Add Custom Code on each Configuration Change
        • Debug with Toast Messages 
    • Links
    • Curiosity
      • Advanced Intents - Handling Implicit Intents with Custom Activities registered for Own Standard and Custom Actions

    Progress @ Teamtreehouse.com
    • Diary App with Core Data- DONE

    Progress @ Harvard Business Publishing 
    • Management Communication: Presenting - DONE


    • Final Presentation (Peer Reviewed Oral Presentation) - DONE
      • Presentation Draft - DONE
      • Peer Review - DONE
      • Final Submission -  DONE

    Events
    • BOOKED Olympus Photography Masterclasses with Vogue Australia, Vogue Living, GQ Australia, and Olympus Photography Specialists (Portraiture, Fashion, Still-Life) - Sat 7 June 2014

    Curiosity