Thursday, January 12, 2017

How to build and package tizen web and native projects (hybrid projects)

Hi there!

I've been developing for the samsung tizen platform for a while. the biggest problems we were facing, was the build and package process of hybrid projects. because of the fact that the tizen platform is not so popular yet, there is still a huge need of information on how to use it and the community is not so strong. Most of the time you don't get satisfatory answers and help on their official site. Not to mention that many of the sites result in 404 or everything is written in Korean.

For those reasons, i decided to share my experiencies with you in a very compressed that gets to the point without much "bla bla bla" :) And here are the choosen topics we will handle in this post:

  • how to install the tizen sdk
  • how to create web and native projects direct from the command line
  • how to import it into the tizen studio IDE
  • how to link native service projects with web projects
  • how to build web project
  • how to build native project
  • how to create a security certificate and use it
  • how to package web project (generate .wgt)
  • how to package native project (generate .tpk)
  • how to package a hybrid project (generate .wgt with native dependencies in it)
  • how to install and run it on the wearable devices. 


The next post, i will focus on how to build it on a continuous integration like jenkins. So stay tuned and save this page if you are interested in tizen development too.

Hope you like it enjoy it.

OS (Operation System)

Well, first of all let me say that i am a ubuntu user, so the steps bellow was done on ubuntu 16.14 LTS.

Install tizen SDK

  • download it from: https://developer.tizen.org/ko/development/tools/download?langredirect=1#installmanager
  • navigate to the donwloaded folder over terminal and give install permission to ti by typing: chmod +x {downloaded_file.bin}
  • install it by typing: ./{downloaded_file.bin}
  • just follow the wizard instructions and at the end open the Tizen Package Manager as proposed
  • As soon as the tizen package manager has opened, install all packages wihout exception.
    (I know you'll think: why shall i install all if i don't need it all - Believe me, you'll thank me later :) That's the way we found that everything works just fine.)
  • Install all in the suggested location ex: /home/{username}/tizen-sdk and so on. 
  • At the end you'll end up with a folder structure in your home like this: tizenIDE-data, tizen-sdk, tizen-sdk-data, tizen-studio and tizen-studio-data


Create web and native projects direct from command line

To do so, you'll need to ensure that your PATH is pointing to the downloaded tizen tools. Open your ".bashrc" file located in your home directory. (press Ctrl+h to show hidden files) in there, add the following lines (if not there yet)

### exporting tizen tools
export PATH=$PATH:/home/ricardo/tizen-sdk/tools/ide/bin/
###source tizen-autocomplete
source /home/ricardo/tizen-sdk/tools/ide/bin/tizen-autocomplete


Creating a default workspace first

Create a folder like: ws_tizen_studio somewhere in your home. Ex: /home/ws_tizen_studio
this will be your workspace. As soon as you start the tizen studio IDE you can point to it. To do so, navigate to /home/ricardo/tizen-studio/ide and double click the eclipse icon. As soon as you open your IDE for the first time, it will suggest a workspace directory. Change it to /home/ws_tizen_studio

Great, now we can create our sample projects like this (i am using here wearble-2.3.1 but feel free to use whatever version you need) In your terminal type:


Create a sample tizen web project

tizen create native-project -p wearable-2.3.1 -t ServiceApp -n native -- /media/truecrypt5/dev/ws_tizen_studio/


Create a sample tizen web project

tizen create web-project -p wearable-2.3.1  -t WebBasicapplication -n web -- /media/truecrypt5/dev/ws_tizen_studio/

If you are wondering how i know which tizen project types exist and how i figured it out, just type:
tizen list web-project or tizen list native-project to see all project types available


Import projects into tizen studio IDE

Ok, if everything went fine, the next step will be to import those created projects into our brand new tizen studio IDE. IMPORTANT NOTE: You for sure will be asking yourself why i create the projects over command line, if i could create it over the IDE right? Well, after many days trying to figure it out why we couldn't build and package our projects, we found it out that if we create it over the tizen command line tool (CLI) than it works just fine.


Import native project

File >> Import >> select your native project.


Import web project

File >> New >> Tizen Project > template >> wearable v2.3.1 >> We application >> Basic UI >> More properties >> unmark: Use default location >> browse: select created web project >> finish


Link native service projects with web projects

In the tizen studio IDE >> select your web project >> right mouse click >> properties > tizen studio >> package >> multi >> select native project > OK


Build web project

tizen build-web -- /home/ws_tizen_studio/web
the command above will create a .buildResult folder inside your project structure. In this folder you will encounter the project files without all unnecessary files. There is not .wgt yet. Those steps will be described a few steps later. To visualize the .buildResult folder it in your tizen studio IDE, make sure the hidden files are visible. To do so:

