Host an Ionic app into AWS S3 Bucket using Serverless framework

When I was working on a Mobile App’s front end development project, we were asked by our customer to deploy the ionic app into a public server ( as a Web SPA ), so that they could access & playing around with it immediately, in their browsers. Ionic framework comes with a built in web server which allow you to run the app as a Web application ( through invoking `ionic serve` command). Then, this part was not a problem to us. However, we should figure out where & how we were going to deploy the ionic app to. That time, we suggested our customer, to deploy the ionic app into our AWS EC2 Instance/Elasticbeanstalk or into their own on premise server.
Fast forward back to today, we have more options which allow us to deploy an Ionic app (also other web SPA like angular JS or React) into AWS S3 bucket and host the app in there. This is possible since AWS S3 bucket has capability to host static web page. Then, we have several tools to help us doing this: through AWS S3 Web Console, AWS SDK CLI tool or Serverless framework with S3 Client plugin.
In the time I wrote this article, I am working with Backend team which use Serverless framework in our project. Based on this situation, I am curious with this tool’s ability to deploy front end web Single Page Application (SPA) like Ionic, into an S3 bucket. In the next sections, we will cover steps of how to do this in Serverless framework’s way.



  • Ensure that you have AWS account.
  • Ensure that you have installed Node.js in your machine. Refer to this link if you have not installed it yet.
  • Ensure that you have installed Ionic framework, Android SDK and/or XCode in your machine. Refers to this link if you have not installed Ionic yet.
  • Ensure that you have installed stable version of Serverless framework (version 0.5.6). If not, run this command to install it: npm install -g serverless@^0.5.6
  • Login into your AWS Management Console, create a new IAM account and attach AdministratorAccess policy into the created IAM Account.


  • Ensure that you have written the created IAM account’s ACCESS KEY ID & Secret access key. We are going to use these in later steps.


Prepare a Serverless project

  • In a terminal box, run sls project create command. Notice that running this command creates a new Cloud Formation’s template in your AWS account for specified region (in this sample, we choose ap-northeast-1 AWS region) and also created a new folder in your current directory.

  • Change directory to the folder created by running command in prior step, then running this command: npm install serverless-client-s3 --save to install serverless-client-s3 plugin
  • Create folder client/dist. In mac/linux command shell, we can do this by running this command mkdir -p client/dist.
  • Copy all files inside your Ionic project’s /www folder into client/dist folder , created in prior step.

  • In the serverless project’s root directory, edit & update the s-project.json file by adding these following changes:


Deploy the Ionic App into AWS S3 Bucket

  • In the serverless project’s root directory, run sls client deploy -s stageName -r regionName command to deploy the Ionic app into AWS S3 bucket for specific stage & region. Example: sls client deploy -s dev -r ap-northeast-1 to deploy the app into Tokyo data center and labeled as dev stage. This might take a while to finish.

  • Once it’s done, notice your AWS S3 console. There is a new bucket created in the list where its name is matched with the bucketname setting we define in our s-project.json file. View its content by clicking the folder’s link. Notice that the bucket contains all of files of our Ionic app, we copied in client/dist folder in prior step.

  • Click Properties button on the page, and click ‘Enable Web Hosting’ accordion button to display url link of the deployed web application.
  • Click the url link to display our Ionic app. Ensure that no error happens and our Ionic app’s landing page is displayed successfully.


The Flaw

The latest version of serverless-s3-client plugin (version 2.0) deploys the web app to s3 bucket with no restriction access policy, which mean it is accessible to anyone / public. While this is not a problem to us (the developers), to our customers, this is mostly undesired. Because they might not want people outside the developer team and themselves, to look at our current works on the deployed Ionic app.

At the moment, restricting accesses to the S3 bucket, require us to add access Policy on it manually through S3 web console. There are couple of guys whom created Pull Request on serverless-s3-client plugin’s github page which allow us to define S3 policy bucket inside s-project.json file. Once the serverless maintainers reviewed & merge these Pull Request, I will update this article with steps to add the s3 bucket’s access restriction policy.


Deploying Sails.js Web Application on AWS EC2 Instance

Sails.js is a Web MVC Framework, built on the top of Node.js platfom, that is interesting to me. Beside the framework leverages MVC pattern and offers blazing fast performance during runtime (thanks to Node.js), it also came in with a built in HTTP server. When i am going to run my web application, I do not need to compile, package & deploy my code into a separated web server. Instead, it just requires me to invoke a line of command to get my web application up & running:

 sails lift MyAwesomeWebApplication 

Also, it just need me to press CTL+C keys in the terminal, to stop the running web application. This is a similar feature that exists in Play.

In the meantime, I was thinking about what if I deploy & run a sails web application on a cloud environment, let’s say, Amazon Web Service. So, i made the first attempt by deploying a simple sails web app on AWS through Elastic Beanstalk (EB). The result is my web app’s homepage did not show in my browser. Instead, it displays EB App’s default homepage.

Then, I took the other route. I create an EC2 Instance (It’s a virtual private server) using AMI (Amazon Machine Image) with pre-installed Ubuntu 14.04 OS. I installed required softwares in the created EC2 instance then lift my sails web app on it. Then, check it using my browser & it confirmed me that my sails web app was up & running.

In this article, I would like to share you the steps that I did to get my sails app running in a Ubuntu AWS EC2 instance. And, here they are:

