AGRIHACK TALENT CHALLENGE Durban, September 2015
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
AGRIHACK TALENT CHALLENGE
Durban, September 2015
Presentation GoalsPart 1: •How & why Hybrid Apps•The true power behind appsPart 2:•CTA Shared Content Repository•Prepared tools Hackathon (Spore)
IT DEPENDS…
HYBRID APPS
NATIVE HYBRID WEB
NATIVE APPS
WEB APPS
WIKIPEDIA FEEDLYKHAN
ACADEMY AMAZON
SOME TOP 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 GoalsPart 1:•How & why Hybrid Apps•The true power behind appsPart 2: •CTA Shared Content Repository•Prepared tools Hackathon (Spore)
UTILIZE SEMANTIC WEB TECHNOLOGIES
ANALISYS
LINKING
Concept
Concept
Country
Organisation
Author Related
DISCOVERY
SOFTWARE DEVELOPMENT KIT
HACKATON TOOLS
REPOSITORIES
BUILD TOOLS
POWER OF SCAFFOLDING
VIRTUALIZATION
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 readymade project instead of starting from scratch.
We will be using the following yeoman generator in our setup:
https://github.com/tmaximini/generatorionicgulp
If you haven’t installed it yet you can do so with npm:
npm i g generatorionicgulp
To use the generator create a new folder for you project, change the working directory to the
new folder and run:
yo ionicgulp
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/vagrantioniccordovadevelopment
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 gruntcli bower ionic cordova yo generatorionicgulp
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 premade 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
SCR SPORE CONTENT
AGROVOC
AGROVOC≈
Policies
EconomicPolicies
Trade policies
TradePolicy
ExportInsurance
≈
AGROVOC≈Export
policies
ExportInsurance
Policies
EconomicPolicies
Trade policies
GEONAMES
JSON SCHEMA
DEMO
Related Documents
