TUGAS 1 Aplikasi Web Dinamis Lanjut Mengenal Composer dan GitHub (Update Oktober 2016) Disusun Oleh Wawan Chahyo Nugroho ( )

Transkripsi

1 TUGAS 1 Aplikasi Web Dinamis Lanjut Mengenal Composer dan GitHub (Update Oktober 2016) Disusun Oleh Wawan Chahyo Nugroho ( ) SEKOLAH TINGGI MANAJEMEN INFORMATIKA DAN ILMU KOMPUTER EL RAHMA YOGYAKARTA 2016

2 POKOK BAHASAN 1. Buatlah tutorial / panduan singkat penggunaan composer pada pengembangan aplikasi webbase dengan framework CodeIgniter (CI). Didalam tutorial memuat informasi : Apa itu composer? Mengapa harus menggunakan composer? Bagaimana cara instalasinya? Platform os linux or windows Misal saya mau menambah library dompdf di framework CI bagaimana caranya? Sertakan screenshotnya. 2. Buatlah tutorial / panduan singkat tentang penggunaan git versioning pada pengembangan webbase. Didalam tutorial memuat informasi : Apa itu git versioning (github)? Mengapa dalam pengembangan software pada tim kolaborasi perlu keahlian menggunakan git versioning? Bagaimana cara membuat repository? Apa kegunaan branch? Bagaimana cara menunduh update data terbaru dari repository? Bagaimana cara memberikan komentar dan mengirim pekerjaan anda ke repository? Sertakan screenshotnya. Update Oktober 2016 C. Silahkan clone pada link github dibawah ini : Saya sudah buatkan 1 contoh Categories.php untuk menampilkan data categories pada database northwind, buatkan class products untuk menampilkan data produk. Kemudian file product Anda push ke repositori dengan membuat branch baru dengan nama branch nim Anda. Dikumpulkan paling lambat tanggal 19 Oktober 2016 Jam WIB. Di elera.stmikelrahma.ac.id menu assigment web dinamis lanjut. NB : Mengutip harap menyertakan sumbernya. Copas dan atau terindikasi plagarisme tidak dinilai, tulislah dengan gaya bahasa Anda.

3 COMPOSER A. Apa itu composer? Composer adalah tool manajemen dependensi (ketergantungan) di PHP. Hal ini memungkinkan developer untuk mendeklarasikan berbagai macam library pada proyek mereka, sehingga membantu developer untuk melakukan install maupun update library mereka secara otomatis. B. Siapa pencipta composer? Twitter Facebook Google+ Linkedin GitHub Blog : naderman@naderman.de : : : : : : Nils Adermann Twitter Facebook Google+ Linkedin GitHub Blog : j.boggiano@seld.be : : : : : : Jordi Boggiano

4 C. Mengapa harus menggunakan composer? Karena composer dapat menjembatani Anda dari dependensi (ketergantungan) dengan developer pihak ketiga yang bersifat "bebas", dengan begitu Anda tidak perlu khawatir terhadap perubahan maupun pembaruan pada framwork yang sedang Anda gunakan, entah itu library maupun versinya. Ilustrasi : Anda adalah seorang developer web pada suatu perusahaan dengan memberdayakan framwork CodeIgniter, suatu ketika pengembang framework tersebut menambahkan beberapa komponen pada library tertentu, dan ternyata komponen itu saling terkait dengan komponen lainnya, lalu agar framework pada website klien Anda bekerja maksimal, apakah Anda harus redownload libray tersebut satu-persatu lalu reupload kembali? itu adalah hal konyol untuk dilakukan, karena sudah saatnya Anda menggunakan "tool dependecy managemet" yaitu Composer. D. Bagaimana cara instalasi composer? Syarat Minimum Versi PHP Instalasi di Windows Download dan jalankan Composer-Setup.exe, maka composer versi terakhir akan diinstal sekaligus mengatur PATH, sehingga Anda dapat memanggilnya dari direktory manapun via command line. 1.Dobel klik Composer-Setup.exe >> Next, 2.Pilih install Shell Menus >> Next,