Create a new AWS Instance using Ubuntu 64 AMI

  1. Browse to AWS console at & click EC2 link.aws_console
  2. On the EC2 Dashboard, click IMAGES->AMIs menu link.
  3. On the Filter menu bar, modify the options to Public images | 64-bit images | Ubuntu.
  4. On the returned filtered result, tick a desired AMI (e.g. ubuntu/images/ebs/ubuntu-trusty-14.04-amd64-server).ubuntu_ami
  5. Click [Launch] button.
  6. On the “Step 2: Choose an Instance Type” page, tick a desired EC2 Instance Type (e.g. Micro Instances) then click [Next: Configure Instance Details] button.choose_instance_type
  7. On the “Step 3: Configure Instance Details” page, leave the default settings and click [Next: Add Storage] button.
  8. On the “Step 4: Add Storage” page, adjust the Root’s storage size or just leave the default settings then click [Next: Tag Instance] button.add_storage
  9. On the “Step 5: Tag Instance” page, leave the default settings and click [Next: Configure Security Group] button.
  10. On the “Step 6: Configure Security Group” page:
    • Select “Create a new security group” option.
    • Enter name & description for the new security group.
    • Click [Add Rule] button & on the new entry, enter: Type = Custom TCP Rule, Protocol = TCP, Port Range = 1337, Source = Anywhere.
    • Click [Review and Launch] button.configure_security_group
  11. On the “Step 7: Review Instance Launch”, click [Launch] button.
  12. On the displayed “Select an existing key pair of create a new key pair” dialog, select “Create a new key pair” on the combo field, enter Key pair name then click [Download Key Pair]  & [Launch Instances] buttons.
  13. Save the downloaded .pem file into somewhere within your home directory & restrict its access by running this command in terminal:
    chmod 400 yourdownloadedkeypair.pem
  14. Go back to browser, click [View Instance] button. Notice that the browser redirects to Instances dashboard page and the new AMI Instance is shown in the Instances list. Give the new Instance a name if you like ( by clicking the new instance’s empty Name cell and type the name on it).  Make notes on the new Instance’s Public IP or Public DNS fields.instances_dashboard

Connecting to the created AMI Instance using SSH

  1. On the Instances Dashboard page, click [Connect] button. A dialog would appear, showing 2 options for connecting to the Instance. Select “A standalone SSH client”, block and copy the command written under ‘Example’ section.connect_to_instance
  2. Open the command line Terminal box, move to the directory that has the downloaded .pem file and run the command written in the earlier instructions dialog.
    ssh -i downloaded_keypair.pem ubuntu@new_instance_public_ip_or_dns


  3. Confirm that you have logged in successfully.ssh_connected
  4. Set the root’s password by running these commands:
    sudo su


Setup required softwares on the created AMI Instance (as root)

  1. In the SSH terminal connected to the new Instance, run these following commands to update the new Instance’s software repositories:
    apt-get upgrade && apt-get dist-upgrade && apt-get update && apt-get autoclean


  2. Run these commands to set up the git client:
    apt-get install build-essential git



  3. Create a new directory & pull the latest Node.js source code in this directory by running this command ( using git client ):
    git clone


  4. Change directory to the cloned Node.js source directory, then run these commands to compile & install the Node.js:
    sudo ./configure && make && make install
  5. Confirm that the compilation process is finished successfully.check_node_version
  6. Install sail.js web MVC framework by running this command:
    npm -g install sails
  7. Confirm that the installation is finished successfullycheck_sails_version

Deploy a sails.js app into the created Instance

  1. Ensure that you have put the sails.js app source code in your git account (e.g. github, bitbucket, etc ).
  2. On the created Instance, create a new directory and do git clone the sails.js app source code into this directory.clone_app_source
  3. Change directory to the cloned source code’s directory and run this command to install node module dependencies referenced by your sails.js app
    npm install


  4. Run this command to lift the sails.js app online on the created instance:
    sails lift
  5. Confirm that the sails.js app is lifted successfullysails_lift
  6. Go back to your internet browser and browse to your instance’s public IP address , port 1337.sails_app_url
  7. Confirm that the lifted sails.js app’s home page is displayedlifted_sails_app

It’s alive now ! But, wait..

When I close my current SSH session that was connected to the EC2 instance & refreshed the sails app’s page in my browser, I noticed that it returns 404 error. My sails web app was offline. Apparently, each processes that have been started during SSH session within the EC2 instance, would be shutdown when the SSH connection is closed. Somehow, I need to prevent the running sails app from being closed even when the SSH session is ended.

Fortunately, the solution for this is already suggested in the documentation of sails.js. The document suggests us to install & start a sails.js app by using forever. Forever prevents any running scripts from being closed during SSH session by running them as a Daemon (*nix service). Then, I tried the solution and it worked well. I would explain the steps of how to forever my sails app in EC2, in the next section,

