Friday, February 17, 2017

Ionic 2 - Hybrid mobile app development Framework




අද මම මේ ලිපියෙන් කතා කරන්නේ ionic 2 කියන mobile app development framework එක ගැන.

මේ ගැන කතා කරද්දී අපි මුලින්ම දැනගන්න ඕනි native app එකක් කියන්නේ මොකක්ද සහ hybrid app එකක් කියන්නේ මොකක්ද කියලා.

native app එකක් develop කරලා තියෙන්නේ යම් විශේෂිත වූ platform එකක් හෝ device එකක් සදහා පාවිචිචි කරන්න. නමුත් hybrid කියන concept එකේදි application එකේ core එක එහෙම නැත්නම් මදය ලියලා තියෙන්නේ HTML 5 mobile app එකක් විදිහට. ඊට පස්සේ මේ  core  එක නැත්නම් මදය ආවරණය කරනවා native device එකකින්. මේ native wrapper එක අතරමැදියෙක් විදිහට ක්‍රියා කරලා instructions එහෙම නැත්නම් උපදෙස් අදාළ mobile device එකට තේරුම් ගැනීමට හැකි වන පරිදි පරිවර්තනය කරනවා.

මේකෙදි තියෙන විශේෂත්වය තමා දැන් අපිට mobile app එකේ core එක නැවත පාවිච්චි කරන්න පුළුවන් වෙනත් platforms සදහා. අපිට කරන්න තියෙන්නේ mobile device එක සහ එහි operating system එක සදහා app core එක ආවරණය කරලා තියෙන native wrapper එක ලිවීම පමණයි. native app එක්ක සන්සන්දනය කරලා බලද්දී hybrid app වල development speed එක වැඩියි වගේම එක් විශේෂිත platform එකක් සදහා සීමා නොවී platform කිහිපයක් සදහා පාවිච්චි කරන්න පුළුවන්.
උදාහරණයක් විදිහට ionic 2 mobile app framework එක පාවිච්චි කරලා අපිට android, windows, ios platform වලට අනුගත වන ආකාරයට mobile app එකක් හදාගන්න පුළුවන්.

hybrid application වල අපි පාවිච්චි කරනවා cordova interface එක. අපි mobile app එකක් පාවිච්චි කරනවා නම් අපිට mobile එකේ hardware එක්ක සම්බන්ද වෙන්න වෙනවා. උදාහරණයක් විදිහට mobile phone එකේ camera එක. mobile එකෙන් photo එකක් ගන්න අවශ්‍ය නම් අපිට එකට phone එකේ camera එක පාවිච්චි කරන්න වෙනවා. මේකට පිළිතුරක් වශයෙන් තමා cordova interface එක යොදාගන්නේ. මේකෙන් javascript application එකට mobile එකේ  hardware access කරන්න පුළුවන් වෙනවා. cordova plugins විශාල ප්‍රමාණයක් තියෙනවා hybrid applcation එකට අවශ්‍ය කරන ඕනිම feature එකක් develop කරගන්න පුළුවන් විදිහට.

අපි දැන් බලමු ionic කොහොමද install කරගන්නේ කියලා

1. මුලින්ම Apache Cordova install  කරගන්න ඕනි.
Cordova  install  කරන්න කලින් nodejs install කරලද තියෙන්නේ කියල බලන්න අවශ්‍යයි.

අපිට පහල තියෙන commands run කරන්න windows command line, git bash terminal එක හෝ linux terminal එක පාවිච්චි කරන්න පුළුවන්. මම මෙතැනදී පාවිච්චි කරලා තියෙන්නේ git bash terminal එක.
git bash එකේ  npm  -v  command එක run කලාම nodejs install කරලා තියෙනවා නම් මේ වගේ npm version number එක terminal එකේ බලාගන්න පුළුවන්.


 



Apache cordova install කරගැනීම සදහා,

$ npm install -g cordova


සැ .යු . මේ commands run කරන්නේ linux පරිගනකයක නම්  command එකේ ආරම්භයට sudo යනුවෙන් යෙදිය යුතුයි.

උදාහරණයක් විදිහට $ sudo npm install -g cordova


2.ionic install කරගැනීම සදහා,

$ npm install -g ionic


3. පහත command එක git bash එකේ run කරලා අපිට ionic new project එකක් හදන්න පුළුවන්.


$ ionic start --v2 myproject blank


ionic 2 පාවිච්චි කරන්න නම් --v2 කියලා pass කරන්න වෙනවා .එහෙම නැත්නම් හැදෙන්නේ ionic version 1 project එකක්.  
ඒ වගේම අපිට template එකක් specify කරන්නත් පුළුවන්. ගොඩක් වෙලාවට අපි පාවිච්චි කරන්නේ blank template එක.
  

දැන් අපිට හදාගන්න පුළුවන්  pages එකක් තියෙන simple ionic app එකක්.

4. ඊට පස්සේ අදාල project folder එක ඇතුලට ගිහින් git bash එක open කරලා පහත දැක්වෙන command එක run කරන්න.

$ ionic serve


















එතකොට මේ විදහට අපිට පලවෙනි වතාවට අපේ app එක අලුත් browser ටැබ් එකක open කරගන්න පුළුවන්.

මේ වගේම තවත්  code එකක් තියෙනවා.

$ ionic lab

මේකෙන් අපිට පුළුවන් අපේ app එක android,windows ,ios  කියන platform තුනේදී appear වෙන්නේ කොහොමද කියලා බලාගන්නත් 😊😊!