Monday, May 9, 2016

Mari mengenal Android studio, IDE untuk aplikasi android

Mari mengenal Android studio, IDE untuk aplikasi android

Pengenalan tampilan dan fitur Android Studio, jika diibaratkan Tak kenal maka tak sayang, Jika Tak Sayang maka anda akan meninggalkan nya. Hal ini sebagai kebutuhan bagi pengguna baru Android Studio, apalagi yang baru Migrasi dari IDE Eclipse ke Android Studio. Akan tampak beda antara IDE Eclipse dan Android Studio, bahkan ada yang Mahir di Eclipse akan susah di Android Studio. Sedikit akan kita bahas tentang pengenalan penggunaan IDE Android Studio. Pembahasan masih saya gunakan Android Studio versi Linux.
Berikut Video nya :
Didalam penggunaan Android Studio ini, Untuk melakukan Update secara berkala bisa dilakukan tanpa harus memperbarui proyek Android Anda. Untuk memeriksa secara manual mengenai update ini, pilih Help > Check for update (pada Mac, pilih Android Studio > Check for update).
Berikut adalah tampilan utama ketika kita membuat project di Android Studio. Contoh ini ketika saya telah membuat sebuah project. Mengenai cara buat Project di Android Studio materi selenjutnya akan kita bahas.

Design Layout

Layout Android Studio
Layout Android Studio
  • Bagian sebelah kanan merupakan struktur Project yang telah kita buatkan
  • Bagian tengah, merupakan source code XML dengan mengaktifkan mode TEXT. mengetikkan code dimudahkan dengan fasilitas Auto Complet dengan cara mengetikkan code awal dan akan muncul pilihan nya.
  • Bagian sebelah kiri merupakan preview langsung berdasarkan kode XML yang kita tuliskan
  • Bagian bawah, untuk melihat source error, trouble (logCat) ketika Project di Jalankan (run)
ketika mode Design diaktifkan, tampilan akan menjadi seperti berikut :
Struktur Android STudio
Tampilan Mode Design
  • Mode Design akan menampilkan tools yang bisa kita gunakan secara Drag and Drop secara langsung ke layout aplikasi (ex. TextView, Button, dan semua widget)
  • Tampilan disamping merupakan bagian Properties untuk setting setiap widget.
Mode Design ini akan memudahkan para pengembang yang belum memahami desain layout aplikasi menggunakan kode XML. mode ini hanya dengan Drag and Drop saja.

Struktur Folder Project

Struktur folder project akan muncul ketika kita telah membuat sebuah project. Agak berbeda dengan struktur menggunakan IDE Eclipse. Berikut tampilan nya :
Struktur Project
Struktur Project

Penjelasan Struktur Project

Terdapat folder app, gradle dan file – file yang ada di root folder. Folder app/ adalah folder utama pada aplikasi android, didalamnya terdapat Folder manifest, Java dan res.
  • Folder manifest terdapat file Android Manifest.xml yang penjelasan nya akan kita bahas di materi berikutnya.
  • Folder Java terdapat file-file bahasa java yang terkelompokkan dalam beberapa Package.
  • Folder res terdapat drawable, layout, menu yang kesemua ini tujuan untuk menyimpan Gambar (drawable) desain tampilan file XML (layout) dan hal-hal lain yang berhubungan dengan tampilan aplikasi.

Gradle

Perbedaan Android Studio dan IDE eclipse salah satu nya adalah gradle, sebuah featured build automation. Eclipse tidak ada fitur ini. Selengkapnya dapat lihat di situs berikut ini http://www.gradle.org/. File Gradle berisi library yang digunakan, versi aplikasi, signed key properties, lokasi repository dll. File yang akan sering kita ubah adalah file build.gradle(module: app). Jika di Eclipse kita mengenal nya pada saat penambahan sebuah Library yang tipe .jar. namun penambahan library di Android Studio hanya dengan memanggil nya di Gradle bagian dependecies, contoh penambahan Script ini untuk menampilkan peta Google Maps pada aplikasi :
1
2
3
4
5
6
7
<pre>dependencies {
    compile fileTree(dir: 'libs', include: ['*.jar'])
    //compile files('libs/org.apache.http.legacy.jar')
    compile 'com.android.support:appcompat-v7:22.2.1'
    compile 'com.google.android.gms:play-services:7.8.0' 
    compile 'com.google.android.gms:play-services-maps:7.8.0'}</pre>