Run the deployed app as a running daemon in the EC 2 Instance

  1. Install forever globally:
    npm -g install forever
  2. In the terminal connected to the EC2 Instance, change directory to the sails.js app’s root folder then run this command:
    forever start -ae errors.log app.js --dev --port 1337

    OR, run this command if you wish to run the production version:

    forever start -ae errors.log app.js --prod --port 80
  3. If you write your controllers as coffee script files, open the errors.log file. Notice that there is error message written in it ( This means the sails.js app is failing to be lifted by running prior command. This is a known issue in Sails.js version 0.9.16. This issue has been raised to balderdashy and it can be seen in this link, along with the temporary workaround as well :
  4. Logout or disconnect from the EC2 instance’s SSH session and then browse to your lifted sails.js app’s url. Confirm that your lifted app is still up & running now.
The previous section marks the end of this article. I hope this ‘how-to’ guide would help you deploying your sails.js web app on your AWS account. Happy sailing in your AWS cloud.

Creating a Phonegap-Android Application Development Project on Intellij IDEA 12

Creating an Android mobile application could be a tedious one when you need to build rich UI elements on your application. This could be a real problem if your UI designers have adequate or good HTML & CSS skillsets but have little to none knowledge of working with Android XML pages. Another problem arise when there is a requirement to ship your mobile app to support other mobile platforms such as iPhone, Win RT, Blackberry, etc beside on the Android platform. You would need to spend more time, resources & efforts  for Designing, Developing, Testing & Shipping your app across multiple mobile platforms which could hurt your budget.

There is a workaround to solve these. Thanks to people whom were involved in Apache Cordova project, a library named “Phonegap” was born to the rescue. Phonegap is a java library that enable Android runtime to load & display HTML pages ( along with their CSS styles ) and also enable the runtime executing Javascript files as well in an Android application. Due to this feature, UI Designer is freed from working with tedious Android XML pages and able to use their current HTML+CSS+JS skillsets for developing the app’s UI elements similar to pages in web application. Since the app is mainly built on top of HTML 5+CSS +JS, a mobile application which is built on top of Phonegap is also runable on other mobile platforms, such as iPhone, with minimum to none modifications to the original code.

So how would it be look like in a simple Hello World application ? I would show you the steps in this article on how to do it in my favourite Java IDE, the Intellij IDEA 12.


  • You have setup latest updates of JDK 6 or 7 in your machine. If you are a Linux Ubuntu’s user and have not done it yet in your environment, this article might be useful.
  • Ensure that you have setup Android SDK properly in your machine.
  • If you use Intellij IDEA like me, ensure that you have setup JDK & Android SDK settings in your IDEA.
  • Ensure that you have downloaded latest Phonegap’s library (By the time I write this post, the latest version is 2.7.0).

Enter the Steps:

    • Create a new Empty Project in the Intellij IDEA 12.
    • Add a new Android Application Module.
    • In the Android Module structure, create a new folder under ‘assets’ folder & name the new folder as ‘www’.
    • Copy Phonegap’s ‘cordova-x.x.x.js’ file into the ‘www’ folder.
    • Copy ‘cordova-x.x.x.jar’ into ‘libs’ folder.

    • Right click the ‘cordova-x.x.x.jar’ node & click ‘Add as library …’ option.
    • On the Create Library dialog, ensure that Name= cordova-x.x.x, Level = Project LIbrary, Add to Module = the Android Application Module then click [Ok].

    • Copy the Phonegap’s ‘xml’ folder where is located in <your phonegap root folder>\lib\android  into the ‘res’ folder.
    • Add a new HTML5 file into ‘www’ folder. This is the HTML file which is designated for the application’s main page.
    • Add a script line in the Head tag for referring to Phonegap’s javascript file.
      <!DOCTYPE html>
       <title>Demo Phonegap</title>
       <script type="text/javascript" charset="utf-8" src="cordova-2.7.0.js">
       <h2>Hello Android</h2>
    • Initially, our HomeActivity class is extended from Android’s Activity class. We need to modify it so that our HomeActivity class would be able to load & display our index.html page as the app’s main page. First, we’ll modify the class so that it is inherited from Phonegap’s DroidGap class. Secondly, we get rid the second line inside OnCreate method and replace it with a code that calls DroidGap’s loadUrl method. This is the code that is exactly doing the magic.
      package Demo.Phonegap.Application;
      import android.os.Bundle;
      import org.apache.cordova.DroidGap;
      public class HomeActivity extends DroidGap {
       * Called when the activity is first created.
       public void onCreate(Bundle savedInstanceState) {
    • Finally, we’ll modify the ‘AndroidManifest.xml’ file as in the following code snippet. Be advised, you might need to adjust the android:minSdkVersion option so that it match with the android version that has been used by your AVD or Physical Android Devices.
      <?xml version="1.0" encoding="utf-8"?>
      <manifest xmlns:android=""
       <uses-sdk android:minSdkVersion="16"/>
       android:anyDensity="true" />
       <uses-permission android:name="android.permission.VIBRATE" />
       <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
       <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
       <uses-permission android:name="android.permission.ACCESS_LOCATION_EXTRA_COMMANDS" />
       <uses-permission android:name="android.permission.READ_PHONE_STATE" />
       <uses-permission android:name="android.permission.INTERNET" />
       <uses-permission android:name="android.permission.RECEIVE_SMS" />
       <uses-permission android:name="android.permission.RECORD_AUDIO" />
       <uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />
       <uses-permission android:name="android.permission.READ_CONTACTS" />
       <uses-permission android:name="android.permission.WRITE_CONTACTS" />
       <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
       <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
       <uses-permission android:name="android.permission.GET_ACCOUNTS" />
       <uses-permission android:name="android.permission.BROADCAST_STICKY" />
       <application android:label="@string/app_name" android:icon="@drawable/ic_launcher">
       <activity android:name="HomeActivity"
       <action android:name="android.intent.action.MAIN"/>
       <category android:name="android.intent.category.LAUNCHER"/>
    • Fire up your Android Virtual Device or connect your Android device into your development machine then build & run the project. You will see this if everything is alright.

Where do we go next from here ?

Of course, you could tell your Web Designers to get back working on the Rich UI elements you wish to put in your super-awesome mobile app, immediately😀 However, there is a drawback for you as a Java developer if you are going on this way. You would need to use lot of JS when you are coding the UI Logics. Your Java skill would be shifted from being used for developing the UI logics ( Activities , events) to your app’s backend development ( This is true if you goes to n-tier with your mobile app and you still want to use Java for developing your app’s backend services ).
Another situation that you should consider is when you have no UI Designers in your team due to limited budget, for example. This should not stop you from using Phonegap. 3rd party vendors like Telerik or Community have created wonderful UI framework that would sit tight & nice with Phonegap, such as Telerik’s Kendo UI or Jquery Mobile. In the upcoming articles, i would present you about how to integrate these UI Frameworks with android & Phonegap through using a little bit advanced problem sample than a simple ‘Hello World’ app. Or extending them further by integrating cool JS framework like Durandaljs😀 So, stay tuned, My Friends🙂

Setup Latest Oracle JDK on Ubuntu Linux

Most of people understand that installing Oracle JDK & JRE on their Windows machine is mostly easy like eating peanuts ( Well, they might still need to setup JAVA_HOME variable & update their PATH variable though). It can be turned out to be a problem when due to some case they need to move from Windows to Linux development environment, such as Ubuntu Linux. In this HOW TO article, i’ll cover the steps for setting up the JDK on Ubuntu Linux. I hope it would be useful for anyone whom are still having problem with it.

  • Open a terminal window (press CTL+T) and run these commands in order (we’ll assume that we are going to install JDK version 7 ):
    1. sudo add-apt-repository ppa:webupd8team/java
    2. sudo apt-get update
    3. sudo apt-get install oracle-java7-installer
  • If you wish to remove the JDK from your machine, run this command in the terminal box:
    sudo apt-get remove oracle-java7-installer
  • Should you need to upgrade your current JDK version to the latest one, you could try running this command and see if it would work:
    sudo update-java-alternatives -s java-7-oracle
  • If the prior command does not work then you could remove your current JDK and re-install the latest one using prior steps as the last resort.

Those are the steps that I always follow when setting up JDK on my Ubuntu machine. Until the time I written this post, i still found no problem when using it on my Intellij IDEA 12.1,  working for either Android application development or Play 2 based web application development.

HOW TO – Enable Play 2.0 Support in Intellij IDEA 12

The new version of Intellij IDEA has been released by Jetbrains. By the time i write this article, the version of IDEA that i use is 12.0.1. As a Play 2.1 developer, i got myself feel excited as Jetbrains has announced that the latest IDEA would support Play 2.0. However, the excitement wand off, turned into little bit disappointment as i found the feature came ‘half-baked’. Extra efforts needs to be performed in order to get the feature works on the new IDEA. I’m not sure if most of Play 2.0 developers known this issue and able to resolved it after taking some time to figure out. But in case you are a Player, an owner of Intellij IDEA 12.x copy and still struggling on how to get the feature working properly, i hope this ‘HOW  TO’ would help you resolve the issue. Please enjoy, Players.

General steps to install the Play 2.0 supports on IDEA 12:
1. Install & Enable Scala plugin.
2. Install & Enable Play 2.0 support plugins.
3. Restart the IDEA to get the new plugins work.
4. Create Play 2 app configuration.
5. Make & run the Play 2 project using the created Play 2 app configuration.

HOW TO – Install Scala Plugin & Play 2.0 support plugins:

1. Click [File] then [Settings] menu.
2. On the “Settings” dialog, select ‘Plugins’ where is placed under ‘– IDE Settings –’ section.
3. Click [Browse Repositories…] where is placed at the bottom of ‘Plugins’ right side panel.


4. On the Browse Repositories dialog, type ‘scala’ in the small search text box where is placed at the righ-top corner of the dialog.
5. The result grid should display an item with name ‘Scala Custom Languages’, double click this item to install the plugin. The plugin’s size is 23 megs, it might take a while for IDEA to download & install it.



6. To install the play 2.0 plugins, type ‘Play 2.0 support’ in the search text box and double click the result.


HOW TO – Enable play framework support on settings menu:

1. Click [File] then [Settings] menu.
2. Select ‘Play Configuration’ where is placed under ‘–Project Settings [your project’s name] –’.
3. On the Play Configuration panel section, enter the root folder of your play 2.x binaries ( e.g. D:\Java\Play-2.1rc), enter the working directory of your play 2 project (e.g. E:\PROJECTS\JAVA\Demo.Play.SocMed) and tick ‘Show on console run’ option.
4. Click [Apply] and [Ok].


5. Restart your Intellij IDEA & then re-open your play project in the restarted IDEA.

HOW TO – Create Play 2 App Run/Debug configuration:
1. Click [Run] then [Edit configurations…] menu.
2. On the Run/Debug Configurations dialog, click the greenish ‘+’ icon on the top-left corner of the dialog.

3. Click ‘Play 2 app’ option in the drop down menu. Confirm that a new option ‘Unnamed’ is created under ‘Play 2 App’ section on the left panel.
4. Rename the play 2 app config then click [Apply], [Ok].


5. Press [CTL+F5] to run the play project or [ALT+F5] to debug play project.




Tutorial Pemrograman CUDA – Inisialisasi

Pada artikel ini, saya akan mengulas salah satu fase dari pemrograman komputasi pararel menggunakan CUDA API, yaitu Inisialisasi Divais CUDA. Fase ini umumnya dijalankan aplikasi di awal – awal sebelum aplikasi mengeksekusi kernel – kernel CUDA ( Misal di baris – baris awal implementasi method main ). Tujuannya adalah untuk mendeteksi ada/tidaknya divais yang mendukung CUDA ( VGA/GPU Nvidia GeForce 8xxx keatas ) serta memilih divais CUDA yang akan digunakan oleh API CUDA. CUDA API memiliki 2 cita rasa , yaitu Driver API & CUDA C. Mengingat kompleksnya ( low level )Driver API & motivasi saya yang ingin memberdaya gunakan pengetahuan bahasa C saya, maka di tutorial ini ( & yang akan datang ), saya memilih menggunakan CUDA C sebagai API di kode tutorial ini.


  • Pengetahuan pemrograman C dasar ( forward declaration, method, pointer, passing method parameter by reference, header & source file, #include directive, dsb )
  • Visual Studio 2008 SP1 ( atau/dan Visual Studio 2010) dengan Visual C++ terinstall di dalamnya.
  • CUDA Toolkit versi 3.2 atau lebih tinggi. Untuk tutorial instalasi nya dapat di simak di artikel ini.

Mari kita mulai

    • Method InitializeCudaDevice

Kita akan mendefinisikan kode ini sebagai method C global, dengan nama InitializeCudaDevice. Berikut adalah deklarasi method ini:

// Forward declarations
bool InitializeCudaDevice( int* numberDevices );

Tulis kode di atas pada file header baru (.h), beri nama sembarang ( misal: CudaUtility.h ). Method ini mengembalikan nilai boolean true bila inisialisasi divais CUDA berhasil lalu memilih divais pertama sebagai divais yang akan di gunakan CUDA API. Parameter pass-by-reference ( pointer integer ) numberDevices akan di isi jumlah divais CUDA yang terdeteksi bila inisialisasi berhasil ( misal : *numberDevices = 2 bila terdeteksi 2 GPU GeForce terinstal ).

Berikut adalah pseudocode dari implementasi method ini:

1. Dapatkan jumlah CUDA devices, bila tidak ada CUDA Devices yang terpasang/gagal maka kembalikan nilai false.

2. Set device CUDA pertama untuk di gunakan kernel CUDA, bila gagal kembalikan nilai false.

3. Kembalikan nilai true, sampai disini dapat di nyatakan bahwa inisialisasi divais CUDA telah berhasil.

Pertama kali, tambahkan file source code C++ baru (.cpp ), beri nama sembarang ( misal: CudaUtility.cpp ). Tulis kode deklarasi penggunaan file header kita di atas dan CUDA runtime API (<cuda_runtime_api.h>). Tulis juga kerangka implementasi method InitializeCudaDevice ini.

#include &lt;cuda_runtime_api.h&gt;
#include "CudaUtility.h";

/// Initialize CUDA
/// Returns TRUE if initialization is success, otherwise FALSE.
bool InitializeCudaDevice( int* numberDevices ){
	// Get number of CUDA Supported device

	// Set device 0 to be used as current GPU's execution

	// Initialization is success.
	return true;

Di dalam method ini, tulis kode untuk mendapatkan jumlah divais CUDA yg terpasang dengan memanggil method CUDA API cudaError_t cudaGetDeviceCount(int* numberDevices). Method ini akan mengembalikan nilai enumerasi cudaSuccess bila berhasil dan parameter pass-by-reference numberDevices akan terisi jumlah divais CUDA yang dapat dikenali. Pada baris ini, kita akan check apakah pemanggilan method cudaGetDeviceCount berhasil/tidak dan apakah jumlah divais CUDA yg dapat dikenali lebih dari 0 / sebaliknya. Bila 2 kondisi ini tidak terpenuhi, maka dapat kita nyatakan inisialisasi gagal.

	// Get number of CUDA Supported device
	if ( ( cudaGetDeviceCount(numberDevices) != cudaSuccess ) || ( *numberDevices  &lt; 1) ){
		// If there is no CUDA Supported device presents, return FALSE from here.
		return false;

Langkah selanjutnya adalah memanggil CUDA API (cudaError_t cudaSetDevice( int deviceId )) untuk memilih divais CUDA pertama ( divais 0 ) sebagai divais yang akan di gunakan oleh CUDA API dan kernel – kernel CUDA di dalam aplikasi kita nantinya. Bila pemanggilan method ini mengembalikan nilai yang selain cudaSuccess, dapat kita nyatakan inisialisasi gagal.

	// Set device 0 to be used as current GPU's execution
	if ( cudaSetDevice(0) != cudaSuccess ){
		// Unable to use 1st CUDA Device
		return false;

Berikut implementasi lengkap method inisialisasi divais CUDA ini

#include &lt;cuda_runtime_api.h&gt;
#include "CudaUtility.h";

/// Initialize CUDA
/// Returns TRUE if initialization is success, otherwise FALSE.
bool InitializeCudaDevice( int* numberDevices ){
	// Get number of CUDA Supported device
	if ( ( cudaGetDeviceCount(numberDevices) != cudaSuccess ) || ( *numberDevices  &lt; 1) ){
		// If there is no CUDA Supported device presents, return FALSE from here.
		return false;

	// Set device 0 to be used as current GPU's execution
	if ( cudaSetDevice(0) != cudaSuccess ){
		// Unable to use 1st CUDA Device
		return false;

	// Initialization is success.
	return true;
    • Contoh penggunaan – Aplikasi .NET Command Line

Buatlah sebuah project baru di dalam visual studio .NET, pilih : Visual C++ -> CLR -> Console Application di dalam dialog new project. Set CUDA’s Customization Build, runtime library dan setting lainnya pada project ini ( di ulas di artikel ini). Buat file .h & .cpp baru dan tulis implementasi kode di atas ke dalam project ini. Berikut adalah kode contoh penggunaannya di dalam file main.cpp :

#include "stdafx.h"
#include "CudaUtility.h"

using namespace System;
using namespace System::Text;

int main(array ^args)
	// Initialize Cuda
	int numberOfDevices = 0;
	StringBuilder^ stringBuilder = gcnew StringBuilder();
	if ( InitializeCudaDevice(&amp;numberOfDevices) ){
		// If success , display the number of initialized devices to screen and success message
		stringBuilder-&gt;Append( L"CUDA Devices initialization is SUCCESS\n" );
		stringBuilder-&gt;Append( String::Format( L"Number of detected devices : {0}", numberOfDevices ) );
		// otherwise display failed initialization's message
		stringBuilder-&gt;Append( L"Initialization is FAILED" );
	stringBuilder-&gt;Append( L"\n\nPress enter to exit..." );
	Console::Write( stringBuilder-&amp;gt;ToString() );
    return 0;

Kode keseluruhan yg di ulas dalam artikel ini dapat di ambil dari url Subversion berikut ini : Selamat mencoba🙂

Tutorial – Instalasi Nvidia CUDA Toolkit pada Visual Studio 2010

Pada artikel tutorial ini, saya akan mengulas langkah – langkah instalasi CUDA Toolkit versi 3.2 pada Visual Studio 2010. Perlu di ketahui pembaca bahwa CUDA Toolkit versi 3.2 ini di build dengan menggunakan Visual C++ runtime versi 9.0 ( terdapat pada VS .NET 2008 ). Secara default, compiler C++ di toolkit ini ( nvcc ) tidak dapat digunakan bila kita coba membuild project kita di dalam Visual C++ 2010 ( Runtime C++ yg digunakan versi 10.0). Namun kendala ini dapat diatasi dengan melakukan cara instalasi yang akan di ulas berikut ini.


Unduh file-file instalasi berikut ini:

Unduh installer yang sesuai dengan jenis OS & GPU yg di pakai oleh mesin anda ( 32 bit / 64 bit OS; GeForce/Quadro GPU). Untuk Parallel NSight, ada 2 installer yang harus di unduh yaitu Parallel Nsight Host dan Parallel Nsight Monitor.

Tautan pengunduhan NSight
Tautan pengunduhan NSight

Begitupun pada CUDA Toolkit, unduh installer yg sesuai dengan OS mesin anda ( 32 bit/64 bit )

Halaman unduh CUDA Toolkit
Halaman unduh CUDA Toolkit


Sebelum meng-instal file – file yang telah diunduh, pastikan bahwa anda sudah menginstal Visual Studio 2008 SP1 di mesin anda. Lakukanlah instalasi dengan urutan : Nsight Host -> NSight Monitor -> CUDA Toolkit 3.2. Matikan juga aplikasi Visual Studio yang aktif sebelum instalasi di mulai. Pada dialog instalasi , cukup tekan tombol Next; isi nama, email pada window registrasi dan pilih jenis instalasi Typical / Complete.

Instalasi - Jendela registrasi user
Instalasi - Jendela registrasi user

Menambahkan extensi file .cu ( kernel CUDA ) di VS .NET

Pada menu bar VS .NET, klik Tools -> Options untuk membuka jendela Options. Di jendela ini, buka node treeview Text Editor, pilih File Extension. Di textbox berlabel Extension, ketik .cu. Klik kotak kombo Editor, pilih entry Microsoft Visual C++. Klik tombol Apply. Klik tombol Ok.

Regstrasi file CUDA ( .cu ) pada VS .NET
Regstrasi file CUDA ( .cu ) pada VS .NET

Menyeting & mengkompilasi project CUDA

  • Buat solution kosong yang baru. Tambahkan project baru di dalam solusi yg di buat. Pilih jenis project CLR->Class Library untuk menanmbahkan project .NET DLL ke dalam solution. Alasan dipilihnya project .NET DLL pada tutorial ini karena penulis ingin menguji apakah solusi CUDA ini dapat di integrasikan dengan aplikasi .NET.
    Membuat project DLL .NET ke dalam solution
    Membuat project DLL .NET ke dalam solution
  • Mengaktifkan CUDA’s Build Customization – Pada menu bar VS .NET, klik Project -> Build Customizations… untuk memunculkan jendela Visual C++ Build Customization Files. Centang pilihan CUDA 3.2(.targets, props) lalu klik tombol Ok. Entry ini akan di tampilkan bila proses instalasi NSight & CUDA Tools berhasil dan sesuai dengan langkah – langkah sebelumnya.
    Mengaktifkan Custom Build CUDA pada project yang di pilih.
    Mengaktifkan Custom Build CUDA pada project yang di pilih.
  • Buka halaman property project .NET C++ -nya, pilih node Configuration Properties -> General lalu di panel kanan jendela property, ubah nilai entry Platform Toolset yang semula v100 menjadi v90. Klik tombol Apply.
    Mengubah Platform Toolset
    Mengubah Platform Toolset
  • Masih pada jendela Property Pages, pilih node Configuration Properties -> Linker -> Input, lalu di panel kanan jendela property, tambahkan nilai cudart.lib; pada entry Additional Dependencies. Klik tombol Ok pada jendela ini.
    Menambahkan referensi ke Library Runtime CUDA
    Menambahkan referensi ke Library Runtime CUDA
  • Ubah target .NET Framework project ke versi 3.5 – Unload terlebih dulu project ini dengan cara klik kanan node project, klik menu item Unload project pada pop up menu. Klik kanan kembali node project yang telah di unload, lalu klik pilihan Edit .vcxproj pada menu pop up untuk memulai editing file project ini secara manual. Ubah nilai di dalam tag xml TargetFrameworkVersion dari yang semula 4.0 ke 3.5. Save file ini lalu load kembali project ini.
    Mengubah Versi .NET Framework dari Project .NET DLL
    Mengubah Versi .NET Framework dari Project .NET DLL
  • Tambahkan file baru pada project .NET DLL ini, berekstensi .cu dengan nama sembarang ( misal: ). Biarkan kosong terlebih dahulu isi file .cu ini. Save semua perubahan, lalu build project ini. Berikut adalah isi panel output build bila kompilasi berhasil. Selamat mencoba🙂

    1>------ Rebuild All started: Project: Excercise.Cuda.ManagedKernel, Configuration: Debug Win32 ------
    1> E:\PROJECTS\Excercise.Cuda\Excercise.Cuda.ManagedKernel>"C:\Program Files\NVIDIA GPU Computing Toolkit\CUDA\v3.2\\bin\nvcc.exe" -ccbin "C:\Program Files (x86)\Microsoft Visual Studio 9.0\VC\bin" -I"C:\Program Files\NVIDIA GPU Computing Toolkit\CUDA\v3.2\\include" -G0 --keep-dir "Debug\\" -maxrregcount=32 --machine 32 --compile -D_NEXUS_DEBUG -g -Xcompiler "/EHsc /nologo /Od /Zi /MDd " -o "Debug\MathKernel.obj" "E:\PROJECTS\Excercise.Cuda\Excercise.Cuda.ManagedKernel\Kernels\" -clean
    1> Compiling CUDA source file Kernels\
    1> E:\PROJECTS\Excercise.Cuda\Excercise.Cuda.ManagedKernel>"C:\Program Files\NVIDIA GPU Computing Toolkit\CUDA\v3.2\\bin\nvcc.exe" -gencode=arch=compute_10,code=\"sm_10,compute_10\" --use-local-env --cl-version 2008 -ccbin "C:\Program Files (x86)\Microsoft Visual Studio 9.0\VC\bin" -I"C:\Program Files\NVIDIA GPU Computing Toolkit\CUDA\v3.2\\include" -G0 --keep-dir "Debug\\" -maxrregcount=32 --machine 32 --compile -D_NEXUS_DEBUG -g -Xcompiler "/EHsc /nologo /Od /Zi /MDd " -o "Debug\MathKernel.obj" "E:\PROJECTS\Excercise.Cuda\Excercise.Cuda.ManagedKernel\Kernels\"
    1> tmpxft_000010ac_00000000-11_MathKernel.ii
    1> Stdafx.cpp
    1> AssemblyInfo.cpp
    1> Generating Code...
    1> Microsoft (R) Windows (R) Resource Compiler Version 6.1.6723.1
    1> Copyright (C) Microsoft Corporation. All rights reserved.
    1> Excercise.Cuda.ManagedKernel.vcxproj -> E:\PROJECTS\Excercise.Cuda\Debug\Excercise.Cuda.ManagedKernel.dll
    ========== Rebuild All: 1 succeeded, 0 failed, 0 skipped ==========

Tutorial Web Service Software Factory – Modelling Edition ( For Dummies – Part 2)

Tutorial WSSF – Bagian 2:

Pada artikel bagian – 1, telah di bahas langkah – langkah bagaimana membuat sebuah model komponen WCF yang hendak kita kembangkan. Model yang kita buat belum dapat dikompilasi. Project – project implementasi beserta file – file source code .cs & konfigurasi aplikasi harus di generate terlebih dahulu. Melalui artikel bagian 2 ini, kita akan membahas langkah – langkah Code Generation dari WSSF ini.

Validasi Model

Model yang telah dibuat perlu di validasi terlebuh dahulu. Hal ini bertujuan agar source code yang di generate tidak menyebabkan error pada saat di kompilasi. Untuk melakukan validasi ini, cukup di lakukan dengan meng-klik tombol kanan mouse di bagian kosong lembar desain hingga muncul pop-up menu, lalu click Validate All.

validate model

Setelah proses validasi selesai, beberapa informasi kesalahan pada model yang kita buat akan di tampilkan di dalam jendela Output. Pada tahap ini kita dapat segera memperbaiki kesalahan yang ada terkecuali 1 kesalahan yang menjelaskan bahwa “property ProjectMappingTable kosong”. Pesan kesalahan yang satu ini dapat di abaikan mengingat properti akan terisi otomatis setelah code generation selesai.

fix error on a model

Pada cuplikan gambar diatas, proses validasi menemukan kesalahan pada model requestMessage karena salah satu propertinya harus di set dengan nilai yang benar. Untuk mengeditnya select model yang bersangkutan, tekan tombol F4 untuk menampilkan property sheetnya, lalu ubah nilai property yang dimaksud. Setelah selesai, coba validasi semua model kembali.

Memilih Teknologi Implementasi

Code yang hendak di generate harus ditentukan jenis teknologi implementasinya. WSSF memberikan 2 pilihan untuk ini, yaitu WCF extension & ASMX extension. Mengingat service yang akan kita buat adalah WCF service, maka kita memilih WCF Extensions. Untuk Data serializer nya kita pilih DataContractSerializer.

choose implementation technology serializer type

Men-generate struktur project implementasi

Berikutnya kita akan mencoba men-generate project implementasi dengan melakukan langkah berikut ini. Buka jendela solution explorer kembali, select node Solution, klik tombol kanan mouse untuk memunculkan menu pop up. Pada menu pop up, click pilihan Add -> WCF Implementation Projects. Tunggu sesaat hingga proses projects generation selesai.generate wcf implementation

Sebuah jendela Add New Project akan tampil dengan item WCF Implementation Projects terpilih. Ketik nama project implementasi yang di kehendaki lalu akhiri dengan menekan tombol OK.Selanjutnya tunggu beberapa saat hingga proses Code Generation selesai.

confirm code generation

Kita dapat melihat di dalam Solution Explorer bagaimana WSSF memisah solusi implementasi menjadi beberapa project. Hal ini sebagai representasi framework dari WSSF dalam menyusun implementasi kode menjadi beberapa layer. Selain project implementasi, WSSF juga men-generate beberapa project yang dapat di gunakan untuk test hosing, client & unit tests.generated projects structure

Project – project di dalam folder Service Interface masih belum memiliki kode implementasi. Untuk men-generate kode implementasinya lakukan langkah berikut ini. Buka lembar desain model kembali, lalu klik kiri bagian kosong dari lembar desain, tekan tombol F4 untuk menampilkan Property Sheet dari model. Pada jendela Property, ubah nilai properti Project Mapping Table dengan nilai yang muncul di combo box. Klik kanan kembali lembar desain hingga muncul menu pop up. Klik item Generate Code.generate code

Bila code generation berhasil, beberapa file akan di tambahkan ke dalam project x2 di bawah node service interface. Beberapa hal yang perlu di perhatikan dalam Code Generation di WSSF ini adalah Re-generasi kode akan menimpa hasil generasi kode sebelumnya. Jadi berhati – hati lah bila anda hendak melakukan code generation kembali. Code Generation dapat di lakukan sebagian , misal hanya pada model yang di pilih saja.generated wcf codes

Akhirnya penjelasan langkah Code Generation diatas menutup artikel WSSE bagian ke -2 ini. Pada lain kesempatan saya akan paparkan contoh implementasi & unit testing dari hasil Code Generation tersebut. Salam Coder.

Tutorial Web Service Software Factory – Modelling Edition ( For Dummies )

Tutorial WSSF – Bagian I:

WSSF ( Web Service Software Factory ) Modelling Edition adalah plugin Visual Studio .NET 2005/2008 yang berfungsi untuk membuat project pengembangan aplikasi WCF dengan menyertakan fasilitas modeling hingga code generation di dalamnya. Add on ini dikembangkan oleh komunitas opensource di Codeplex ( dan gratis . Pada artikel ini akan dijelaskan langkah – langkah instalasi WSSF hingga contoh penggunannya yang sederhana.


Unduh paket instalasi WSSF Modelling Edition di situs MSDN atau Codeplex, lalu klik / run paket instalasi tersebut. Sebelum menginstalnya, pastikan anda telah menginstal komponen Guidance Automation Extensions – February 2008 Release di komputer anda. Ikuti petunjuk instalasi hingga selesai.

Project modeling WCF

Pembuatan project Model service menggunakan WSSF di jelaskan melalui langkah – langkah berikut ini :

  • Jalankan Visual Studio .NET anda, klik File->New->Project pada menu utama untuk menampilkan dialog pembuatan project baru. Pada dialog New Project pilih Service Factory : Modeling Edition di dalam treeview Project Types. Pada listbox Templates pilih Model Project, ketik nama project, tentukan lokasi project lalu klik tombol Ok.
    new project wssf
    new project wssf

    Klik Tools->Guidance Package Manager->Enable/Disable Package melalui menu utama untuk memastikan Guidance Package WSSF telah di aktifkan. enable wssf package

  • Buat model baru dengan melakukan langkah berikut ini. Tampilkan jendela geser SolutionExplorer, klik tombol kanan mouse untuk menampilkan pop up menu, klik Add->New Model .add new model
  • Model pertama yang akan kita buat adalah Service Contract. Pada dialog New Model, pilih Service Contract Model , ketik nama Model (contoh : UserManager), ketik XML Namespace dari model (contoh : urn:latihan.UserManager.ServiceContracts). Perhatikan format namespace ini, sesuaikan dengan contoh dibawahnya. Setelah selesai, klik tombol Finish.create service model
  • Pada SolutionExplorer, dobel klik model ServiceContract yang telah kita buat untuk menampilkan lembar desain & jendela Toolbox.model design page
  • Berikutnya kita akan mulai memodelkan service yang akan kita buat. Dimulai dari meletakan komponen Service model dari Toolbox ke lembar desain utama. Ubah nama Service dengan cara meng-klik label service pada permukaan komponen lalu ketik nama yg diinginkan.add service model component
  • Menyusul kita tambahkan sebuah model service-contract lalu kita hubungkan dengan model service-nya menggunakan komponen Connector dari toolbox.add service contract
  • Kita tambahkan juga sebuah model Operation pada model Service Contract yang telah kita buat.add operation
  • Pada model Operation kita tambahkan model Request Message.Request Message adalah message yg berfungsi sbg input parameter dari operation. Perhatikan pada konektor request message, arah panah konektor menunjuk ke operation.add request message
  • Untuk menambahkan parameter – parameter input pada message, klik kanan model Message, sebuah popup menu akan muncul dan memberikan pilihan untuk menambah message part ( parameter ). Untuk contoh ini, tambahkan 2 buah Primitive Message Part lalu ketik nama mereka.add message parts
  • Tambahkan sebuah message lagi ke dalam desainer, hubungkan message ini dengan model operation. Pastikan arah konektor mengarah ke message baru ini. Ini adalah message reponse yg akan mengembalikan return value dari model operation. Tambahkan juga message part nya.add response messageSampai disini kita telah memiliki sebuah model lengkap dari komponen web service sederhana ini yang hendak kita bangun. Pada artikel bagian -2 akan di bahas langkah – langkah menggenerate code dari model ini. Salam.

Tutorial Instalasi Driver VGA Card ATI di Linux

Menginstal driver periferal PC kita di Linux, memang gampang – gampang susah.Walaupun vendor periferal sudah menyediakan installer drivernya untuk di download lalu tinggal di execute saja. sering dijumpai instalasi driver tidak memberikan hasil yang semestinya. Tidak terkecuali hal ini terjadi pada installer driver Display Adapter ber-chipset ATI. Vendor ini sudah menyediakan driver Linux untuk produknya, dan instalasinya semudah execute sekali ikuti petunjuk pada wizard lalu segalanya akan berjalan mulus. Salah satu permasalahan yang dijumpai penulis adalah instalasi dengan menggunakan installer bawaan driver ini, gagal mengaktifkan fitur 3D acceleration dari chip ATI Display Adapter penulis. Apabila pembaca menemui masalah yang sama seperti yang dialami penulis, tutorial pada artikel ini mungkin bisa membantu anda menginstal driver ATI & berhasil mengaktifkan 3D Acceleration Display adapter anda.

Cara instalasi Display Driver ATI di linux :

Ø Setelah mendownload paket driver ATI dari situs, melalui paket tersebut (contoh :, harus di bangun dahulu paket instalasi driver ATI dlm bentuk RPM -nya yang sesuai dengan Distro Linux yang anda pakai. Katakanlah dalam tutorial ini kita gunakan distro Open SuSE 10.2.

Langkah – langkah pembuatan paket instalasi RPM ini adalah sebagai berikut :

û Login ke system sebagai root dahulu ke dalam mode Command Line Console

û Melalui layar console ini, ketikkan command line seperti berikut ini :

localhost:~/installers/Drivers # ./ati*.run –listpkg

command di atas akan menampilkan list nama – nama distro beserta versinya yang di support   oleh paket installer driver ATI ini. Dari list tersebut, dapat kita kenali kalau paket installer driver  ATI yang cocok untuk di instal di mesin Open SuSe 10.2 kita, di beri kode


Catat di kertas atau di ketik di dalam aplikasi text editor seperti Kate,kode diatas

û Masih pada terminal window, ketikkan command :

localhost:~/installers/Drivers # ./ati*.run –buildpkg SuSE/SUSE102-IA32

Command di atas adalah command untuk membangun paket RPM instalasi driver ATI untuk   Linux Distro Open Suse Versi 10.2. Bila perintah diatas berhasil di jalankan, sebuah file .rpm baru dapat kita lihat di dalam direktori tempat kita membangun paket instalasi RPM ini. Contoh  nama file rpm ini : fglrx_7_1_0_SUSE102-8.35.5-1.i386.rpm

Sampai langkah awal ini, selesailah langkah pembangunan paket RPM instalasi driver ATI di    Linux ini.

Ø Setelah paket instalasi RPM driver ATI yang cocok telah berhasil dibuat, langkah berikutnya adalah melakukan instalasi driver ini dengan menggunakan command rpm . Tapi sebelunya pastikan dahulu bahwa paket – paket software di bawah ini telah diinstal di mesin Linux kita. Fitur 3D Acceleration tidak dapat dinikmati setelah instalasi driver, bila paket – paket software ini belum terinstal semua dengan baik.

û kernel-source, ini adalah source code dari Distro Linux yang kita pakai

û gcc, System GNU C Compiler, dibutuhkan oleh paket instalasi RPM untuk merecompile source kernel distro linux kita

Bila software – software di atas sudah diinstal, berikutnya instalasi driver dapat di laksanakan dengan  mengetikan command di bawah ini :

localhost:~/installers/Drivers # rpm -Uvh fglrx*.rpm

Amati pesan kegagalan pada layar, apakah ada atau tidak. Bila tidak ada, maka driver telah diinstal  dengan sukses. Cara lain untuk mendeteksi apakah driver telah terinstal dengan benar & mode 3D  Acceleration telah aktif, jalankan command :

localhost:~/installers/Drivers # fglrxinfo

Apabila 3D Acceleration berhasil di hidupkan, command diatas akan memunculkan info status chipset  Display Adapter ATI yang terinstal di komputer anda sbb :

OpenGL vendor string: ATI Technologies Inc.

OpenGL renderer string: ATI Radeon Xpress Series

OpenGL version string: 1.2 (2.0.6400 (8.35.5))

Sampai langkah ini, instalasi driver ATI pada Linux dapat di katakan telah berhasil. Pada artikel yang lain akan dibahas konfigurasi XGL, desktop 3D X-Windows serta Beryl, add-on untuk XGL yang membawa kemewahan pesona & efek 3D pada desktop Linux Anda & sedang mewabah saat ini. Selamat Mencoba🙂