5 3.Cari lokasi file php.exe >> Open >> Next, Sekarang pengaturan instalasi telah siap. Dialog di bawah ini menampilkan summary pengaturan pada platform Anda, sampai di sini Anda masih bisa meninjau maupun memperbaiki pengaturan jika sekiranya diperlukan, jika dirasa sudah benar, maka >> Install,

6 Dialog dibawah ini menginformasikan bahwa pengaturan telah merubah variabel path Anda, tapi tidak semua program yang berjalan akan menyadari hal ini. Untuk menggunakan Composer pertama kalinya, Anda perlu melakukan beberapa hal di bawah ini: - Buka jendela baru cmd - Tutup semua jendela Windows Explorer,lalu buka jendela baru cmd - Logoff >> Login >> lalu buka jendela baru cmd Menu Shell Mungkin Anda perlu menutup semua jendela Windows Explorer yang terbuka sebelum Anda menjalankan Composer dari menu shell.

7 E. Bagaimana cara menggunakan composer? Misalnya kita akan gunakan composer untuk menambahkan library dompdf di framework CI, maka langkah yang perlu kita lakukan adalah : 1. Mengecek ketersediaan composer via CLI dengan cara kita panggil dari sembarang direktori; Jika tersedia, maka akan menampilkan logo dan menu pilihan composer, selanjutnya close CLI dan kita siap untuk menggunakannya. 2. Berikutnya kita tambahkan file composer.json ke direktori yang kita kehendaki, misal library CI

8 3. Lalu kita edit composer untuk menambahkan dompdf dengan cara seperti ini : 4. Masih dalam direktori yang sama yaitu library CI, berikutnya kita gunakan composer dengan cara klik kanan >> Use Composer here Maka secara otomatis jendela CLI akan terbuka,

9 5. Berikutnya kita tinggal ketik saja perintah composer update untuk mengakses composer.json yang telah kita edit sebelumnya, agar bisa menambahkan plugin dompdf versi terbaru, pastikan Anda terhubung dengan internet. Maka, kita akan memperoleh hasil seperti di bawah ini (tunggu sampai proses download selesai), Di dalam paket vendor terdapat plugin dompdf beserta komponen pendukungnya,

10 GitHub A. Apa itu git versioning (github)? GitHub adalah layanan repository (penyimpanan) project berbasis web, guna membangun perangkat lunak secara kolaboratif bersama komunitas. Lebih dari 29 proyek dan 11 juta orang telah bergabung di dalamnya, mereka bersama pengembang lainnya dapat menemukan, menggunakan dan berkontribusi dengan alur kerja yang kuat. Version Control System (VCS) atau disebut juga dengan Git, adalah jantungnya GitHub yang bersifat open source, dimana bertanggung jawab atas segala sesuatunya terkait GitHub yang berjalan pada lokal komputer Anda. VCS atau Git diciptakan oleh Linus Torvalds pada tahun 2005 yang diterapkan pada versi kernel Linux. B. Manfaat menguasai keahlian git versioning Agar kita dapat mengembangkan perangkat lunak secara team work (kolaborasi) Agar pengerjaan proyek lebih cepat, efektif, efisien dan produktif Agar mendapatkan kualitas proyek terbaik, karena setiap tim bisa saling kontrol C. Cara membuat Repository Dalam hal ini, saya asumsikan bahwa Anda sudah memiliki akun GitHub, cara registrasinya mudah, sama halnya saat Anda registrasi pada facebook, twitter, kaskus, dll. Untuk menempatkan proyek pada GitHub, maka Anda perlu membuat repository, caranya : 1. Di sudut kanan atas ada tanda + >> klik, maka muncul menu dropdown >> klik New repository

