Sunday, October 14, 2012

CodeIgniter, API Instagram dan Aplikasi Anda

Saya tahu, ramai pengguna di Malaysia menggunakan Instagram untuk mengambil gambar, memuatnaiknya dan dikongsikan ke laman sosial. Tidak kiralah sama ada dengan menggunakan iphone atau gajet android. Maaf, tidak untuk blackberry, symbian, bada os atau windows phone.

Tetapi saya tidak pasti, berapa ramai developer di Malaysia yang menggunakan API Instagram ke dalam aplikasi mereka. Sebagai pihak ketiga, kita boleh menggunakan data-data daripada Instagram untuk kita gunakan dalam aplikasi yang kita bangunkan untuk pelbagai tujuan.

Jika kita lihat di luar Malaysia, banyak aplikasi yang bersumberkan data Instagram telah dibangunkan seperti Webstagram,  Pinstagram, Statigram dan bermacam lagi. Kesemuanya menggunakan API dari Instagram yang telah mereka sediakan.

Saya sendiri, ada membangunkan sebuah aplikasi yang hampir sama yang diberi nama Instagramy. Ia merupakan sebuah aplikasi web yang membenarkan pengguna-pengguna Instagram mencetak foto mereka ke atas sehelai t-shirt. Cuma, bahagian cetak foto ke t-shirt belum lagi saya sempurnakan kerana ketiadaan alat yang sesuai. Ada sesiapa sudi membantu? ;)

Jadi, bagaimana saya melakukannya? CodeIgniter + API Instagram = Instagramy. Ok, bahagian pertama ini saya akan tunjukkan langkah demi langkah untuk kita menggunakan API Instagram dari pendaftaran sehingga ke paparan foto popular dari Instagram. Dan untuk proses selanjutnya seperti proses Sign in with Instagram dan sebagainya, saya akan sambung penulisan ke bahagian kedua nanti, insyaallah sekiranya ada ruang dan kelapangan.

Tutorial ini sesuai untuk anda yang sudah mempunyai asas dalam pengaturcaraan PHP dan juga framework CodeIgniter.

Langkah pertama:

Anda boleh memuat turun library untuk membolehkan CodeIgniter berhubung dengan API Instagram di sini https://github.com/ianckc/CodeIgniter-Instagram-Library. Download fail tersebut dan masukkan ke dalan folder aplikasi anda. Ia mengandungi 3 fail iaitu:

  1. application/config/Instagram_api.php

  2. application/libraries/Instagram_api.php

  3. application/libraries/MY_Input.php


Langkah kedua:

Anda perlu daftar aplikasi anda di http://instagram.com/developer/. Pilih menu Register Your ApplicationRegister a New Client. Ada 4 item yang perlu diisi iaitu:

  • Appliaction Name — Masukkan nama aplikasi anda.

  • Description — Keterangan tentang aplikasi yang anda bangunkan.

  • Website — URL aplikasi anda.

  • OAuth redirect_uri — URL aplikasi anda setelah pengguna berjaya log masuk


Contohnya:



Selepas itu, anda akan diberikan Client ID & Client Secret.

Langkah ketiga:

Kemudian, buka fail application/config/Instagram_api.php dan masukkan Client ID, Client Secret dan juga maklumat yang anda daftarkan tadi ke fail tersebut. Lihat contoh di bawah:
$config['instagram_client_name']	= 'Instagra.my';
$config['instagram_client_id'] = '--client id anda--';
$config['instagram_client_secret'] = '--client secret anda--';
$config['instagram_callback_url'] = 'http://instagra.my/igram/authorize/';
$config['instagram_website'] = 'http://instagra.my';
$config['instagram_description'] = 'Cetak foto instagram kegemaran anda ke t-shirt';

Langkah keempat:

Buka fail controller anda dan bina satu method atau function untuk memaparkan skrin foto popular.
function popular()
{
$this->load->library('instagram_api');
$data['page_title'] = 'Foto Popular';
$data['popular_media'] = $this->instagram_api->getPopularMedia();
$data['content'] = 'popular';
$this->load->view('bootstrap/index',$data);
}

 Langkah kelima:

Bina view anda dan gunakan kod seperti berikut untuk paparkan foto popular dari Instagram.
$atts = array(
'width' => '660',
'height' => '700',
'scrollbars' => 'yes',
'status' => 'yes',
'resizable' => 'yes',
'screenx' => '0',
'screeny' => '0'
);
foreach($popular_media->data as $data):
echo anchor_popup( 'igram/photopopular/?link='.$data->images->standard_resolution->url,
'<img src="' . $data->images->thumbnail->url . '" />',
$atts);
endforeach;

Ok, itu sahaja. Dan anda boleh lihat senarai foto popular yang dikeluarkan oleh Instagram. Untuk membina sebuah aplikasi yang lengkap, banyak lagi yang perlu dilakukan.

Ini hanya panduan awal bagaimana anda hendak memulakannya. Saya harap ia dapat membantu anda memahami bagaimana menggunakan API Instagram dengan CodeIgniter.

Selamat berusaha.
Share:

0 comments:

Post a Comment