Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
AGRIHACK TALENT
CHALLENGE
Durban, September 2015
Presentation Goals
Part 1:
•How & why Hybrid Apps
•The true power behind apps
Part 2:
•CTA Shared Content Repository
•Prep...
IT DEPENDS…
2014 (GSMAINTELLIGENCE.COM)
HYBRID APPS
NATIVE HYBRID WEB
NATIVE APPS
WEB APPS
WIKIPEDIA FEEDLY
KHAN
ACADEMY AMAZON
SOMETOP SELLING
HYBRID APPS
FLEXIBILITY
BROWSERS MOBILE APPS
SERVER APPLICATIONS DESKTOP APPS
ONE TRANSPORT
ONE (BIG) COMMUNITY
IONIC ANGULAR REACT
JQUERYFOUNDATIONBOOTSTRAP
POWER OF
SCAFFOLDING
POWER IS NICE…
…but what will power your App?
•High on features
•Low on resources
•Low bandwidth
•Software updates 

hard to control
MOBILE DEVICES
•High on resources
•Scalable
•High bandwidth
•Managed software 

updates
SERVER
•Exposes features
•Re-usable
•Controlled & managed
•Integration
API
CONTENT
CTA’S SHARED
CONTENT REPOSITOY
Presentation Goals
Part 1:
•How & why Hybrid Apps
•The true power behind apps
Part 2:
•CTA Shared Content Repository
•Prep...
UTILIZE SEMANTIC WEB
TECHNOLOGIES
ANALISYS
LINKING
Concept
Concept
Country
Organisation
Author
Related
DISCOVERY
SOFTWARE
DEVELOPMENT KIT
HACKATONTOOLS
REPOSITORIES
BUILDTOOLS
POWER OF
SCAFFOLDING
VIRTUALIZATION
 
Additional references & resources: 
NPM documentation:  
http://browsenpm.org/help 
 
Ionic documentation:  
http://ioni...
SCR SPORE CONTENT
AGROVOC
AGROVOC
≈
Policies
Economic
Policies
Trade
policies
Trade
Policy
Export
Insurance
≈
AGROVOC
≈
Export
policies
Export
Insurance
Policies
Economic
Policies
Trade
policies
GEONAMES
JSON SCHEMA
DEMO
Durban AgriHack Talent Challenge 2015 Slides
Durban AgriHack Talent Challenge 2015 Slides
Durban AgriHack Talent Challenge 2015 Slides
Durban AgriHack Talent Challenge 2015 Slides
Durban AgriHack Talent Challenge 2015 Slides
Durban AgriHack Talent Challenge 2015 Slides
Durban AgriHack Talent Challenge 2015 Slides
Durban AgriHack Talent Challenge 2015 Slides
Durban AgriHack Talent Challenge 2015 Slides
Durban AgriHack Talent Challenge 2015 Slides
Durban AgriHack Talent Challenge 2015 Slides
Durban AgriHack Talent Challenge 2015 Slides
Durban AgriHack Talent Challenge 2015 Slides
Durban AgriHack Talent Challenge 2015 Slides
Durban AgriHack Talent Challenge 2015 Slides
Durban AgriHack Talent Challenge 2015 Slides
Upcoming SlideShare
Loading in …5
×

Durban AgriHack Talent Challenge 2015 Slides

452 views

Published on

The Slides from my presentation at the Durban AgriHack 2015. They cover hybrid mobile development and the Spore magazine assignment details.

Published in: Software
  • Be the first to comment

  • Be the first to like this