11 2. Buat nama repository singkat saja, agar mudah untuk diingat, misalnya "hello-elrahma" 3. Opsional, menambahkan deskripsi repository Anda, misalnya "Proyek studi ilmu komputer angkatan 2013" 4. Tentukan previlage (hak akses) untuk repository Anda, Public atau Private. Repository public adalah pilihan untuk memulai bekerja bersama pengguna GitHub lainnya, sehingga Anda bisa mendapatkan keuntungan dari kolaborasi bersama komunitas. Repository private adalah pilihan untuk memulai bekerja secara independent ataupun individu, dimana fitur yang disediakan lebih sedikit dibanding public dan Anda juga bisa menentukan kepada siapa ingin berkolaborasi. 5. Select Initialize this repository with a README. 6. Klik Create repository.

12 Selamat!, sekarang Anda sudah memiliki repository, Disana ada beberapa fitur seperti commit, branch, release dan contributor, namun mari kita mulai terlebih dahulu dari apa itu branch? Branch (cabang) adalah pengaturan untuk menentukan tujuan, fungsi atau keperluan dari proyek Anda, secara default biasanya sebagai master. Anda bisa merubahnya menjadi lebih spesifik untuk keperluan lain, contoh;

13 D. Fungsi Branch Untuk mengembangkan fitur Untuk memperbaiki bug (error atau konflik) Untuk ber-eksperimen dengan ide-ide baru secara aman dan leluasa E. Cara Download Repository F. Mengirim Project ke Repository 1. Download dan Install GitHub Desktop di 2. Double klik GitHubSetup.exe, maka mucul dialog untuk meminta permisi dari Anda, setelah Anda setujui, maka secara otomatis installer GitHub akan mengidentifikasi system komputer Anda, kemudian melakukan instalasi secara online, tunggu sampai proses selesai.

14 3. Setelah proses selesai, icon shortcut GitHub secara otomatis akan ada pada Desktop PC Anda, Double Klik icon tersebut, maka akan tampil jendela seperti ini, silakan login! 4. Setelah berhasil masuk, berikutnya kita tinggal menambahkan project CI ke repositori yang telah ada, misalnya ke dalam hello-elrahma, caranya sebagai berikut : 1) Secara default shell / CLI adalah Cmd (windows), silakan pilih sesuai selera >> Klik Save Berikutnya lakukan remote untuk repository yang telah dibuat di server GitHub misal helloelrahma, melalui link repository, selengkapnya silakan simak langkah berikut ini:

15 2) Klik Save >> Tool and Options >> Repository settings.. 3) Klik Remote, maka akan disediakan field kosong untuk menaruh link repository Anda, NB : Sebelum Anda menekan tombol Ok, terlebih dahulu paste HTTP clone URL pada field yang telah disediakan, adapun cara meng-copy silakan simak langkah dibawah ini:

16 4) Buka repository yang ada di host GitHub via browser, lalu copy HTTP clone URL, 5) Sekarang, saatnya bekerja dengan CLI untuk mengupload project ke repository yang ada di host GitHub, caranya, Klik Tools and Options >> Open in Git Shell 6) Ketik $ git init untuk menginisialisasi project lokal di komputer Anda,

17 7) Ketik $ git add. untuk menambahkan file ke repository lokal. 8) Ketik $ git commit -m "First commit", untuk mempersiapkan file yang telah Anda tambahkan ke dalam repository lokal. 9) Copy URL remote,

18 10) Ketik $ git remote add origin remote repository URL 11) Ketik $ git remote v untuk verifikasi remote,

19 12) Ketik $ git push origin master untuk mengeksekusi project lokal upload ke repository di host GitHub, Maka akan menampilkan proses seperti di bawah ini, tunggu sampai proses selesai, File telah berhasil di push ke repository,

20 13) Selamat!, sekarang repository Anda memiliki project baru, Sebelum, Sesudah,

21 G. Memberi Komentar di Repository 1. Pilih menu Commits 2. Pilih First commits 3. Klik Changed files untuk meminimize file yang terbuka, sehingga memungkinkan Anda untuk melihat seluruh file yang ada di dalam repository tanpa banyak melakukan scroll.

22 4. Misalnya kita akan memberikan komentar pada file autoload.php, klik autoload.php 5. Menambahkan komentar Wow good job bro! pada baris 43. Caranya, tekan tanda (+) pada baris yang dikehendaki, misal Selamat!, Anda berhasil menambahkan komentar di repository, COMPOSER COMPOSER