Struktur Android Studio
Tampilan Gradle
File ini berisi pengaturan untuk versi sdk yang di compile, package name app, build version yang digunakan, SDK Minimum yang digunakan, versioncode, versionname dan dependencies yang digunakan dalam aplikasi yang digunakan. Jika ada perubahan pada file ini, Android Studio akan mem Build secara langsung walaupun agak lama.

File Java

Pembuatan project Android jenis nya Native karena menggunakan bahasa pemrograman Java. berikut tampilan ketika mau mengubah atau menambahkan script Java.
Struktur Android Studio
Bahasa Java Android Studio
Bahasa Java terletak di Folder java, double Click file yang mau dibuka, kemudian halaman tengah akan muncul script Java yang bisa kita ubah dan sesuaikan dengan aplikasi yang kita buat.

Kesimpulan Pengenalan Tampilan dan Fitur Android Studio

  • Untuk bisa membuat project aplikasi menggunakan Android Studio, terlebih dahulu kita harus memahami tampilan dan fitur-fitur yang disediakan untuk kemudahan pengembangan
  • Tampilan IDE Android Studio berbeda dengan IDE Eclipse, makanya ada yang baru migrasi awal terkadang akan sedikit kesulitan.
Mengenal github, software VCS

Mengenal github, software VCS

Github Social Coding 

      Saya yakin, beberapa dari anda (atau mungkin kebanyakan) lebih mengenal github daripada Git. Ingat ya, Github dan Git adalah 2 hal yang berbeda. Jangan disamakan. Mereka hanya memiliki “hubungan khusus”.
Github, adalah penyedia Git Server untuk umum, dimana repositori project orang-orang tersimpan. Membuat repositori di Github gratis, namun terbatas hanya 1 repositori. Jika ingin lebih, maka harus beli paket berbayarnya.
     Github membantu para programmer untuk berkolaborasi pada berbagai project, terutama project opensource. Nah, Kolaborasi ini menggunakan software Git, lalu di upload (push) ke Github. Jadi, Github itu semacam tempat di mana para pengguna Git menyimpan repositori dan berkolaborasi dengan repositori orang lain.
     Github juga sangat berperan dalam mempopulerkan Git. Karena itulah mereka memiliki “hubungan khusus”.
     Karena Git merupakan repositori umum dan bisa gratis, maka tidak heran jika ada banyak sekali project opensource yang tersedia. Keterbukaan inilah yang menjadikan Github tidak hanya sekedar repositori, tetapi juga resource yang berharga untuk para programmer karena banyaknya produk opensource.
Kurang lebih itulah yang saya pahami mengenai kedua hal tersebut. Maklum saya juga belum lama ini baru belajar, heheh. Jika ingin lebih dalam, tentunya harus dipraktekkan.

Pengenal responsive design di pemrograman web

Sekarang banyak orang melakukan aktivitas online melalui device SmartPhone, seperti update status, upload gambar, dan tidak terkecuali mengakses sebuah website. Dengan keadaan yang seperti ini, mau tidak mau kita sebagai pemilik website harus memiliki website yang bisa diakses melalui device SmartPhone tersebut. Bagi yang menggunakan CMS seperti WordPress mungkin sudah tersedia pluginnya, tapi bagaimana dengan yang membuatnya dari awal atau nol atau menggunakan CMS yang belum tersedia plugin mobile tersebut? Tentunya harus membuat ulang websitenya dalam bentuk mobile bukan. Lalu bagaimana solusinya? Nah dengan hadirnya teknologi Responsive ini, kita hanya perlu menggunakan satu design saja untuk berbagai device yang ada. Ini adalah cara terbaik jika kita malas untuk mendevelop ulang website kita agar sesuai dengan mobile device.

APAKAH ITU RESPONSIVE DESIGN? 
Responsive Web Design adalah sebuah teknik yang digunakan untuk membuat layout website menyesuaikan diri dengan tampilan device pengunjung, baik ukuran maupun orientasinya. Jadi tampilan yang berada di desktop komputer dengan tampilan yang diakses melalu SmartPhone misalnya, itu akan berbeda tampilannya. Responsive Web Design Untuk mengetes tampilan yang menggunakan teknik Responsive tersebut tidak harus mengaksesnya melalui mobile device ataupun device lainnya, namun cukup dengan meminimize browser saja ke dalam ukuran mobile device yang diinginkan, kita sudah dapat melihat tampilan website kita pada layar mobile device.