Durban AgriHack Talent Challenge 2015 Slides

  1. 1. AGRIHACK TALENT CHALLENGE Durban, September 2015
  2. 2. Presentation Goals Part 1: •How & why Hybrid Apps •The true power behind apps Part 2: •CTA Shared Content Repository •Prepared tools Hackathon (Spore)
  3. 3. IT DEPENDS…
  4. 4. 2014 (GSMAINTELLIGENCE.COM)
  5. 5. HYBRID APPS
  6. 6. NATIVE HYBRID WEB
  7. 7. NATIVE APPS
  8. 8. WEB APPS
  9. 9. WIKIPEDIA FEEDLY KHAN ACADEMY AMAZON SOMETOP SELLING HYBRID APPS
  10. 10. FLEXIBILITY
  11. 11. BROWSERS MOBILE APPS SERVER APPLICATIONS DESKTOP APPS
  12. 12. ONE TRANSPORT
  13. 13. ONE (BIG) COMMUNITY
  14. 14. IONIC ANGULAR REACT JQUERYFOUNDATIONBOOTSTRAP
  15. 15. POWER OF SCAFFOLDING
  16. 16. POWER IS NICE… …but what will power your App?
  17. 17. •High on features •Low on resources •Low bandwidth •Software updates 
 hard to control MOBILE DEVICES
  18. 18. •High on resources •Scalable •High bandwidth •Managed software 
 updates SERVER
  19. 19. •Exposes features •Re-usable •Controlled & managed •Integration API
  20. 20. CONTENT
  21. 21. CTA’S SHARED CONTENT REPOSITOY
  22. 22. Presentation Goals Part 1: •How & why Hybrid Apps •The true power behind apps Part 2: •CTA Shared Content Repository •Prepared tools Hackathon (Spore)
  23. 23. UTILIZE SEMANTIC WEB TECHNOLOGIES
  24. 24. ANALISYS
  25. 25. LINKING Concept Concept Country Organisation Author Related
  26. 26. DISCOVERY
  27. 27. SOFTWARE DEVELOPMENT KIT
  28. 28. HACKATONTOOLS
  29. 29. REPOSITORIES
  30. 30. BUILDTOOLS
  31. 31. POWER OF SCAFFOLDING
  32. 32. VIRTUALIZATION
  33. 33.   Additional references & resources:  NPM documentation:   http://browsenpm.org/help    Ionic documentation:   http://ionicframework.com/docs/    Ionic Icons:   http://ionicons.com/    Cordova documentation:   https://cordova.apache.org/docs/en/5.0.0/    Angular documentation:   https://docs.angularjs.org/api    Yeoman documentation:   http://yeoman.io/learning/index.html        Scaffold your mobile app project  Scaffolding is a subject that will be explained during the presentation given in Durban. In  short it is a way to use a ready­made project instead of starting from scratch.    We will be using the following yeoman generator in our setup:  https://github.com/tmaximini/generator­ionic­gulp    If you haven’t installed it yet you can do so with npm:    npm i ­g generator­ionic­gulp    To use the generator create a new folder for you project, change the working directory to the  new folder and run:    yo ionic­gulp    A set of questions will guide you in creating your Ionic project. More details about scaffolding  and ionic development will be given during (or before) the hackathon.            Container / Virtual Machine installation  Using a virtual machine or container image will isolate the development environment used  for the hackathon from your own OS. The advantage of this approach is that you won’t  conflict with any locally installed software and it will be easier to remove from your system  afterwards. Installing Vagrant  You will need to install vagrant which relies on VirtualBox for its virtual machines    https://www.vagrantup.com/    https://www.virtualbox.org/    Please install the version appropriate for your Operating System    Creating the Virtual Machine  We have prepared a Vagrantfile you can download (or clone) from github:  https://github.com/SpringTree/vagrant­ionic­cordova­development    Create a folder where you want to install the development image and place the VagrantFile  from the above repository there. You will want to edit the VagrantFile to link a folder on your  local filesystem to a folder inside the VM. The default assumes a folder named ‘Projects’ in  your home directory.    Look for the following line in the VagrantFile and adjust as needed:    config.vm.synced_folder "~/Projects", "/home/vagrant/vagrant_projects"    If you installed and verified VirtualBox is working you can let Vagrant build your environment  using the following command:    vagrant up  NOTE: This will take quite a while and it will download a large virtual machine image    When everything is installed you can get shell access to the VM using the following  command:    vagrant ssh    Manual installation  If you are somewhat familiar with development using node.js and have it installed on your  system you can install the required software with the following command:    npm i ­g gulp grunt­cli bower ionic cordova yo generator­ionic­gulp  NOTE: You may need administrator (sudo) permission depending on your system setup    You can use the detailed installation instructions below for each piece of software if you  don’t have node.js installed or are unfamiliar with it.  Install Node.js and NPM (v0.12.x)  https://nodejs.org/download/release/v0.12.7/    Install Bower  http://bower.io/    Install Ionic and Cordova  http://ionicframework.com/docs/guide/installation.html    Install gulp  http://gulpjs.com/    Optionally; setup Android development environment  We will not be focussing on deploying to actual devices during the session. Should you wish  to do so you will need to setup the Android SDK    https://cordova.apache.org/docs/en/5.0.0/guide/platforms/android/    Optionally; setup iOS development environment  We will not be focussing on deploying to actual devices during the session. Should you wish  to do so you will need to setup the iOS SDK. This will only work on Apple hardware running  OSX with XCode installed    https://cordova.apache.org/docs/en/5.0.0/guide/platforms/ios/    Hybrid App Development Instructions  Goal We have prepared a set of instructions for setting up a development environment for the  upcoming AgriHack Talent challenge 2015 in Durban. Using the technology and approach  described here is optional but will allow you save valuable time and ‘hit the ground running’  during the hackathon.    Depending on your level of familiarity with the tools used you have 2 options:  ● Manual installation on your own OS  ● Using a pre­made container (Vagrant or Docker)    Used technology  A presentation about what hybrid app development is and its benefits and pitfalls will be  given in Durban. There are a number of options for hybrid module App development. The  focus for the hackathon is to use ​Ionic​ (which is based on ​angular​) within a ​Cordova  container. They both depend on ​node.js​ to function.    At the time of writing the following versions of the software are in use:  ● node.js: v0.12.7  ● ionic: 1.1.0  ● angular: 1.4.3  ● cordova: 5.4.0  ● gulp: 3.9.0    The primary development language used will be ​javascript​.    If you are going to use the container approach to installing you will also need:  ● virtualbox: 5.0.10  ● vagrant:1.7.4    NOTE: VirtualBox will need to install an extension specific to your host operating system  after installing itself. Run virtualbox at least once before getting started with vagrant     
  34. 34. SCR SPORE CONTENT
  35. 35. AGROVOC
  36. 36. AGROVOC ≈ Policies Economic Policies Trade policies
  37. 37. Trade Policy
  38. 38. Export Insurance
  39. 39. ≈ AGROVOC ≈ Export policies Export Insurance Policies Economic Policies Trade policies
  40. 40. GEONAMES
  41. 41. JSON SCHEMA
  42. 42. DEMO

×