Tizen Studio IDE >> project explorer >> dropdown arrow >> unselect: *.resources >> OK






Build project native

IMPORTANT NOTE: native projects can be run on wearable only if set to Release and arm. Debug and x86 works fine for the emulator only. The command bellow will create a Release folder inside your project with the binary and resources you'll need to package your .tpk file. How to package this project will be described next. Stay tuned.

tizen build-native -a arm -c llvm -C Release --  /home/ws_tizen_studio/native


Create a security certificate

Before we can package the projects, we need a security certificate. In order to create your own certificate, run this:

Command: 
tizen certificate -a {profileName} -p {password} -c {landcode} -s {state} -ct {city} -o {ogranization} -u {organizationUnit} -n "{yourName}" -e {yourEmail}

Ex:
tizen certificate -a tizen_profile -p 123456 -c BR -s Pernambuco -ct Recife -o None -u Development -n "Ricardo Ferreira" -e email@yourCompany.com

Ok, now you'll need to add your brand new certificate to the cli-config. To do so, enter:
tizen security-profiles add -n tizen_profile -a /home/{youName}/tizen-sdk-data/keystore/author/author.p12 -p 123456

Running the command bellow, you'll be able to see all available certificates. You should see now your created "tizen_profile" certificate in the list:
tizen security-profiles list

than check if certificate was also added to the cli-config by typing:
tizen cli-config -l

If there is no certificate added, just add it by running this command:
tizen cli-config "default.profiles.path=/home/{yourName}/tizen-sdk-data/ide/keystore/profiles.xml"

Ok, now we are good to go and to package our projects. Lets move on!


Package web project

tizen package -t wgt -s tizen_profile -- /home/ws_tizen_studio/web/.buildResult
You should see now a file called web.wgt in the folder .buildResult


Package native project

tizen package -t tpk -s tizen_profile -- /home/ws_tizen_studio/native/Release
You should see now a file called org.exemple.native-1.0.0-arm.tpk


Package a hybrid project

The next step is now to put both projects together. Because at the moment we have single packages for each project (web.wgt and org.exemple.native-1.0.0-arm.tpk) Our goal is to have a single package called web.wgt which contains both projects and its dependencies in it. The command bellow will achieve that for us:

tizen package -t wgt -s tizen_profile -r /home/ws_tizen_studio/native/Release/org.example.native-1.0.0-arm.tpk -- /home/ws_tizen_studio/web/.buildResult/web.wgt

Take a look at the old web.wgt package. It has been overridden and now we have a hybrid application with both projects inside of it.


Install and run it on a Smart Watch

In order to install the hybrid application in our wearable, we must connect to it first. First of all, go into your watch settings, enable wifi-connection, click on the wifi connection and scroll down to see the watch IP. (you'll need it to install the hybrid application) NOTE: Your PC must be connect to the same wifi connection also. Otherwise you can't transfer the package from the PC to the watch.
Ok, now navigate to the tools directory by typing:

cd /home/{yourName}/tizen-sdk/tools
./sdb connect {ip_watch}

As soon as the watch is connected, type: (you may try to execute the command above several times till the connection is established - It depends on the connection quality sometimes)

./sdb install /home/ws_tizen_studio/web/.buildResult/web.wgt

If you have some logs in your native app (for testing purposes) you can enable it by typing this:
./sdb dlog org.example.native

NOTE: If for some reason you want to repeat those steps, don't forget to run the command bellow to clean old builds:
tizen clean -- /home/ws_tizen_studio/web
tizen clean -- /home/ws_tizen_studio/native

That's all. Hope you like it. :)

😱👇 PROMOTIONAL DISCOUNT: BOOKS AND IPODS PRO ðŸ˜±ðŸ‘‡

Be sure to read, it will change your life!
Show your work by Austin Kleonhttps://amzn.to/34NVmwx

This book is a must read - it will put you in another level! (Expert)
Agile Software Development, Principles, Patterns, and Practiceshttps://amzn.to/30WQSm2

Write cleaner code and stand out!
Clean Code - A Handbook of Agile Software Craftsmanship: https://amzn.to/33RvaSv

This book is very practical, straightforward and to the point! Worth every penny!
Kotlin for Android App Development (Developer's Library): https://amzn.to/33VZ6gp

Needless to say, these are top right?
Apple AirPods Pro: https://amzn.to/2GOICxy

😱👆 PROMOTIONAL DISCOUNT: BOOKS AND IPODS PRO ðŸ˜±ðŸ‘†