23 CONTRIBUTION Dalam studi kasus ini, secara tidak langsung kita akan diajarkan bagaimana caranya menjadi kontributor pada suatu project, dengan menggunakan github dan berkolaborasi bersama kontributor lainnya. Sebelum praktek, ada baiknya jika kita mengenal terlebih dahulu tentang Apa itu Repository? Repository adalah pusat data suatu proyek yang dikebangkan secara individu atau bersama-sama (kolaboratif). Di GitHub, sebuah repository biasanya digunakan untuk mengatur suatu proyek. Dimana repository tersebut bisa berisi folder dan file, gambar, video, spreadsheet, dan rangkaian data apapun yang diperlukan dalam suatu proyek, termasuk README, atau beberapa informasi tentang proyek Anda. Dalam studi kasus ini, ada beberapa poin yang perlu kita lakukan: 1. Fork Repository 2. Clone atau Download repository 3. Uji cara kerja repository di lokal PC 4. Buat file baru, termasuk classnya 5. Push file baru ke repository. Mari kita mulai: 1. Fork Repository Dikarenakan kita tidak punya akses langsung terhadap master repository, maka kita fork terlebih dahulu. Sebab jika kita menggunakan langsung URI master repository, maka akan mengalami status error 403 saat kita melakukan push project. Silakan menuju ke lalu fork. Hasil fork bisa dilihat di profil GitHub masing-masing

24 2. Clone atau Download repository Cloning repository menggunakan URI hasil Fork : Metode Clone atau Download sama saja, jika Clone, maka perlu Aplikasi Desktop GitHub untuk melakukannya, jika Download, maka cukup via browser, contoh: a. Buka link di atas b. Klik Clone or Download >> Open in Desktop >> Launch Application. c. Muncul dialog untuk menentukan lokasi direktori, saya pilih folder www di wampserver. Gb. Proses Cloning berlangsung d. Jika Anda menggunakan metode Download, maka repository akan terunduh dalam kemasan ZIP.

25 3. Uji cara kerja repository di lokal PC Saya asumsikan bahwa database northwind telah terinstall di PC Anda. Selanjutnya kita running file Category.php via wampserver. 4. Buat file baru, termasuk classnya Pada tahap ini kita diminta membuat file Products untuk menampilkan data products yang ada di database northwind. Maka langkah yang perlu kita lakukan adalah copy dan modifikasi file Category.php. Saya copy file Category dan rename menjadi Products, berikut modifikasinya: <?php include "Database.php"; class Products{ private $tablename; public $db; public function construct(){ $this->tablename= "products"; $this->db = Database::getInstance()->getConnection(); } public function lisproduk(){ $result = $this->db->query("select * FROM ".$this->tablename); } } return $result;?> $produk = new Products(); $result=$produk->lisproduk(); $data='<h3>data Produk</h3>'; $data.='<ol>'; while($row = $result->fetch_object()){ $data.= '<li>'.$row->productname.'</li>'; } $data.= '</ol>'; echo $data;

26 Sekarang kita uji file modifikasi (Products.php) 5. Push file baru ke repository Pada tahap ini kita diminta push file products ke repository, tapi dengan syarat membuat branch baru bernama NIM masing-masing. a. Buka Aplikasi Desktop GitHub >> Pilih repository webdinamislanjut b. Membuat branch baru terlebih dahulu dengan nama NIM masing-masing. c. Pastikan Anda telah beralih ke branch baru,

27 d. Optional, saya tambahkan summary dengan informasi berikut, klik Commit to e. Push File yang telah Anda buat dengan cara menekan tombol Publish Selamat!, Tugas Anda InsyaAllah Beres. Lihat hasilnya di: >> Graph >> Network atau Member Gb. Tampilan Network Gb. Tampilan Member

28 Referensi Tentang Composer : Tentang GitHub : Tentang Contribution Definisi Repository : Push File :