KELEBIHAN DAN KEKURANGAN
Teknik ini sudah mulai banyak digunakan dikalangan web desainer luar maupun lokal dan memiliki beberapa keuntungan, salah satunya adalah penghematan penggunaan sub domain, yang tadinya kalau mengakses harus menggunakan kata “mobile” atau “m” didepan domainnya, sekarang cukup dengan mengetik nama domainnya saja dan tampilan akan menyesuaikan dengan device yang digunakan. Keuntungan yang paling utama tentu saja dapat mengurangi jumlah development menjadi satu saja untuk dipakai semua devices. Lalu kelemahan dari teknik ini adalah jika digunakan pada website yang bertujuan untuk menampilkan gambar saja, seperti website fotografi misalnya. Resource gambar yang diload oleh device kita akan sama dengan yang diload dikomputer kita. Untuk itu kita perlu memperhatikan apakah website yang kita buat cocok untuk dipakaikan teknik Responsive ini.


BAGAIMANA CARA MENGGUNAKANNYA?
 
 Teknik ini sama saja dengan kita membuat design dengan HTML dan CSS. Namun setelah selesai membuat tampilan untuk desktop, kita harus buat satu file CSS untuk device lainnya. Untuk file CSS yang kedua, pembuatannya akan sedikit berbeda dengan CSS yang pertama, karena adanya trik khusus yaitu Media Queries Boilerplate, yang digunakan untuk mendeteksi layar device. Berikut kode yang digunakan untuk mendeteksi layar device yang digunakan:

*Smartphones (portrait and landscape) ----------- */
@media only screen
and (min-width : 320px)
and (max-width : 480px)
{ /* Styles */ }
/* Smartphones (landscape) ----------- */
@media only screen
and (min-width : 321px)
{ /* Styles */ }
/* Smartphones (portrait) ----------- */
@media only screen
and (max-width : 320px)
{ /* Styles */ }
/* iPads (portrait and landscape) ----------- */
@media only screen
and (min-width : 768px)
and (max-width : 1024px)
{ /* Styles */ }
/* iPads (landscape) ----------- */
@media only screen
and (min-width : 768px)
and (max-width : 1024px)
and (orientation : landscape)
{ /* Styles */ }
/* iPads (portrait) ----------- */
@media only screen
and (min-width : 768px)
and (max-width : 1024px)
and (orientation : portrait)
{ /* Styles */ }
/* Desktops and laptops ----------- */
@media only screen
and (min-width : 1224px)
{ /* Styles */ }
/* Large screens ----------- */
@media only screen
and (min-width : 1824px)
{ /* Styles */ }
/* iPhone 4 ----------- */
@media
only screen and (-webkit-min-device-pixel-ratio : 1.5),
only screen and (min-device-pixel-ratio : 1.5)
{ /* Styles */ }

Nah, tinggal disesuaikan saja dengan kebutuhan kita bukan, ingin membuat di layar dengan ukuran yang mana. Lalu bagaimana implementasinya kedalam design kita?


KESIMPULAN

Teknik Responsive memang bagus digunakan untuk optimasi layout sebuah website. Namun penggunaanya pun harus disesuaikan dengan tipe websitenya sendiri, apakah akan “cocok” bila digunakan teknik ini pada website tersebut. Untuk website yang bertujuan hanya untuk menampilkan gambar seperti website fotografi, lebih baik membuat versi mobile-nya saja, agar tidak memakan resource yang terlalu banyak. Demikian tutorial singkat mengenai Responsive Web Design, semoga bermanfaat.

Saturday, May 7, 2016

Pengenalan struktur bootstrap



