native vs html5 - ionic app development | cm telecom

28
CM TELECOM - SJORS DE WILDT

Upload: cm-telecom

Post on 06-Jan-2017

321 views

Category:

Mobile


0 download

TRANSCRIPT

Page 1: Native VS HTML5 - Ionic App Development | CM Telecom

C M T E L E C O M - S J O R S D E W I L D T

Page 2: Native VS HTML5 - Ionic App Development | CM Telecom

C M T E L E C O M L O N D O N F O R M E R O N E S I X T Y

M O B I L E

P R O D U C T D E V E L O P M E N T

A P P / H Y B R I D M E S S A G I N G S P E C I A L I S T

A B O U T M E

Page 3: Native VS HTML5 - Ionic App Development | CM Telecom

T O D A Y S A G E N D A

W H Y M O B I L E A P P S N AT I V E V S H T M L 5

I O N I C A N G U L A R J S C O R D O VA

G E T T I N G S TA R T E D C O R D O VA P L U G I N S M O D U L E S L I V E D E M O

I O N I C V I E W I O N I C L A B I O N I C M A R K E T

Page 4: Native VS HTML5 - Ionic App Development | CM Telecom

A L I T T L E W E B A P P H I S T O R Y

M O B I L E W E B S I T E S I N N AT I V E W E B V I E W

Page 5: Native VS HTML5 - Ionic App Development | CM Telecom

W H Y M O B I L E A P P S ?

P R O V I D E VA L U E I M P R O V E E N G A G E M E N T A U T O M AT E P R O C E S S E S I M P R O V E E F F I C I E N C Y S I M P L I F Y L I F E S TA N D O U T B R O A D E N Y O U R R E A C H N E W C H A N N E L S

Page 6: Native VS HTML5 - Ionic App Development | CM Telecom

N A T I V E V S H T M L 5

D E V T I M E / C O S T S

S P E E D

S E C U R I T Y

C R O S S - P L AT F O R M

U S E R E X P E R I E N C E

S P E E D T O M A R K E T

AVA I L A B L E D E V S

O N G O I N G C O S T S

-

✓ ✓ -

✓ -

-

-

N AT I V E

✓ -

-

✓ -

✓ ✓

H T M L 5

Page 7: Native VS HTML5 - Ionic App Development | CM Telecom

I O N I C F R A M E W O R K

Page 8: Native VS HTML5 - Ionic App Development | CM Telecom

I O N I C F R A M E W O R K

O P E N S O U R C E M O B I L E O P T I M I S E D H T M L / C S S / J S M I N I M A L D O M M A N I P U L AT I O N Z E R O J Q U E R Y A N G U L A R N AT I V E F O C U S ( I O S / A N D R O I D ) S I M P L E D E FA U LT D E S I G N P O W E R F U L C L I C O R D O VA

Page 9: Native VS HTML5 - Ionic App Development | CM Telecom

A N G U L A R J S

P O W E R F U L L M V C F R A M E W O R K B Y G O O G L E E X T E N D S H T M L T O E N A B L E D Y N A M I C V I E W S T W O W AY B I N D I N G

Page 10: Native VS HTML5 - Ionic App Development | CM Telecom

A N G U L A R J S

Page 11: Native VS HTML5 - Ionic App Development | CM Telecom

A N G U L A R J S

W H Y I S A N G U L A R I M P O R TA N T ?

Page 12: Native VS HTML5 - Ionic App Development | CM Telecom

C O R D O VA

F O R M E R LY K N O W N A S P H O N E G A P, I S A P L AT F O R M T O B U I L D N AT I V E M O B I L E A P P S U S I N G H T M L 5 , C S S & J S W I T H A C C E S S T O N AT I V E H A R D W A R E F E AT U R E S

Page 13: Native VS HTML5 - Ionic App Development | CM Telecom

C O R D O VA

C O R D O VA I S N O T A U I F R A M E W O R K I T O F F E R S N AT I V E A P I ’ S ( M O S T V I A P L U G I N S )

B A D G E , B A C K G R O U N D R E F R E S H , B AT T E R Y, B A R C O D E S C A N N E R , C A L E N D A R , C A M E R A , C A P T U R E , C O N TA C T, D AT E P I C K E R , D E V I C E M O T I O N , D E V I C E O R I E N TAT I O N , D I A L O G S , FA C E B O O K , F I L E T R A N S F E R , G E O L O C AT I O N , H E A LT H K I T, I B E A C O N , I M A G E P I C K E R , I N A P P B R O W S E R , K E Y B O A R D , L O C A L N O T I F I C AT I O N S , M E D I A , N AT I V E A U D I O , N E T W O R K , P R I N T E R , S M S , S O C I A L S H A R I N G , S TAT U S B A R , T O U C H I D , V I B R AT I O N

