AdityaDees: web development

Hot

https://publishers.chitika.com/

Contact us for advertising.
Showing posts with label web development. Show all posts
Showing posts with label web development. Show all posts

13 May 2014

Memanfaatkan Facades pada Framework Laravel

18:25 0
"Facades provide a "static" interface to classes that are available in the application's IoC container."

Terjemahan bebas dari saya adalah Facades menyediakan antar muka static pada semua kelas yang ada dalam Laravel, biasanya Model. Untuk lebih mengerti mengenai apa itu Inversion of Control (IoC) container dan Facade silahkan anda membaca artikel karya Edd Mann yang berjudul
How Static Facades and IoC are used in Laravel. Salah satu fitur menarik dari framework Laravel adalah Facades, Facade ada dimana-mana pada Laravel, bahkan tanpa sadar kita juga sudah sering menggunakannya, misalnya statement View::make('form'), Redirect::to('front'), Input::get('nama'), dsb. Misalnya kita memiliki sebuah kelas model dalam aplikasi Laravel kita seperti ini:



namespace AhliInformasi;
class Pustakawan {
/**
* Ambil semua data Pustakawan
*/
public function semuaPustakawan($offset=0, $limit=100) {
return DB::table('pustakawan')->select(DB::Raw('id,
nama_pustakawan,
tingkatan.nama as tingkatan_pustakawan,
status.nama as status_pustakawan,
email_pustakawan,
foto_pustakawan'))
->join('tingkatan', 'pustakawan.tingkatan', '=', 'tingkatan.id')
->join('status', 'pustakawan.status', '=', 'status.id')
->orderBy('login_terakhir', 'desc')->skip($offset)->take($limit);
}

/**
* Ambil detail data Pustakawan
*/
public function seorangPustakawan($id_nya) {
return DB::table('pustakawan')->where('id', '=', $id_nya)->first();
}
}


Model tersebut kita simpan dengan nama AhliInformasi/Pustakawan.php (karena kita menggunakan namespace disini)
dalam direktori model. Nah biasanya ketika kita memanggil model ini di controller kita melakukannya dengan seperti ini:



class PustakawanController extends BaseController {
/**
* Ambil semua data Pustakawan
*/
public function lihatSemuaPustakawan($offset=0, $limit=100) {
$pustakawan = new \AhliInformasi\Pustakawan;
$view_data['data_pustakawan'] = $pustakawan->semuaPustakawan($offset, $limit);
return View::make('ahliinformasi.index', $view_data);
}
}

Dengan memanfaatkan Facades kita bisa lebih mempersingkat pemanggilan model kita sekaligus
lebih ekspresif dan juga lebih mudah di-tes. Untuk menjadikan model kita menjadi Facade maka
kita akan menambahkan sedikit kode, yang pertama adalah "mengikat" atau bahasa kerennya
binding model kita sebagai IoC Container. Cara paling elegan adalah dengan menambahkan
Service Provider:



namespace AhliInformasi;
use Illuminate\Support\ServiceProvider;
class PustakawanServiceProvider extends ServiceProvider {
public function register()
{
$this->app->bind('pustakawan', function()
{
return new \AhliInformasi\Pustakawan;
});
}
}

Simpan file dengan nama PustakawanServiceProvider.php pada direktori model/AhliInformasi. Kemudian tambahkan juga implementasi kelas Facade kita dengan kode berikut ini:



namespace AhliInformasi;
use Illuminate\Support\Facades\Facade;
class PustakawanFacade extends Facade {
protected static function getFacadeAccessor() { return 'pustakawan'; }
}

Kemudian simpan dengan nama PustakawanFacade.php pada direktori model/AhliInformasi. Langkah selanjutnya adalah me-register Service Provider dan Facade kita pada file konfigurasi config/app.php, dengan menambahkan:



'providers' => array(

'Illuminate\Foundation\Providers\ArtisanServiceProvider',
'Illuminate\Auth\AuthServiceProvider',
'Illuminate\Cache\CacheServiceProvider',
'Illuminate\Session\CommandsServiceProvider',
...
'AhliInformasi\PustakawanServiceProvider' // tambahkan ini

),
...
'aliases' => array(

'App' => 'Illuminate\Support\Facades\App',
'Artisan' => 'Illuminate\Support\Facades\Artisan',
'Auth' => 'Illuminate\Support\Facades\Auth',
'Blade' => 'Illuminate\Support\Facades\Blade',
'Cache' => 'Illuminate\Support\Facades\Cache',
'ClassLoader' => 'Illuminate\Support\ClassLoader',
...
'Pustakawan' => 'AhliInformasi\PustakawanFacade' // tambahkan ini
),

Terakhir jangan lupa untuk men-generate ulang file autoload.php agar kelas-kelas kita yang baru kita buat
dikenali langsung oleh aplikasi (tanpa harus include/require manual), dengan menjalankan perintah berikut
dengan menggunakan terminal pada direktori root aplikasi Laravel:



composer dump-autoload

Jujur sebenarnya saya juga bingung kenapa harus melakukan proses dump-autoload, karena seharusnya semua kelas yang ada
di dalam direktori model secara otomatis di-load oleh Laravel pada saat proses bootstrap,
tetapi ketika saya tidak melakukan proses ini muncul error kelas Service Provider tidak ditemukan.
Selanjutnya dan seterusnya untuk memanggil model Pustakawan kita bisa langsung memanggilnya melalui
Facade kita dengan seperti ini:



class PustakawanController extends BaseController {
/**
* Ambil semua data Pustakawan
*/
public function lihatSemuaPustakawan($offset=0, $limit=100) {
$view_data['data_pustakawan'] = Pustakawan::semuaPustakawan($offset, $limit);
return View::make('ahliinformasi.index', $view_data);
}
}

Nah itu penjelasan mengenai Facades pada Laravel, semoga bermanfaat!

Read More

13 April 2014

An (Relatively) Easy Way for Installing Social Feed Manager on Mac OSX

15:45 0

On Monday, March 24, 2014 at Code4Lib 2014 Conference in Raleigh, North Carolina, i was fortunate to get the opportunity to learn Social Feed Manager (SFM), directly from the developers, Daniel Chudnov, Daniel Kerchner and also Laura Wruber from George Washington University (thank you for all of you for patienly guide me to get SFM working). SFM is a django application for managing multiple feeds of social media data. It's been a long time i'm searching for this kind of software to grab social media feed from Twitter. I know that Twitter already provide an API to fetch tweets, but i'm too lazy to learn the API :D, so SFM is great solution for me.



This article will try to explain step by step on how to install SFM on Mac OSX. Why Mac OSX? because i use Mac OSX on Macbook Air everyday for my work. Currently at the time this article was written, i'm using Mac OSX version 10.7.5 (Lion) with latest update from Apple. Below are the specs of my Macbook Air:



Ok, lets get it started, before installing SFM on Mac OSX you NEED to have/install these requirements:


  1. A working (and fast if you have) Internet connection

  2. A Twitter account!

  3. Latest Xcode. After finished installing Xcode, open the Xcode.app and accept the Xcode license agreement.

  4. Latest PostgreSQL database server for Mac OSX. I prefer Postgres.app, "The easiest way to get started with PostgreSQL on the Mac" <- that's what they said about it, and i think it is true :)

  5. and after installing Xcode and PostgreSQL, you need to install Homebrew, a package manager similiar to apt on Ubuntu for Mac OSX.




After successfully installing above three softwares, now you must open Terminal application (press Command+Space button and type "Terminal" if you're too lazy to find it :D) and do the "geek typing" works :D. If you



First installing python package manager, "pip" by typing:

$ sudo easy_install pip



Second, you need to install python "virtualenv" package by typing:

$ sudo pip install virtualenv

with virtualenv you can localize all required python library dependacies only on project directory (in this case is SFM).



Now, we start to install the SFM itself by cloning the source code directly from the SFM GitHub repository by typing:

$ cd
$ git clone git://github.com/gwu-libraries/social-feed-manager.git
$ cd social-feed-manager

In this example, we install the SFM on our home directory. You will see that there is social-feed-manager directory on our home directory now.



Currently, we are inside the social-feed-manager directory. We will create a virtual environment directory inside this folder, and we name it ENV by invoking below commands:

$ virtualenv --no-site-packages ENV
$ source ENV/bin/activate

You will see there is something a bit different with our command shell, it is appended with "(ENV)" which means that we are already inside our python sandbox/virtual environment.





So far so good? Hopefully! :D. Don't worry we will see our SFM working in a few hour to go hahaha, just kidding, in a "few steps" to go. Next step is preparing our PostgreSQL database for SFM to store its data, so we will launch our Postgres.app application and click "Open psql" button to open "psql" terminal. On psql console type below commands:

CREATE USER sfmuser with createdb PASSWORD 'sfmuser_secret';
CREATE DATABASE sfmdb WITH OWNER sfmuser;

Remember we create a new database user/role named "sfmuser" with password "sfmuser_secret" and database named "sfmdb". We will use these values on SFM configuration file later.




Now go back to the first Terminal application where we installing SFM. We will install all python library dependancies needed by SFM such as Django, Django Social Auth, Oauth, and etc. using below command:

$ pip install -r requirements.txt

Just wait until all process finished, and if everything is running smooth you'll see like this:



Continue! now type the following commands:

$ cd sfm
$ cp sfm/local_settings.py.template sfm/local_settings.py
$ nano sfm/local_settings.py

Now you'll see that you're opening the local_settings.py file using nano text editor (yes, you can use another text editors to edit the file if you're allergic to nano), and you must edit some value inside it according to your twitter app configuration. To create your Twitter app, login to https://apps.twitter.com using your Twitter account and create new application in https://apps.twitter.com/app/new. Fill the new application form like mine below:

After creating your new Twitter application will get an API Key like this.






On local_settings.py you need to change these lines according to your database settings


DATABASES = {
'default': {
'ENGINE': 'django.db.backends.postgresql_psycopg2',
'NAME': 'sfmdb',
'USER': 'sfmuser',
'PASSWORD': 'sfmuser_secret',
'HOST': 'localhost',
'PORT': '5432',
}
}

You MUST also change below lines according to your Twitter app API settings
TWITTER_DEFAULT_USERNAME = 'YOUR TWITTER USERNAME'
TWITTER_CONSUMER_KEY = 'YOUR TWITTER API KEY'
TWITTER_CONSUMER_SECRET = 'YOUR TWITTER API SECRET'

Save the changes by pressing Control+X and then press Y (if you're using nano).




Now you must edit the wsgi.py file by typing these commands:

$ cp sfm/wsgi.py.template sfm/wsgi.py
$ nano sfm/wsgi.py

Remove "#" in front of lines like below and change the ENV line so it will be look like this :
import site
ENV = '/Users/arienugraha/social-feed-manager/ENV'
site.addsitedir(ENV + '/lib/python2.7/site-packages')

Don't forget to save the changes by pressing Control+X and then press Y (if you're using nano).



Next step we will create setup a database to be used by djago by typing this command

$ ./manage.py syncdb

You'll be asked to create superuser for SFM administration page (DON'T USE YOUR TWITTER USERNAME!). In this article i create superuser with username "admin" and password "admin". If everything went smooth you'll something like this:




Next run this:

$ ./manage.py migrate



Hoorrayyyy!!! we almost finished! Next we need to run the Django built in web server (yes, you don't have to use Apache or another web server for development and testing) so we can access SFM administration UI. Run below command

$ ./manage.py runserver

Open your web browser and go to http://localhost:8000/admin to access SFM administration UI. By default Django web server will run on port 8000. If you want Django to run on another port, say it port 9090, just run the command like this :
$ ./manage.py runserver 9090

and go to http://localhost:9090/admin on your web browser! You'll see something like this on your web browser if everything is OK :




Login with username we already create on previous "syncdb" step, in this example the username is "admin" and the password is "admin", and you'll see webpage like this:





Fiuuhhhh!!! now we have our SFM installed and we are ready to grab Twitter feeds we want. The question is HOW DO I GRAB THE FEEDS THAT I WANT? Relax bro, relax :D. Suppose we want to grab tweets from Twitter user named @slims_official, what we must do is adding her/his Twitter screen name on http://localhost:8000/admin/ui/twitteruser/add/ and fill it on Name form field like this:


then click "Save" button at the bottom of the screen. Now on Terminal, run this command to grab about 3200 latest tweets from this user:
$ ./manage.py user_timeline

and you'll see something like this on your Terminal screen:

You see that SFM grab 200 tweets each time from the latest to the older tweets.



That's it hopefully you will find this article useful. Next i will try to write an article on how to use/utilize feeds from SFM with PHP. (Please don't ask me about Python and Django, i can only write standard "Hello World" using Python :D)

Read More

28 October 2012

Genius's Guides to: membuat module Drupal 6 bagian 2

05:14 0

Nah setelah pada posting sebelumnya kita mengenal dasar-dasar coding pada file .module-nya Drupal, kali ini kita akan membahas mengenai file bernama .install yang berisikan definisi dari struktur tabel database untuk kita gunakan pada module. Drupal memungkinkan kita menambahkan atau menghapus tabel-tabel module kita pada struktur database Drupal melalui hook_schema, hook_install dan hook_uninstall.


Pada contoh ini misalnya kita akan membuat sebuah tabel yang nantinya akan kita gunakan sebagai tempat untuk menampung record atau data dari module kita. Jumlah tabel yang kita bisa tambahkan bisa lebih dari satu. Berikut isi dari file .install untuk module Latihan kita:



/**
* Module Latihan
* Copyright AdityaDees (adityadees@gmail.com) 2012
* Licensed under GPL v3
*
*/

/**
* Fungsi ini dijalankan oleh Drupal ketika kita pertama menginstall module Latihan
*/
function latihan_install() {
// Create tables.
drupal_install_schema('latihan');
}

/**
* Fungsi ini dijalankan oleh Drupal melakukan un-install pada Latihan
*/
function latihan_uninstall() {
// Remove tables.
drupal_uninstall_schema('latihan');
}

/**
* Pada fungsi ini kita mendefinisikan struktur tabel2 database yang akan
* kita gunakan untuk menyimpan data2 module Latihan
*/
function latihan_schema() {
$schema['latihan'] = array(
'description' => 'Tabel untuk menyimpan data module Latihan.',
'fields' => array(
'lat_id' => array(
'type' => 'serial',
'unsigned' => TRUE,
'not null' => TRUE,
'description' => "ID/Key utama tabel latihan"
),
'lat_judul' => array(
'type' => 'varchar',
'length' => '250',
'not null' => TRUE,
'default' => '',
'description' => "Judul konten latihan"
),
'lat_content' => array(
'type' => 'text',
'not null' => TRUE,
'default' => '',
'description' => 'Konten dari tabel latihan.'
)
),
'primary key' => array('lat_id'),
'indexes' => array(
'judul' => array('lat_judul')
)
);

return $schema;
}

Kita bisa lihat pada implementasi hook_schema yaitu pada fungsi latihan_schema, kita mendefinisikan tabel dengan nama "latihan" dengan dua tiga field yaitu "lat_id", "lat_judul" dan "lat_content", dengan primary key-nya adalah "lat_id" dan juga sebuah indeks dengan nama "judul" pada field "lat_judul". Drupal akan menerjamahkan definisi ini menjadi syntax SQL yang akan di-eksekusi pada saat module "Latihan" pertama kali di-aktifkan.


Pertanyaan berikutnya adalah bagaimana kita memasukkan data ke dalam tabel module "Latihan"? Jawaban sederhananya adalah kita harus membuat form untuk memasukkan data tersebut. Terus bagaimana kita buat form di Drupal? Seperti saya pernah sebutkan sebelumnya Drupal sudah menyediakan API yang sangat lengkap, termasuk di dalamnya adalah Form API yang memudahkan kita dalam membuat form serta memproses form, termasuk dalam hal validasi.


Tanpa banyak basa-basi, mari kita tambahkan kode berikut ini pada file latihan.module kita:



/**
* Fungsi ini mendefinisikan struktur form yang akan kita gunakan untuk
* input data
* @return Array array struktur form
*/
function latihan_inputdata_formdata() {
// definisikan elemen form
$form['judul'] = array(
'#type' => 'textfield',
'#title' => t('Judul konten Latihan'),
'#default_value' => '',
'#size' => 60,
'#maxlength' => 250,
'#description' => t('Judul konten latihan yang akan kita masukkan ke dalam database')
);

$form['konten'] = array(
'#type' => 'textarea',
'#title' => t('Isi konten Latihan'),
'#default_value' => '',
'#cols' => 60,
'#rows' => 5,
'#disabled' => false,
'#description' => t('Data konten latihan yang akan kita masukkan ke dalam database')
);

$form['data_tersembunyi'] = array('#type' => 'hidden', '#value' => 'Contoh data form tersembunyi');
$form['submit'] = array('#type' => 'submit', '#value' => t('Save'), '#submit' => array('latihan_inputdata_formdata_submit'));
return $form;
}


/**
* Fungsi ini dipanggil ketika form input data latihan di-submit
* Pada fungsi ini kita memanfaatkan Database API Drupal, yaitu fungsi
* db_query() untuk melakukan query SQL ke database
* Data form yang dikirimkan browser bisa kita akses lewat variabel $form_state['values'],
* misalnya untuk mengakses data form "judul" kita mengaksesnya lewat
* $form_state['values']['judul']
*/
function latihan_inputdata_formdata_submit($form, &$form_state) {
db_query("INSERT INTO {latihan} (lat_judul, lat_content) VALUES ('%s', '%s')",
$form_state['values']['judul'],
$form_state['values']['konten']);
// redirect ke web ke halaman/path "latihan"
$form_state['redirect'] = 'latihan';
drupal_set_message(t('"Latihan" form data has been saved'));
}


/**
* Fungsi dibawah ini berfungsi me-render/menampilkan form yang sudah kita definisikan
* pada fungsi latihan_inputdata_form
*/
function latihan_inputdata() {
return drupal_get_form('latihan_inputdata_formdata');
}

Agar form input data-nya gampang diakses tentunya kita harus menempatkan link yang bisa diklik oler user, maka dari itu jangan lupa tambahkan kode berikut pada fungsi latihan_menu:



$items['latihan/inputdata'] = array(
'title' => 'Input data module Latihan',
'page callback' => 'latihan_inputdata',
'access arguments' => array('membuat konten latihan'),
'type' => MENU_NORMAL_ITEM
);


Apabila semua berjalan lancar, maka kita akan bisa melihat tampilan sebagai berikut pada Drupal kita:




Begitulah kira-kira cara dasar pemrosesan form pada Drupal. Pertanyaan berikutnya adalah bagaimana kemudian kita menampilkan data yang sudah kita masukkan ke database? Bagaiman cara kita membuat data yang sudah kita entry bisa di-edit/diubah? Entar dulu yak ane istirahat dulu, nanti ane tulis di bagian 3 :). Semoga bermanfaat

Read More

27 October 2012

Genius's Guides to: membuat module Drupal 6 bagian 1

08:47 0

Okay, mungkin sebagian besar dari kita sudah tahu apa itu Drupal. Drupal adalah Content Management Framework yang memungkinkan kita membangun website atau aplikasi web dinamis. Lah kalau begitu kenapa engga disebut Content Management System alias CMS aja macem Joomla dsb.? Drupal menggunakan kata "Framework" disitu karena Drupal menyediakan sebuah platform yang sangat memungkinkan kita membangun aplikasi web lain dengan memanfaatkan API-nya yang sangat komprehensif. Saya bilang komprehensif karena API yang disediakan Drupal sangat lengkap kap kap.


Di artikel blog kali ini saya mau berbagi kepada rekan-rekan pembaca blog (kalau ada yang baca hehehee) bagaimana cara kita membuat module Drupal kita sendiri. Dengan module kita bisa meng-extend/memperluas fungsi Drupal sesuai dengan kebutuhan kita sendiri. Sebenarnya ada beberapa module "sakti" yang bisa kita gunakan untuk membangun aplikasi web dengan Drupal, contohnya Views, CCK (Drupal 6) dan Token, tetapi bagi beberapa orang, utamanya developer aplikasi web yang lebih suka coding (dan yang lebih kepingin dibilang geek kaya saya hahahahaa), membuat module lebih disukai.


Untuk tutorial ini saya menggunakan Drupal 6. Loh kenapa bukan Drupal 7 yang lebih baru, jawaban jujur dari lubuk hati yang paling dalam adalah, saya belum sempat mempelajari API Drupal 7, dan saya sudah terbiasa dengan Drupal 6 hehehee.


Ok sebelum tutorial ini saya lanjutkan ada beberapa hal yang perlu saya sampaikan, terutama terkait dengan pengetahuan dan skill yang wajib dan perlu kita kuasai apabila ingin membuat module Drupal. Apa saja?




  1. Pemrograman dengan PHP

  2. Pemrograman SQL dengan database server MySQL atau PostgreSQL

  3. Pemrograman dengan HTML, Javascript dan CSS



Nah sebelum kita mulai coding module Drupal kita, maka beberapa hal harus kita persiapkan terlebih dahulu:



  1. Drupal 6 yang sudah terinstall (maaf untuk instalasi Drupal saya tidak cover di tutorial ini, cara sendiri aja yak, banyak kok tersedia di web)

  2. Editor teks favorit anda, untuk Windows saya selalu pakai Notepad++, kalau lagi pake GNU/Linux saya pakai Geany, dan kalau lagi pakai Mac OSX saya pakai Komodo Edit

  3. Cemilan sama Teh :D



Pada dasarnya semua 3rd party module di Drupal, termasuk yang akan kita buat, diletakan pada direktori sites/all/modules. Apabila direktori modules belum ada pada sites/all maka silahkan anda buat terlebih dahulu. Pada contoh ini kita akan membuat sebuah module Drupal dengan nama "Latihan". Langkah-langkahnya adalah sebagai berikut:


  1. Buatlah sebuah direktori bernama latihan di dalam direktori sites/all/modules

  2. Di dalam direktori latihan buatlah tiga buah file teks baru dengan nama sebagai berikut:

    • latihan.info

    • latihan.module

    • latihan.installl



  3. Buka file latihan.info dengan teks editor anda. File latihan.info adalah file metadata yang mendeskripsikan module Drupal. Di dalam file ada beberapa informasi dasar yang harus kita cantumkan. Untuk module "Latihan" kita akan isi sebagai berikut:

    name = Module Latihan
    description = Module sederhana Drupal untuk latihan
    core = 6.x
    package = "Latihan"


    Simpan file.

  4. Selanjutnya kita akan membuka file latihan.module yang merupakan file utama berisi kode PHP untuk module "Latihan". Sebelum mulai coding saya mau sedikit menjelaskan cara kerja Drupal dalam menjalankan module-modulenya. Drupal menyediakan apa yang disebut sebagai "hook" atau "kaitan". "Hook" adalah fungsi-fungsi dari dipanggil pada saat-saat tertentu oleh Drupal. Misalnya kita akan menemui hook bernama hook_block, yang dipanggil ketika Drupal akan menampilkan "Block" pada halaman web. Untuk module maka nama hook diganti dengan format namamodule_namahook, jadi untuk mengimplementasikan hook_block di module kita, maka kita harus membuat fungsi dengan nama latihan_block.

  5. Untuk snippet kode pertama adalah kita akan melakukan implementasi pada hook_perm. hook_perm adalah hook yang menentukan permission apa saja yang disediakan oleh module kita.

    /**
    * Permission apa saja yang disediakan oleh module Latihan?
    * tentukan pada fungsi ini
    * @return array Array yang mendefinisikan permission
    */
    function latihan_perm() {
    $_perms = array(
    'membuat konten latihan',
    'mengubah konten latihan',
    'melihat konten latihan',
    'menghapus konten latihan',
    'ubah konfigurasi module latihan');
    return $_perms;
    }

    Pada fungsi latihan_perm ini kita mendefinisikan ada lima permission yang disediakan oleh module "Latihan", yaitu "membuat konten latihan" sampai "ubah konfigurasi module latihan", yang didefinisikan dalam bentuk array.


  6. Setelah implementasi hook_perm, selanjutnya adalah kita melakukan implementasi hook_block. Untuk itu kita akan membuat sebuah fungsi lagi dengan nama latihan_block. Kodenya adalah sebagai berikut:

    /**
    * Block adalah konten yang posisi-nya bisa dipindah-pindahkan pada Drupal
    * fungsi ini mendefinisikan konten blok untuk module Latihan
    * @param string $op isi dari variabel argumen ini bisa "list", "view", "save" atau "configure"
    * @param integer $delta kode untuk meng-identifikasi block
    * @param array $edit hanya muncukl apabila argumen $op berisi "save"
    * @return array data semua blok yang disediakan oleh module Latihan
    */
    function latihan_block($op = 'list', $delta = 0, $edit = array()) {
    // array kosong yang akan menyimpan semua data block
    $block = array();

    switch ($op) {
    case "list":
    // operasi list adalah ketika daftar block ditampilkan pada halaman admin/block
    $block[0]["info"] = t('Block module Latihan');
    break;

    case "view":
    // operasi view adalah ketika block ditampilkan sebenarnya
    // subject/judul heading dari block
    $block["subject"] = t("Judul Block Latihan");
    // content/isi dari block
    $block["content"] = '

    Ini adalah konten/isi dari block module Latihan

    ';
    break;

    case "save":
    break;

    case "configure":
    break;
    }

    return $block;
    }



  7. Berikutnya kita akan membuat fungsi yang tugasnya menampilkan konten utama dari module Latihan. Berikut adalah snippet kode-nya:

    /**
    * Fungsi ini menampilkan konten/isi utama dari Module Latihan
    */
    function latihan_main() {
    // definisikan variabel konten kosong untuk inisialisasi
    $content = '';

    // lakukan berbagai macam manipulasi konten pada bagian ini
    // seperti melakukan query dsb.
    $content .= '

    Ini adalah konten sederhana dari module Latihan

    ';

    return $content;
    }



  8. Bagaimana kalau kita mau module kita ada beberapa parameternya yang bisa dikonfigurasikan melalui antar muka web Drupal? Tenang, kita akan membuat sebuah fungsi yang akan menampilkan halaman konfigurasi khusus module Latihan yang kita buat. Berikut kode-nya:

    /**
    * Fungsi ini memungkinkan kita membuat halaman konfigurasi dalam Drupal
    * khusus untuk module Latihan
    * Pada contoh ini kita mendefinisikan 2 item konfigurasi untuk module Latihan
    * @return array Array yang elemen form konfigurasi modul latihan
    */
    function latihan_admin() {
    $form = array();

    // setting 1
    $form['latihan_setting1'] = array(
    '#type' => 'textfield',
    '#title' => t('Setting 1 module Latihan'),
    '#default_value' => variable_get('latihan_setting1', null),
    '#size' => 60,
    '#maxlength' => 250,
    '#description' => t("Contoh setting pertama untuk module Latihan"),
    '#required' => TRUE,
    );

    // setting 2
    $form['latihan_setting2'] = array(
    '#type' => 'textfield',
    '#title' => t('Setting 2 module Latihan'),
    '#default_value' => variable_get('latihan_setting2', null),
    '#size' => 60,
    '#maxlength' => 250,
    '#description' => t("Contoh setting kedua untuk module Latihan"),
    '#required' => TRUE,
    );

    return system_settings_form($form);
    }



  9. Langkah penting berikutnya adalah meng-implementasika hook_menu. hook_menu mendefinisikan URL dan path apa saja yang ada pada module Latihan, sekaligus menetapkan callback (fungsi) apa yang dijalankan ketika URL tersebut dipanggil oleh browser. Kode-nya adalah sebagai berikut:

    /**
    * Fungsi menu mendefinisikan menu atau path page untuk module Latihan
    *
    */
    function latihan_menu() {
    $items = array();

    $items['admin/settings/latihan'] = array(
    'title' => 'Konfigurasi Latihan',
    'description' => 'Halaman untuk menampilkan konfigurasi module Latihan',
    'page callback' => 'drupal_get_form',
    'page arguments' => array('latihan_admin'),
    'access arguments' => array('ubah konfigurasi module latihan'),
    'type' => MENU_NORMAL_ITEM
    );

    $items['latihan'] = array(
    'title' => 'Halaman utama module Latihan',
    'page callback' => 'latihan_main',
    'access arguments' => array('melihat konten latihan'),
    'type' => MENU_NORMAL_ITEM
    );

    return $items;
    }



  10. Nah sampai disitu dulu kode module Drupal kita, untuk kode lengkapnya silahkan anda lihat ke Kode Lengkap module Latihan. Selanjutnya kita akan coba mengaktifkan module Drupal yang baru kita buat dengan masuk ke halaman admin/build/modules pada website Drupal kita. Apabila berhasil maka kita akan melihat module Latihan pada daftar module yang disediakan Drupal seperti pada screenshot berikut:




    Centang pada module "Module Latihan" dan kemudian tekan tombol "Save Configuration".


  11. Apabila proses aktivasi module kita berhasil maka kita akan melihat tampilan-tampilan sebagai berikut pada website Drupal kita:



    Kita bisa melihat menu dengan nama "Halaman utama module Latihan" di bagian sebelah kiri halaman web kita, yang apabila di-klik akan ditujukan ke halaman URL latihan.



    Pada halaman manajemen Block Drupal di admin/build/block kita akan melihat Block dengan nama "Block module Latihan" sudah terdaftar, tinggal kita letakkan di posisi yang kita inginkan.



    Halaman konfigurasi khusus module Latihan juga bisa kita ke akses melalui path URL admin/settings/latihan dan akan menampilkan tampilan seperti di atas.



Sampai disini dulu untuk bagian satu, semoga bisa memberikan gambaran dasar bagaimana membuat module dengan Drupal. Seperti yang sudah saya sebutkan sebelumnya, Drupal menyediakan banyak API yang memudahkan kita dalam mengembangkan module. Untuk daftar lengkap beserta dokumentasi penggunaanya silahkan browsing ke Drupal 6 API.
Read More

27 August 2009

jQuery, I Love You Full!

11:28 0


Di postingan sebelumnya saya membahas Prototype, sebuah framework Javascript ciamik untuk manipulasi DOM dan AJAX. Kali ini saya iseng-iseng coba sebuah framework Javascript yang sudah kesohor juga yaitu jQuery. kalau menurut hemat saya, jQuery punya model syntax yang lebih elegan dibandingkan dengan Prototype, hal ini bisa kita lihat dalam model object jQuery yang lebih simple, terutama dalam penanganan event. Penanganan event di jQuery nemungkinkan kita benar-benar memisahkan antara layer tampilan dengan layer logic pemrograman javascript.




Perbedaan mendasar antara jQuery dengan Prototype adalah, fungsi $ pada jQuery menerima argumen string Selector CSS atau XPath dan selalu mengembalikan objek jQuery dalam bentuk Array atau List, sedang pada Prototype fungsi $ hanya menerima string ID dari element yang akan kita manipulasi dan mengembalikan object DOM yang sudah di-extend oleh metode-metode Prototype (walaupun sebenarnya Prototype punya fungsi yang serupa dengan $-nya jQuery, yaitu fungsi $$ dan juga metode class Element, select, yang juga menerima argument string Selector CSS atau XPath). IMHO hal ini membuat jQuery menjadi lebih efisien, karena semua metode jQuery (dan juga semua metode plugins-nya) sudah pasti mengolah Array atau List objek DOM jQuery.




Contohnya, untuk me-register event memunculkan box alert apabila ada link dengan id 'klikSaya' di-klik, kita cukup menulis kode seperti ini pada bagian HEAD dokumen HTML kita atau bisa juga pada bagian awal BODY dokumen HTML :


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<script type="text/javascript">
$(document).ready(function() {
$('#klikSaya').click(function(evt) {
alert('Hallooowww anda telah meng-klik saya!');
});
});
</script>
</head>




Dan pada BODY dokumen HTML, kita cukup menuliskan kode seperti ini :

<body>
<a id="klikSaya" href="#">Klik Saya Donk Ahhh!</a>
</body>
</html>


 



Apalah artinya aplikasi Web 2.0 tanpa AJAX, rasanya kurang lengkap tanpa metode nyang satu ini. jQuery menyediakan API AJAX yang cukup lengkap untuk AJAX. Contoh di BODY dokumen HTML kita punya seperti ini:

<body>
<a id="klikAJAX" href="#">Klik Saya Buat Munculin Konten dari AJAX di bawah ini :</a>
<div id="ajaxContainer">&nbsp;</div>
</body>
</html>




Maka di bagian HEAD kita bisa menuliskan kode Javascript seperti ini :

$(document).ready(function() {
$('#klikAJAX').click(function(evt) {
var content = $.ajax({ url: "kontenAJAX.php", async: false }).responseText;
// perhatikan opsi 'async', apabila diset false, maka semua event lain di browser di-block
// sehingga tidak ada proses AJAX dilakukan bersamaan
$('#ajaxContainer').html(content);
});
});

Sangat mudah bukan?




jQuery juga sudah menyediakan metode-metode untuk animasi dasar, seperti fadeIn, FadeOut, pullDown, pullUp, hide, show dan animate. Contohnya bisa dilihat sebagai berikut :



Makkkk!!! gampang kali!! kode untuk efek animasi di atas hanya begini saja :

$(document).ready(function() {
$('a.show-hidden').click(function(evt) {
evt.preventDefault();
$('.hidden-object').slideDown("normal");
});
 
 
$('a.hide-hidden').click(function(evt) {
evt.preventDefault();
$('.hidden-object').slideUp("normal");
});
});





Seperti halnya Prototype, jQuery didesain agar penulisan kode semakin ringkas dan elegan, yang pada akhirnya bisa memperkecil ukuran file kode Javascript kita. Hal ini didapat dengan penerapan Command Chaining. Setiap hasil fungsi $ bisa di-chaing atau digabung dengan fungsi-fungsi jQuery lain. Misalnya bisa kita lihat pada contoh kode berikut :

// temukan semua tag 'A' dibawah element DOM dengan ID 'menu'
// dan daftarkan event 'click' sekaligus event 'mouseover'
// dan juga sekaligus set style CSS dari setiap tag 'A' yang ditemukan
// dengan display = block
$('#menu').find('a').click(function(evt) {
// lakukan sesuatu untuk setiap tag 'A' disini
// ketika di-klik
}).mouseover(function(evt) {
// lakukan sesuatu untuk setiap tag 'A' disini
// ketika cursor melewati tag 'A'
}).css('display', 'block');





Gampang yak? :D

Read More

25 July 2008

var Prototype.js ={efek : 'Javascript Semakin Mudah!'}

09:26 0


Dengan semakin booming-nya (baca: Meledak) Web 2.0, saat ini banyak sekali bermunculan library-library Javascript yang menawarkan kemudahan untuk DHTML dan AJAX seperti JQuery, Prototype, Script.acu.lo.us, openRico, Dojo dan masih banyak lagi yang lainnya. Ketika saya mulai mengembangkan Senayan, aplikasi berbasis web untuk automasi perpustakaan, saya mulai mendalami lagi Javascript dan salah satu library Javascript yang bikin saya "kepincut" dan saya gunakan pada Senayan adalah Prototype yang dikembangkan pertama kali oleh Sam Stephenson.



Jujur saya tertarik pertama kali dengan Prototype karena kemudahan dalam pemrosesan request AJAX-nya. Yang kedua dan tidak kalah pentingnya adalah kemampuannya yang Cross-Browser, ga perlu repot-repot lagi kita nambahin logic untuk nge-cek browser yang ribet. Prototype compatible dengan hampir semua browser populer yang ada di muka bumi ini macam Mozilla Firefox, Opera, Konqueror, Safari, dan juga browser paling "menakjubkan" (baca: Suckss!) di muka bumi ini, Internet Explorer.



Dulu saya berpikir Javascript tu bahasa pemrograman paling "dodol" a.k.a "nyebelin" a.k.a "brengsek". Tetapi sejak munculnya library Prototype dan dukungan DOM serta AJAX pada semua browser sudah menjadi standar perlahan-lahan saya berubah pikiran, "Javascript Semakin Cakep dan Sangat Diperlukan untuk semakin membuat aplikasi web setara dengan aplikasi Desktop". Dengan adanyan Prototype hidup semakin mudah, pemrosesan DHTML yang Cross-Browser juga menjadi sangat mudah dilakukan. Kita bisa dengan mudah me-modifikasi style CSS pada suatu element secara interaktif lalu mengubah konten element tersebut secara interaktif dengan mudah hanya dengan menggunakan 1 baris kode!



Tentunya ga enak kalo saya sesumbar disini tapi ga ngasih contoh. Aturan utama untuk menggunakan Prototype adalah meng-include file library Prototype terlebih dahulu di halaman HTML kita (sangat disarankan di dalam tag HEAD).





<html><head>
<script type="text/javascript" src="libjs/prototype.js"></script>
</head>




Sekarang kita coba melakukan Request AJAX dengan menggunakan Prototype:






<div id="ajaxContainer">&nbsp;</div>
<script type="text/javascript">
// URL request AJAX yang kita ingin ambil datanya
var ajaxURL = 'ajax_response.php';
// lakukan request AJAX dengan membuat instance Ajax.Request
new Ajax.Request(url, { method: 'get',
onSuccess: function(ajaxObject) {
// ambil text hasil response AJAX
var ajaxResponseText = ajaxObject.responseText;
// Prototype memudahkan kita dalam mengupdate konten suatu element dengan method "update". Dibawah ini element <div> dengan id "ajaxContainer" akan diupdate konten-nya dengan hasil response AJAX
var ajaxContainer = $('ajaxContainer').update(ajaxResponseText);
},
onFailure: function(ajaxObject) {
alert('Terjadi Error pada Request AJAX ke URL : ' + ajaxURL);
}
});
</script>




Pada kode di atas apabila request AJAX berhasil dilakukan maka element <div> akan diisikan dengan text response AJAX, tetapi apabila request AJAX gagal dilakukan (onFailure), maka akan muncul alert yang memberitahu bahwa request AJAX gagal dilakukan. Sangat mudah bukan? Wow tapi nanti dulu!! masih ada yang lebih keren! bagaimana kalau kita mau hasil dari AJAX-nya bukan teks biasa tetapi hasilnya berupa HTML yang akan langsung kita include-kan di halaman web kita? Disinilah fungsi kelas Ajax.Updater akan sangat menolong hidup kita (ciaaa.. illaahh) :







<div id="ajaxContainer">&nbsp;</div>
<script type="text/javascript">
// URL untuk request AJAX
varajaxURL = "ajax_updater_response.php"
// parameter GET atau POST yang ingin kita sertakan pada request
var reqParams = "param1=Nilai+Param+1&param2=Nilai+Param+2"
// method pengiriman request, bisa GET, POST atau bahkan PUT
var reqMethod = 'post';
// ID element yang akan menampung HTML hasil response Ajax.Updater
var ajaxContainer = 'ajaxContainer';
// Buat instance Ajax.Updater
new Ajax.Updater(ajaxContainer, ajaxURL, {
method: reqMethod, parameters: reqParams
});
</script>



Misalkan pada file "ajax_updater_response.php" mengandung kode PHP yang menghasilkan HTML seperti ini :






<?php
// pastikan bener-bener hasilnya HTML
header("Content-type: text/html");
$sql_q = $mysql->query("SELECT * FROM someSQLtable WHERE name LIKE '%".$mysql->escape_string($_POST['param1'])."%'
LIMIT 100"
);
// loop data dan tampilkan dalam tabel HTML
echo '<table class="datalist">';
while ($sql_d = $sql_q->fetch_row()) {
echo '<tr>';
echo '<td>'.$sql_d[0].'</td>';
echo '<td>'.$sql_d[1].'</td>';
echo '<td>'.$sql_d[2].'</td>';
echo '</tr>';

}
echo '</table>';
?>



Mantapp! Gampang bener yak!! Trus, trus bagaimana kalo gw mau hasil respons AJAX-nya berupa JSON biar gw bisa proses lagi rie? Yahhhhh itu mah gampang!! begini caranyan :






<div id="ajaxContainer">&nbsp;</div>
<script type="text/javascript">
// URL request AJAX yang kita ingin ambil datanya
var ajaxURL = 'ajax_response.php';
// lakukan request AJAX dengan membuat instance Ajax.Request
new Ajax.Request(url, { method: 'get',
onSuccess: function(ajaxObject) {
// ambil text hasil response AJAX dan strip space di kiri dan kanan string biar ga ganggu
var ajaxResponseText = ajaxObject.responseText.strip();
// Convert hasil response AJAX ke objek JSON dengan menggunakan method evalJSON() milik Prototype!
var ajaxJSON = ajaxResponseText.evalJSON();
// Proses object JSON anda di bawah ini
...
},
onFailure: function(ajaxObject) {
alert('Terjadi Error pada Request AJAX ke URL : ' + ajaxURL);
}
});
</script>



Pada halaman response AJAX "ajax_response.php" mengandung kode seperti ini :





<?php
header("Content-type: text/javascript");
$sql_q = $mysql->query("SELECT * FROM someSQLtable WHERE name LIKE '%".$mysql->escape_string($_POST['param1'])."%'
LIMIT 100"
);
// loop data dan simpan dalam Array
$array_rows = array();
while ($sql_d = $sql_q->fetch_row()) {
$array_rows[] = $sql_d;
}
// encode ke dalam bentuk JSON
echo json_encode($array_rows);
?>



Oke segitu dulu deh posting saya mengenai AJAX di Prototype, insya ALLAH nanti akan saya bahas lebih lanjut lagi penggunaan Prototype untuk membuat dynamic AJAX drop-down yang populer itu. Silahkan anda mendownload dan coba menggunakan Prototype sekarang juga, "Javascript never been these easy!!".

Read More

26 April 2006

Nginstall Apache, MySQL dan PHP di Linux

15:18 0
Pernah coba install Apache, MySQL dan PHP di Linux (LAMP), 4 sekawan sakti yang paling banyak dipake di Internet saat ini? atau pengen coba tapi udah jiper duluan karena keliatannya susah? Semoga pengalaman saya nginstall di Ubuntu Linux bisa jadi batu loncatan buat belajar nginstall AMP di Linux. Sebenarnya install AMP di Linux itu kalo mau nyoba dan usaha ga susah (kalo belajar maunya gampang doank ga dapet ilmu apa-apaan donk!!), intinya "keep trying". Semua proses instalasi dilakukan dengan menggunakan source code Apache, MySQL dan PHP.



Source code ini bisa didownload di website resmi masing-masing :


Biar lebih cepat proses download-nya, cari mirror-mirror download yang berada di Indonesia, atau kalau tidak ada cari mirror terdekat, seperti Singapura atau Australia (itung-itung menghemat bandwidth Internet ke luar negeri).



Semua proses instalasi dan kompilasi dilakukan pada console atau terminal dan juga pastikan gcc, glibc, g++ sudah terinstall (kalo ga punya g++, gcc juga bisa dipake buat compile c++, tinggal tambahin : CXX=gcc sebelum perintah ./configure), karena tanpa ketiga aplikasi ini kita tidak bisa melakukan kompilasi source code. Untuk melakukan proses instalasi hingga tuntas maka kita menggunakan user tertinggi di Linux yaitu root. Untuk meng-kompilasi PHP pastikan bahwa parser Bison GNU (versi-versi terbaru kalo bisa -- kalo engga ada Bison parser Yacc juga bisa diterima) dan juga Flex.



Untuk ngecheck-nya apakah Bison dan Flex udah ke-install apa belum lakuin perintah berikut ini :




which bison



which flex




kalo engga ada juga gimana? jangan menyerah, download aja versi pre-compiled (tergantung distribusi Linux apa yang diinstall), di Ubuntu saya cari pre-compiled binary Bison yang khusus Debian Ubuntu.



Yang pertama saya install biasanya adalah Apache, kedua MySQL dan terakhir baru PHP. Kenapa saya pake urutan begini? karena untuk install PHP sebagai module apache dan gunain client library MySQL di PHP kita butuh Apache dan MySQL yang sudah terinstall sebelumnya.



Extract source Apache dengan melakukan perintah sebagai berikut :



tar -xvzf httpd-2.2.x.tar.gz



masuk ke dalam direktori httpd-2.2.x dengan menjalankan perintah berikut :



cd httpd-2.2.x



di dalam direktori ini lakukan perintah berikut :



./configure --prefix=/opt/apache2/ --enable-so
-- tunggu sampai proses konfigurasi selesai --



setelah proses konfigurasi instalasi selesai tanpa masalah (biasanya kalau ada masalah proses akan berhenti di tengah jalan dan akan mengeluarkan error) maka jalankan perintah berikut untuk memulai proses kompilasi apache :



make
-- tunggu sampai proses kompilasi selesai --



apabila proses kompilasi berjalan lancar tanpa error maka selanjutnya adalah melakukan perintah berikut untuk menginstall apache ke tempat yang sudah kita tentukan (dalam hal ini adalah /opt/apache2/ ) :



make install



sekarang web server apache kita sudah terinstall di /opt/apache2/. Untuk mencoba menjalankan daemon apache maka lakukan perintah berikut ini :



/opt/apache2/bin/apachectl start
-- untuk saat ini abaikan saja warning-warning yang keluar, kecuali ERROR --
cek apakah apache sudah benar-benar berjalan dengan melakukan perintah berikut ini :



ps ax | grep httpd
-- apabila berjalan maka akan tampil daftar proses milik apache yaitu httpd --



Agar lebih secure, buat group dan user baru dengan nama sama yaitu apache. Bisa dilakukan dengan menjalankan perintah berikut ini :



addgroup apache


adduser -s --no-create-home -G apache apache



Sekarang langkah selanjutnya adalah melakukan kompilasi source code MySQL. Download saja MySQL versi 4.1.x.
Extract source MySQL dengan melakukan perintah sebagai berikut :



tar -xvzf mysql-4.1.x.tar.gz



masuk ke dalam direktori mysql-4.1.x dengan menjalankan perintah berikut :



cd mysql-4.1.x



di dalam direktori ini lakukan perintah berikut :



./configure --prefix=/opt/mysql4/
-- tunggu sampai proses konfigurasi selesai --



setelah proses konfigurasi instalasi selesai tanpa masalah (biasanya kalau ada masalah proses akan berhenti di tengah jalan dan akan mengeluarkan error) maka jalankan perintah berikut untuk memulai proses kompilasi mysql :



make
-- tunggu sampai proses kompilasi selesai --



apabila proses kompilasi berjalan lancar tanpa error maka selanjutnya adalah melakukan perintah berikut untuk menginstall mysql ke tempat yang sudah kita tentukan (dalam hal ini adalah /opt/mysql4/ ) :



make install




sekarang MySQL sudah terinstall di /opt/mysql4/. Untuk mulai menggunakan server MySQL kita harus melakukan inisialisasi GRANT TABLE milik MySQL. Inisialisasi GRANT TABLE bisa dilakukan dengan menggunakan perintah :



/opt/mysql4/bin/mysql_install_db



selanjutnya adalah kopi file my-medium.cnf yang terletak pada direktori /opt/mysql4/share/mysql/ ke direktori /etc/ dengan merubah namanya menjadi my.cnf. Perintahnya adalah seperti ini :



cp /opt/mysql4/share/mysql/my-medium.cnf /etc/my.cnf



buat user baru khusus untuk MySQL dengan melakukan perintah berikut :



addgroup mysql


adduser -s --no-create-home -G mysql mysql



setelah itu coba jalankan server MySQL dengan melakukan perintah berikut ini :



/opt/mysql4/share/mysql/mysql.server start



apabila berhasil maka akan muncul status seperti ini "Starting MySQL..... [OK]"
dan selanjutnya sudah bisa melakukan query-query kepada server dengan masuk ke dalam program client command-line mysql :



/opt/mysql4/bin/mysql
-- apabila berhasil maka akan dibawa masuk ke dalam program dan ada greetings "Welcome to MySQL ....." --



Sekarang last but NOT LAST adalah meng-kompilasi bahasa pemrograman favorit saya, yaitu PHP. Extract source code PHP dengan melakukan :





tar -xvzf php-4.4.x.tar.gz




masuk ke dalam direktori php-4.4.x dengan menjalankan perintah berikut :



cd mysql-4.4.x



di dalam direktori ini lakukan perintah berikut :



./configure --prefix=/opt/php4/ --with-config-file-path=/etc/php/ --with-config-file-scan-dir=/etc/php/ --with-apxs2=/opt/apache2/bin/apxs --with-mysql=/opt/mysql4/ --enable-mbstring
-- tunggu sampai proses konfigurasi selesai --



setelah proses konfigurasi instalasi selesai tanpa masalah (biasanya kalau ada masalah proses akan berhenti di tengah jalan dan akan mengeluarkan error) maka jalankan perintah berikut untuk memulai proses kompilasi php :



make
-- tunggu sampai proses kompilasi selesai --




lalu jalankan :



make install



sekarang lengkap sudah AMP kita di Linux. Tapi tunggu!!?? bagaimana caranya agar web server kita bisa ngerti PHP? apa otomatis gitu aja? engga juga. Sekarang kita harus buka file /opt/apache2/conf/httpd.conf dan memodifikasi-nya sedikit. Buka saja dengan vi atau apabila sudah menggunakan desktop GNOME misalnya, buka saja dengan menggunakan gedit. Yang harus diubah adalah :



User nobody


Group -1



ganti dengan :



User apache


Group apache



lalu tambahkan pada baris terakhir :



# PHP


AddType application/x-httpd-php .php



Untuk testing apakah sudah berjalan dengan baik, maka buat sebuah file php di dalam /opt/apache2/htdocs/ dengan nama test.php dan isikan dengan :



<?php
phpinfo();
?>



save file dan keluar. Restart web server apache agar apache membaca ulang file konfigurasi yang baru diubah dengan menjalankan perintah :



/opt/apache2/bin/apachectl restart



buka browser dan ketikan http://localhost/test.php pada kotak URL, dan lihat apakah skrip PHP yang baru kita buat sudah terinstall.
Read More

12 April 2006

Full Open Source Web Design and Programming. Kata siapa ga mungkin?

16:44 0
Mayoritas web designer dan web programmer di Indonesia (koreksi apabila saya salah) masih sangat tergantung pada software-software proprietary/shareware dalam mendesain dan merancang web. Daya beli masyarakat kita yang rendah pada akhirnya mendorong penggunaan software-software bajakan seperti Macromedia Dreamweaver, Adobe Photoshop, Adobe Illustrator, Macromedia Flash dsb. 5 atau 4 tahun yang lalu mungkin akan sangat sulit untuk mencari aplikasi-aplikasi Open Source untuk menandingi software-software proprietary tersebut, tetapi seiring perkembangan OSS (Open Source Software) yang sangat pesat beberapa tahun belakangan seperti Inkscape, GIMP, Sodipodi, Eclipse, Quanta Plus dan belakangan ini Xara Xtreme merupakan isyarat bagi web designer dan web programmer untuk segera bermigrasi penuh ke OSS.



Dari pengalaman saya sendiri dalam membangun beberapa aplikasi berbasis web (yang saya juga bertindak sebagai designer interface-nya), ternyata tidak memerlukan waktu yang lama untuk membiasakan diri menggunakan OSS secara penuh dalam men-develop sebuah aplikasi berbasis web. Ketika saya menggunakan desktop Ubuntu linux pertama kalinya saya juga sempat bingung mau memakai software apa untuk mendesain interface aplikasi nantinya. Terima kasih kepada komunitas Open Source yang tidak kenal lelah telah menghasilkan software-software pengolah vektor seperti Inkscape dan XaraXtreme, serta untuk image editing, GIMP yang telah matang di versi ke 2 ini.



















2 Aplikasi web based yang saya bangun dengan Full OSS
Inkscape on Action





Untuk ilustrasi saya sudah terlanjur jatuh cinta pada inkscape (alhamdulillah telah tersedia untuk versi windows-nya) dan untuk editing image saya menggunakan GIMP versi 2.2.10. Kedua software tersebut apabila digabungkan penggunaannya ternyata cukup dahsyat dalam menghasilkan design mock-up web. Apalagi bila kita sudah faseh terhadap semua tools yang ada pada Inkscape dan GIMP (yang saya yakin baru memaksimalkannya paling-paling 10%). Intinya dalam menguasai sebuah software grafis adalah explorasi dan maksimalisasi tools yang ada. Bagi mereka yang terbiasa menggunakan photoshop mungkin akan sedikit sulit saat menggunakan GIMP, karena windowing system-nya yang terbilang cukup merepotkan, tetapi semua itu hanya butuh adaptasi saja (alah bisa karena biasa). Inkscape juga menawarkan perbedaan dibandingkan dengan aplikasi pengolah vektor lainnya, karena Inkscape menggunakan format SVG (Scalable Vector Graphics) sebagai format native-nya. Hal ini tentunya merupakan sebuah inovasi yang brilian, karena dengan built-in XML editornya kita bisa saja "menggambar dengan tidak menggambar". Apa maksudnya?? apabila kita telah terbiasa dengan spesifikasi XML SVG, maka bisa saja kita menggambar dengan menuliskan kode XML SVG saja dan langsung melihat hasilnya di Inkscape. Kekurangan dari Inkscape adalah pada Eksport-nya yang masih terbatas pada PNG saja (tetapi tidak terlalu menjadi masalah, karena hasilnya eksport-nya bisa kita eksport kembali dalam bentuk lainnya dengan menggunakan GIMP).



Untuk IDE (coding PHP dan HTML) di Linux, saya menggunakan Eclipse dengan ekstensi PHP-Eclipse. Eclipse merupakan IDE berbasis Java yang sangat populer dan sudah sangat matang serta masih terus dikembangkan hingga saat ini. Yang paling saya suka adalah fitur auto-completion-nya yang cukup lengkap (terutama kalau lagi lupa fungsi-fungsi PHP). Sebelum Eclipse saya pernah menggunakan Quanta Plus, tetapi karena Quanta didisain spesifik untuk desktop KDE (dimana banyak sekali library dependancies yang bikin saya malas), akhirnya saya menjatuhkan pilihan ke Eclipse yang fasilitasnya sudah sangat lengkap.



Jadi, Web Designer dan web programmer? Uninstall semua program web authoring bajakan anda dan migrasi penuh ke OSS!! I bet we can do it.
Read More

https://payclick.com/

Contact us for advertising.