Bootstrap adalah framework ataupun tools untuk membuat aplikasi web ataupun website yang bersifat responsive secara cepat, mudah dan gratis.
Responsive disini berarti bahwa tampilan web (lebar dan susunan isinya) dapat berubah secara otomatis sesuai dengan lebar layar yang menampilkannya.
Bootstrap dapat didownload dengan gratis dari website resminya dengan alamat getbootstrap.com atau juga bisa lewat github.
Pada saat di download, bootstrap masih dalam 1 paket zip. Untuk bisa menggunakannya, harus di ekstrak/di unzip terlebih dahulu. Setelah di ekstrak, maka akan didapatkan 3 buah folder antara lain css, fonts, dan js.
Pada folder css terdapat enam file, yaitu :
  • bootstrap.css, file css yang biasanya digunakan untuk development, karena disusun sedemikian rupa agar mudah dibaca dan terdapat banyak comment.
  • bootstrap.css.map, file css yang dihasilkan oleh CSS Preprocessor, seperti Sass, Less, atau Stylus.
  • bootsrap.min.css, file css yang biasanya digunakan dalam production, karena sudah di kompresi agar ukuran filenya lebih kecil.
  • bootstrap-theme.css, file css tambahan terhadap file bootstrap.css, fungsi file ini memperkaya dan memperindah tampilan beberapa komponen bootstrap seperti button, thumbnail, dropdown, navbar, dan sebagainya. Karena sifatnya tambahan, file ini boleh saja tidak kita gunakan.
  • bootstrap-theme.css.map, file ini sama seperti bootstrap.css.map adalah file css yang dihasilkan oleh CSS Preprocessor. Fungsinya agar dapat di edit menggunakan development tool yang ada pada browser Firefox dan Chrome.
  • bootstrap-theme.min.css, versi mini (compressed) dari file boostrap-theme.css digunakan pada saat production.
Pada folder fonts terdiri dari lima file, biasa disebut dengan glyphicons yang berisi 263 icon.
Pada folder js (javascript) terdiri dari tiga file, yaitu bootstrap.js dan versi mininya yaitu bootstrap.min.js dan file npm.js
File bootstrap.js berisi fungsi-fungsi javascript yang langsung dapat digunakan (plug-in) untuk membuat tampilan komponen bootstrap lebih interaktif.
Adapun file npm.js hanya digunakan apabila kita menggunakan bootstrap bersama dengan node.js
Pengenalan java

Pengenalan java

     Dalam Java ada 2 jenis program berbeda, yaitu aplikasi dan applet. Keduanya merupakan bagian dari execute, dimana execute merupakan salah satu fase kelima dalam siklus program Java. Aplikasi adalah program yang biasanya disimpan dan di eksekusi dari komputer lokal. Applet adalah program yang biasanya disimpan pada komputer yang jauh,yang dikoneksikan pemakai lewat web browser. Komputer jauh menjalakan web server yang memberi layanan terhadap permintaan web browser.
    Kebanyakan bahasa pemrograman modern berdiri di atas pustaka-pustaka kelas yang telah ada untuk mendukung fungsionalitas bahasanya. Pada bahasa Java, kelompok-kelompok kelas yang berkaitan erat dimasukkan dalam satu paket, bervariasi sesuai edisi Java.
     Java adalah bahasa yang dapat dijalankan dimanapun dan di sembarang platform apapun, di beragam lingkungan: Internet, intranets, consumer electronic products, dan computer applications. Untuk beragam aplikasi yang dibuat dengan bahasa Java, Java dipaketkan dalam edisi-edisi berikut:
  • Java 2 Standar Edition (J2SE), J2SE menyediakan lingkungan pengembangan yang kaya fitur, stabil, aman, dan cross-platform. Edisi ini mendukung konektivitas basis data, rancangan user interface, masukkan/ keluaran (input/ output), dan pemrograman jaringan (network programming), dan termasuk sebagai paket-paket dasar bahasa Java.
  • Java 2 Enterpise Edition (J2EE), J2EE menyediakan tempat untuk membangun dan menjalankan multitier enterprise editions. J2EE berisi paket-paket di J2SE ditambah paket-paket untuk mendukung pengembangan Enterprise JavaBeans, Java Servlets, JavaServer Pages, XML, dan kendali transaksi yang fleksibel.
  • Java 2 Micro Edition (J2ME), J2ME selain menyedikan bahasa Java yang sama, unggul dalam portabilitas (kemampuan dapat dijalankan dimanapun), safe network delivery, seperti J2SE dan J2EE. Aplikasi-aplikasi dapat diskalakan (dimampukan) agar dapat bekerja dengan J2SE dan J2EE. J2ME adalah untuk beragam consumer electronic product, seperti pager, smart card, cell phone, handheld PDA, dan set-top box.
     Ada 3 kombinasi kunci yang membuat Java menjadi teknologi yang secara fundamental berbeda dari yang lain, yang ada saat ini. Pertama, semua orang dapat menggunakan applet yang kecil, aman, dinamik, lintas-platform, aktif, dan siap dijalankan di jaringan sejak awal. Kedua, Java adalah bahasa pemrograman yang ampuh, memiliki kekuatan desain berorientasi objek dengan sintaks yang sederhana dan mudah dikenal. Ketiga, Java adalah kumpulan class object yang ampuh, yang melayani programmer dengan uraian yang jelas untuk banyak fungsi sistem umum, seperti pembuatan window, penggunaan jaringan, dan input/ output.