Page 14: Native VS HTML5 - Ionic App Development | CM Telecom

I O N I C : G E T T I N G S TA R T E D

H T T P : / / I O N I C F R A M E W O R K . C O M / G E T T I N G - S TA R T E D /

Page 15: Native VS HTML5 - Ionic App Development | CM Telecom

C O R D O VA P L U G I N S

E X A M P L E O F S TAT U S B A R P L U G I N ( N G C O R V O D A )

Page 16: Native VS HTML5 - Ionic App Development | CM Telecom

M O D U L E S

A N G U L A R J S M O D U L E S . T H E M O D U L E I S A C O N TA I N E R

F O R T H E D I F F E R E N T PA R T S O F A N A P P L I C AT I O N .

Page 17: Native VS HTML5 - Ionic App Development | CM Telecom

M O D U L E S + C O R D O VA P L U G I N S = N G C O R D O VA

N G C O R D O VA I S A C O L L E C T I O N O F 7 0 + A N G U L A R J S E X T E N S I O N S

O N T O P O F T H E C O R D O VA A P I T H AT M A K E I T E A S Y T O B U I L D ,

T E S T, A N D D E P L O Y C O R D O VA M O B I L E A P P S W I T H A N G U L A R J S

Page 18: Native VS HTML5 - Ionic App Development | CM Telecom

M O D U L E S + C O R D O VA P L U G I N S = N G C O R D O VA

N G C O R D O VA I S A C O L L E C T I O N O F 7 0 + A N G U L A R J S E X T E N S I O N S

O N T O P O F T H E C O R D O VA A P I T H AT M A K E I T E A S Y T O B U I L D ,

T E S T, A N D D E P L O Y C O R D O VA M O B I L E A P P S W I T H A N G U L A R J S

Page 19: Native VS HTML5 - Ionic App Development | CM Telecom

M O D U L E S + C O R D O VA P L U G I N S = N G C O R D O VA

G E O L O C AT I O N E X A M P L E

Page 20: Native VS HTML5 - Ionic App Development | CM Telecom

I O N I C V I E W

I O N I C S A N S W E R T O T E S T F L I G H T

Page 21: Native VS HTML5 - Ionic App Development | CM Telecom

I O N I C V I E W

I O N I C S A N S W E R T O T E S T F L I G H T

Page 22: Native VS HTML5 - Ionic App Development | CM Telecom

I O N I C P U S H

H O W A B O U T P U S H N O T I F I C AT I O N S ?

Page 23: Native VS HTML5 - Ionic App Development | CM Telecom

I O N I C M A R K E T

Page 24: Native VS HTML5 - Ionic App Development | CM Telecom

I O N I C L A B

Page 25: Native VS HTML5 - Ionic App Development | CM Telecom

R I S K S ?

- A N G U L A R I S M O V I N G T O 2 . 0

- E X T E N S I O N S C A N L O S E S U P P O R T

- E X T E N S I O N S C A N B E V E N E R A B L E

- F U T U R E A N D R O I D A N D I O S S U P P O R T

- F U T U R E A P P S T O R E R E S T R I C T I O N S

- I O N I C D I S C O N T I N U E D

- I O N I C S TA R T S C H A R G I N G

- H O W S E C U R E I S Y O U R C O D E ?

- E A S Y R E V E R S E E N G I N E E R I N G ?

Page 26: Native VS HTML5 - Ionic App Development | CM Telecom

C O N C L U S I O N

- E A S Y T O S E T U P F R A M E W O R K

- N O N AT I V E C O D E S K I L L S R E Q U I R E D

- E A S Y T O L E A R N

- U S E O F H T M L A N D C S S F O R D E S I G N / V I E W S

- N AT I V E H A R D W A R E A C C E S S V I A C O R D O VA

- L A R G E A N G U L A R C O M M U N I T Y

- C R O S S P L AT F O R M

- I N C R E D I B L E S P E E D T O M A R K E T

- M A N Y E X T E N S I O N S AVA I L A B L E

- P L AT F O R M K E E P S O N I M P R O V I N G

- I O N I C T O O L S ( C R E AT O R / L A B / P U S H / A N A LY T I C S )

Page 27: Native VS HTML5 - Ionic App Development | CM Telecom

Q & A

T I M E F O R Q U E S T I O N S A N D D I S C U S S I O N

Page 28: Native VS HTML5 - Ionic App Development | CM Telecom

$ S C O P E . E N D ( P R E S E N TA T I O N ) ;

T H A N K Y O U

G E T I N T O U C H :

S J O R S . D E W I L D T @ C M T E L E C O M . C O M

O R F I N D M E O N L I N K E D I N