Beberapa Fitur Penting Dalam Bahasa Java

  • Bahasa Sederhana
    • Explicit pointer manipulation
    • Implicit type casting
    • Structures atau union
    • Operator overloading
    • Templates
    • Header files
    • Multiple inheritance
  • Java dirancang untuk mudah dipelajari dan digunakan dengan secara efektif. Java tidak mendukung fitur-fitur rumit seperti:
    Rancangan bahasa Java telah berdasar teknologi yang telah terbukti dan dikembangkan di bahasa-bahasa pemrograman lainnya.
  • Bahasa berororientasi objek
  •     Java bukan turunan langsung dari bahasa pemrograman manapun, juga sama sekali tidak kompatibel dengan semuanya. Model objek Java adalah sederhana dan mudah dikembangkan, namun sejalan dengan itu, nilangan dan tipe data sederhana lain dianggap sebagai non-objek berkinerja tinggi.
       OOP (object oriented programming) adalah cara ampuh dalam pengorganisasian dan pengembangan perangkat lunak. Pada OOP, program komputer sebagai sekelompok objek yang saling berinteraksi. Objek-objek ini ada secara secara independent yang mempunyai aturan-aturan berkomunikasi dengan objek lain dan untuk memerinthakan objek lain guna meminta informasi tertentu atau meminta objek lain mengerjakan sesuatu.
  • Bahasa statically typed
  •      Semua objek dideklarasikan terlebih dahulu sebelum digunakan. Melalui fitur ini kode program lebih dapat dioptmasi untuk menghasilkan program berkinerja tinggi.
  • Bahasa dikompilasi
  •      Sebelum menjalankan program di bahasa Java, program dikompilasi menggunakan Java Compiler. Kompilais akan menghasilkan file “bytecode” yang serupa fungsinya dengan file kode mesin. Program “bytecode” yang dihasilkan dapat di eksekusi di sembarang Java Interpreter. Java Interpreter membaca file “bytecode” dan menterjemahkan perintah “bytecode” menjadi perintah-perintah bahasa mesin yang dapat di eksekusi mesin.
  • Bahasa yang aman
    1. Bytecode verifier membaca bytecode sebelum dijalankan dan menjamin bytecode memenuhi aturan-aturan dasar bahasa Java
    2. Class loader menangani pemuatan kelas Java ke runtime interpreter.
    3. Manajer keamanan menangani keamanan tingkat aplikasi dengan mengendalikan apakah program berhak mengakses sumber daya seperti sistem file, port jaringan, proses eksternal dan sistem windowing.
    1. Bahasa dirancang untuk mempersulit eksekusi kode perusak
    2. Program Java dikompilasi menajdi serangkaian bytecode.
    3. Java mempunyai pengamanan terhadap applet.
  • Java menggunakan model pengamanan 3 lapis untuk melindungi sistem dari Untrusted Java Code.
    Selain itu Java menyediakan beragam teknik pengaman, yaitu:
  • Bahasa indpenden terhadap platform
  •      Platform independence merupakan kemampuan program bekerja di sistem operasi atau sistem komputer berbeda. Bahasa Java adalah bahasa yang secara sempurna tidak bergantung platform.
  • Bahasa multithreading
  •      Thread adalah menyatakan program komputer melakukan lebih dari satu tugas di satu waktu yang sama. Java menyediakan kakas untuk menulis program multithread, program mempunyai lebih dari 1 thread eksekusi pada saat yang sama sehingga memungkinkan program menagani beberapa tugas secara konkuren.
  • Bahasa yang didukung garbage collector
  •       Artinya, program tidak perlu menghapus sendiri objek-objek yang tidak digunakan lagi. Fasilitas ini mengurangi beban pengelolaan memori oleh pemrogram dan mengurangi atau mengeliminasi sumber kesalahan terbesar yang terdapat di bahasa yang memungkinkanalokasi dinamis.
  • Bahasa yang tegar
  •    Java interpreter memeriksa semua akses sistem yang dilakukan. Program java tidak dapat menyebabkan crash terhadap sistem. Java mempunyai mekanisme exception handling yang ampuh. Exception-handling menyediakan cara untuk memisahkan antara bagian penanganan kesalahan dengan bagian kode normal sehingga menuntun ke struktur kode program yang lebih bersih dan menjadikan aplikasi lebih tegar.