Selasa, 21 Mei 2019

Membuat Kalkulator BMI Swift dan UIKIT #IOSDEV

halo semuanya, kali ini saya mau membagikan project kecil kecilan saya yang terinspirasi dari apps di appstore, kali ini saya mau membuat kalkulator BMI menggunakan swift dan UIKIT, kalkulator BMI adalah kalkulator untuk mengukur apakah berat badan kita termasuk kedalam kurus, normal, gemuk atau obesitas, dengan memanfaatkan UIKIT saya akan menyajikan kalkulator dengan tampilan lebih interaktif. berikut tampilan kalkulatornya.




kalkulator ini memiliki beberapa komponen yaitu :

1. slider
2. label
3. segmented control

slider kita gunakan untuk mengatur angka yang ingin di inputkan oleh user, kita batasi sesuai dengan berat dan tinggi manusia pada umumnya.

label kita gunakan untuk menampilkan hasil dari input user dan memberikan judul dari komponen tertentu.

segmented control digunakan untuk memberikan efek dark dan light mode seperti aplikasi telegram dan twitter.

oke lanjut saja ke langkah2nya.

1. buat project xcode dengan nama BMICalculator
2. lalu siapkan semua komponen sesuai UI pada gambar aplikasi di atas
note: untuk emoticon menggunakan label component
3. tambahkan constraint (bila perlu)
4. tambahkan kode program seperti berikut





untuk UIKIT, posisikan komponen kalian seperti ini.

bills macbook

pastikan outlet dan action kalian terkoneksi, apabila belum silahkan koneksikan.

dan jika selesai, run aplikasinya dan selesai sudah. :) goodluck guys. smoga bermanfaat


Selasa, 23 April 2019

Apa itu DevOps? #DEVOPS



hallo semuanya, kali ini saya mau sharing sesuatu tentang devops yaitu devinisi tentang devops, Apa itu devops? devops adalah salah satu profesi IT yang melingkupi tentang development and operation, maksutnya apa? pada development kita membutuhkan lingkungan development dan deployment yang related dan sesuai sehingga saat proses development dan proses deployment aplikasi yang kita buat bisa berjalan dengan lancar, garis besarnya adalah devops berperan sebagai jembatan untuk developer untuk mengatur atau menyediakan lingkungan development dan deployment dengan baik dan sesuai.

Kalau menurut saya DevOps lebih kepada mindset seseorang. DevOps sendiri gabungan dari Development dan Operation yang merupakan kolaborasi dari kedua tim.
Mindset itu mesti dipahami oleh setiap individu dalam tim, bahwa proses development dan delivery sebuah produk (umumnya berupa software) harus dapat dilakukan dengan cepat.
Tujuannya adalah supaya dapat merespon perubahan (responding to a change) demi perubahan yang terjadi dalam proses development maupun perubahan atas permintaan pasar. - Samsul Ma'arif - DevOps DOT Indonesia
 

contoh arsitektur sederhada adalah sebagai berikut.

source : wp.com

gambar di atas adalah contoh arsitektur sederhana yang biasa kita temukan, contoh arsitektur yang rumit seperti berikut. 

source : indosystem.com

bagaimana? rumit nggk? itulah dimana devops di butuhkan arsitektur serumit ini sangat tidak di sarankan untuk di kerjakan oleh developer saja. sangat membuang2 waktu dan bisa menjadi beban yang berat bagi developer untuk mengerjakannya.

contohnya, tokopedia, bukalapak, gojek dll. mereka adalah aplikasi yang sangat kompleks dan besar, tidak mungkin aplikasi sekelas perusahaan tadi hanya memiliki arsitektur seperti gambar pertama, karna banyak sekali aspek yang di perhatikan oleh perusahaan digital untuk mengoptimalkan layanannya agar dapat diberikan kepada pengguna dengan aman dan nyaman.

devops cenderung menekuni dunia linux, hal ini dikarenakan server dan support automation pada server lebih banyak untuk lingkungan linux. seperti jenkins, jira, dll.



Minggu, 14 April 2019

Membuat Halaman Signin dengan Memanfaatkan Stack View di XCODE #IOSDEV

Halo semuanya kali ini kita akan belajar xcode lagi, judul kali ini adalah menggunakan stack view di xcode, stack view adalah salah satu jenis view yang bisa membuat komponen di dalam view tesebut menjadi tesusun secara bertumpuk. stack view memiliki 2 jenis yaitu stack view horizontal dan vertical, sesuai dengan namanya stack view horizontal bisa membuat komponen di dalamnya menjadi berjejer secara horizontal, sedangkan vertical bisa membuat komponen di dalamnya menjadi bertumpuk atau berjejer vertical.

stack view berperan penting dalam dunia layouting aplikasi, untuk melakukan penumpukan komponen cukup menggunakan stack view kita bisa mendapatkan hasil yang sesuai dan lebih praktis, apabila kita tidak menggunakan stack view atau bisa di asumsikan kita menggunakan margin dan constraint maka pekerjaan kita menjadi lebih rumit dan prosesnya lebih lama.

berikut ilustrasi dari stack view. 

source : developer.apple.com

pada gambar di atas ada stack view yang di dalamnya terdapat 3 komponen yaitu : label, image view dan button. saat kita memasukkan komponen2 tersebut kedalam stack view, mereka otomatis langsung berurutan seperti di atas sesuai posisi urutan yang kita mau.

sudah paham kan? oke, kita langsung lanjut ke langkah langkahnya.

1. Buat project xcode
2. Masuk ke storyboard, tekan command+shift+L > pilih stack view vertical


3. Drag and drop di storyboard. pastikan urutan komponen seperti gambar dibawah.

4. Tambahkan 3 button di dalam stack view.

note: pada langkah ini kita sudah bisa melihat bahwa 3 componen yang kita tambahkan tadi langsung bertumpuk sejajar saat kita masukkan satu2. itulah gunanya stack view (vertical).

5. buat agar stackview memiliki rata tengah horizontal dan vertical. dengan cara klik align menu pada kanan bawah storyboard > lalu klik centang horizontal dan vertical > add constraint.


note : pada langkah ini harusnya component stack view sudah di tengah vertical dan horizontal.

6.  Tambahkan asset untuk mempercantik halaman login kita. klik Assets.xcassets > drag and drop asset dari finder ke dalam xcode. seperti berikut



7.  tambahkan 2 label. satu didalam stack view, lainnya di atas stackview. seperti ini.


8. Ganti properties pada setiap komponen sesuai list dibawah.


  • LabelA (text : "Batavia Hack Town") atau terserah kalian
  • LabelB (text: "Choose your login")
  • ButtonA (title: "Sign in with Facebook", background: "FB", text color: "white")
  • ButtonB (title: "Sign in with Google", background: "google", text color: "black")
  • ButtonC (title: "Sign in with Email", background: "email", text color: "black")
  • StackView (spacing: 10, distribution: "fill equal")
sehingga terlihat seperti ini


9. tambahkan constrain pada LabelA dengan cara seperti berikut .



dan hasilnya akan jadi seperti ini .


10. tambahkan sedikit property pada LabelA untuk mempercantik. 

LabelA (font style: light, font size: 50)

11. tambahkan image view, lalu ganti property image pada imageview menjadi "background" lalu ganti content mode menjadi "aspect fill". tambahkan constraint sesuai dengan gambar dibawah ini. 


note: pastikan constrain yang di tuju adalah super view, seperti berikut.



setelah itu hasilnya akan seperti ini.


here we are, sudah selesai lah kita pada akhir tutorial ini. apabila ada pertanyaan silahkan layangkan di komentar. good luck and thankyou :) 

Jumat, 12 April 2019

Menggunakan GIT di XCODE #IOSDEV

Hallo semuanya kali ini saya mau berbagi tutorial tentang cara untuk menggunakan git di xcode, git adalah salah satu tools untuk version control suatu software yang kita buat agar dapat di ketahui jejak track codingan kita dan juga kita bisa berkolaborasi dengan orang lain untuk membangun software bersama sama. nah di IDE xcode sudah diberikan fitur khusus untuk mengkoneksikan xcode project kita ke git repository, gmn caranya? ayok kita lakukan bersama sama.

#REQUIREMENT
  • github account
  • git terinstall di laptop
  • ssh public key local laptop kalian sudah terinstall di github account kalian
#LANGKAH-LANGKAHNYA


1. buat repository terlebih dahulu seperti ini


2. copy link repository online kalian menggunakan link ssh (optional: kalian bisa pakai http)


3. tambahkan remote repository pada xcode. klik source control navigation > pilih Remotes > klik kanan > Add Existing Remote > Paste link repository kalian tadi .


4. klik menu Source Control > Fetch and Refresh Status



5. Lakukan Commit. Klik menu Source Control > Commit . 


6. lakukan Pull. klik menu Source Control > Pull.


7. lakukan Push. klik menu Source Control > Push.


8. check jika file sudah terupload di repository.


Sekian, semoga bermanfaat ^_^

Kamis, 11 April 2019

Cara Mengunci Orientasi Aplikasi IOS di XCODE #IOSDEV

Hallo semuanya, kali ini saya mau share tentang cara mengunci orientasi dari aplikasi IOS yang ingin kalian buat agar bisa tetap di orientasi yang kalian inginkan, entah itu potrait atau landscape seperti gambar berikut.


mengapa kita membutuhkan ini? karna kebutuhan aplikasi kita beda2, ada yang membutuhkan orientasi landscape aja seperti game COC, atau ada yang hanya membutuhkan potrait aja seperti aplikasi onlineshop.

pada kali ini saya mau kasih tips agar orientasi aplikasi kalian bisa menjadi potrait atau landscape aja, berikut caranya. pada halaman awal pada kalian create project, klik tab general, lalu cari section Deployment Info


pada menu device orientation kalian tinggal pilih sesuai dengan kebutuhan aplikasi kalian .
okey cukup sekian, see you. ^_^

Kamis, 04 April 2019

Membuat Aplikasi IOS Pertama pada Iphone Xr #IOSDEV



Hallo semuanya, kali ini saya mau berbagi tentang ilmu yang baru saja saya dapatkan, yaitu membuat aplikasi IOS pada project pertama saya yang bernama TRUMPet. Project ini saya upload ke github, bagi kalian yang pengen nyoba langsung bisa ke link dibawah ini :


Project ini saya dapat dari tutorial berikut :


sebelum masuk ke langkah langkahnya, kalian perlu untuk mendownload terlebih dahulu asset yang akan kita pakai, silahkan download dibawah ini 


setelah kalian download, silahkan extract.

buat project baru seperti berikut. 

pilih single view app lalu next. lalu pastikan anda mengisi point2 berikut :

1. Product Name
2. Team
3. Organization name
4. Organization Identifier

klik next, sampai muncul tampilan seperti berikut.

drag and drop asset yang sudah kalian download tadi, kedalam asset folder, seperti berikut.



klik File main.Storyboard lalu klik safe area. seperti berikut 

tambahkan tombol pada safe area. 



tambahkan constraint pada tombol yang tadi di tambahkan. 

edit property dari button seperti berikut, hilangkan text "button" lalu tambahkan image ke button, seperti berikut.


lalu drag file mp3 dari asset tadi, ke dalam project. seperti berikut 

buat action button di view class controller seperti berikut.

lalu lakukan build dengan klik tombol play, di pojok kiri atas.



yup, project pertama kita telah selesai, apabila ada pertanyaan silahkan layangkan di bawah. 
semoga bermanfaat.

Senin, 25 September 2017

Screencast : Unit Testing With PHPUnit



hello guys, here we are. we will learn about testing like unit test or test driven development, but in this case we will learn about unit test using phpunit. we know that phpunit is the framework test that very popular for web development instead of the other testing framework like laravel dust. or something else.

in this case, i want to share with you all about screencast that much benefit for you that courious about to learn testing. before that, is you know how the test work? is it we clicked all website or something? NO!!. test work using console and its work when we code our test to achieve something. like when we assert to login or register we code that assert must be achieve true or something else response to be "success" or "200".

what is benefit if we use unit test in our project? 
1. it much easier to test 
2. it decrease error before our project up to production
3. it make our project more maintainable.
4. it make us more profesional :D

what is disanvantages of using unit test?
1. more code to write
2. more hour to end up your project
3. more hard to code

so, i think if you choose to be more profesional developer, you should choose using unit test from now.  goodluck!

in this morning i got ten screencast free about unit test from youtube. i think it whorted for you. its teach us step by step and very easy to learn. here we go, look at the list video in the bellow.

















congrats guys.. hope you enjoy this tutorial and that screencast above. thankyou verymuch ^_^

Rabu, 23 Agustus 2017

Laravel Route : Pengertian Router Resource




bill.web.id, Router laravel adalah kode program yang di gunakan untuk mendefinisikan url pada project laravel kita. router memanfaatkan htaccess untuk membuat url project kita sangat seo friendly. berbada dengan CI, router pada laravel sangat customable, berapapun level url slash nya tidak berpengaruh dengan controller dan method yang di panggil. contoh

Route::get($uri, $callback);

$uri : di isi oleh url yang ingin kita buat

$callback : di isi oleh nama class dan atau method dari controller

Baca Juga :

tentu hal ini sangat menguntungkan bagi para pengamat seo, bahwa nama url sangat berpengaruh terhadap SEO,  seperti kita tau search engine mengidentifikasi url dari nama yang tersemat di dalam urlnya, jadi pengalamatan url yang bagus akan berdampak pada kemudahan halaman kita akan terindeks search engine.

Router sendiri memiliki banyak metode, tiap metode berasosiasi pada HTTP VERB, http verb yang di gunakan oleh laravel para router terdapat 5 yaitu.

  1. GET
  2. POST
  3. PUT
  4. PATCH
  5. DELETE

Baca Juga :

setiap metode tersebut memiliki keistimewaan sendiri2, cara penggunaanya sangat gampang. kalian tinggal mengganti method yang ada di router sesuai dengan http verb di atas. contoh

  • GET

Route::get($uri, $callback);
  • POST
Route::post($uri, $callback);


dan sebagainya.

Baca Juga :

tetapi, ada satu lagi method router yang perlu kalian ketahui yaitu method RESOURCE. method ini adalah method yang mewakili semua method2 di atas agar bisa di panggil hanya dalam satu baris. contoh

  • RESOURCE

Route::resource($uri, $callback);

router di atas, akan  menghasilkan router yang berstandard resource nya laravel atau restful, router yang di cetak akan berjumlah 7, tetapi hanya akan menggunakan 4 method yang dari 5 method yang ada, kenapa? karna PUT dan PATCH fungsinya sama, yaitu mengupdate data. berikut hasil dari method resource di atas.



tiap router di atas, akan berasosiasi ke dalam method CRUD (Creat, Read, Update, Delete)  yang terdapat pada controller yang di tuju. apabila kalian masih penasaran tentang router, kalian bisa langsung membaca dokumentas router yang ada di website resmi laravel.




Selasa, 22 Agustus 2017

Laravel Helper : Membuat Link Slug




bill.web.id, laravel helper adalah kumpulan function builtin yang di miliki oleh laravel untuk memudahkan para developer laravel untuk mencapai hasil atau tujuan tertentu tanpa membuat method atau functionnya sendiri. laravel helper ini berisi function yang sering di pakai atau sering di buat oleh para developer menurut laravel sendiri.

Baca Juga :

slug adalah url yang berbentuk kebab case, dimana url berformat seperti ini banyak sekali di gunakan di website2 berbasis blog, contoh medium, blogger, wordpress dll. slug adalah kalimat hasil dari pemformatan judul article atau judul halaman menjadi kebabcase ( ini-adalah-contoh-kebab-case ). 

contoh url slug adalah sebagai berikut https://technologue.id/techtology-ribut-netizen-indonesia-vs-malaysia-simbol-porno-di-bing/ . kalimat yang berada setelah domain adalah kalimat judul yang telah di format menjadi kebabcase dan di gunakan untuk url menjadi slug.

Baca Juga :

laravel menyediakan helper yang unique, yang bisa di manfaatkan oleh para developer untuk membuat url slug otomatis tanpa membuat method lagi di kode program kita. helper yang satu ini bernama str_slug() , str_slug akan langsung melakukan konversi dari kalimat yang di masukkan kedalah function ini menjadi kebabcase, contoh :

public function makeitslug()
{
$sebelumslug = "laravel helper : membuat link slug";
$setelahslug = str_slug($sebelumslug);
echo $setelahslug;
}


Baca Juga :


function di atas akan mencetak kalimat pada variable $sebelumslug menjadi seperti ini

laravel-helper-membuat-link-slug

voilaa, helper ini sering saya pakai dan menurut saya helper ini adalah helper yang sangat berguna bagi semua developer. contoh project yang sudah saya implementasikan menggunakan str_slug adalah https://tokoandalan.com  . jika kalian ingin mencari tau helper2 lain pada laravel framework, kalian bisa mengunjungi official documentasinya di laravel.com. ^_^

Minggu, 20 Agustus 2017

Intel XDK : Download Free Ebook Bahasa Indonesia Lengkap



bill.web.id, intel xdk adalah SDK buatan Intel Corporation yang memungkinkan kita untuk membuat aplikasi berbasis mobile di semua platform mobile seperti android dan ios. tidak cuma pada platform itu saja, intel xdk juga mensupport platform terkenal lain yaitu windows phone dan blackberry os. SDK serupa juga telah muncul sebelum intel xdk yaitu Phonegap, tetapi platform ini sangat tidak userfriendly terhadap developer baru karna semuanya menggunakan console. 



berbeda dengan intel xdk, sdk ini terbukti mudah di pelajari dengan user interface yang mirip dengan sdk terkenal lainnya seperti android studio dan visual studio. dengan fitur drag and drop component sdk ini semakin memanjakan para developer untuk dengan mudah mendevelop aplikasi berbasis mobile. 

Baca Juga :


intel xdk menggunakan bahasa javascript sebagai core logicnya dan html, css sebagai core UI nya. bagi para web developer khususnya frontend developer, sangat mungkin dan pasti sangat mudah untuk pindah ke dalam dunia developing mobile menggunakan intel xdk ini. 



intel xdk menggunakan cordova sebagai core utama untuk berkomunikasi dengan device android dan memanfaatkan fitur2 yang ada di android, seperti camera, photo, library, notifikasi dll. 


Baca Juga :


kelebihan dari intel xdk adalah sangat user friendly dengan adanya fitur drag and drop, dan semuanya di lakukan dengan GUI, jadi sangat mudah bagi para developer mobile baru yang hendak belajar. selain itu intel xdk juga memiliki kekurangan, yaitu sdk ini terbilang berat, anda wajib menginstall ram 4 gb jika ingin lancar mendevelop dengan sdk ini. dan juga aplikasi yang di build menggunakan intel xdk performanya lebih berat dari pada aplikasi yang di develop menggunakan native seperti android studio ataupun visual studio.


Baca Juga :


nah, tertarik nggk kalian semua sama intel xdk? pasti tertarik dong, sejak di tulisnya artikel ini link2 ebook intel xdk sangatlah banyak, bahkan berbahasa indonesia pun ada. apabila kalian tertarik untuk mencoba berhijrah ke intel xdk kalian bisa memanfaatkan ebook yang saya share di google drive ini. ada 8 ebook dan semuanya step by step dari awal develop sampai upload ke store. ebooknya gratis yuk di download ^_^ 


Sabtu, 19 Agustus 2017

Laravel Library : Chatter Forum Laravel Library



bill.web.id , Chatter adalah salah satu library yang menyediakan fitur forum di framework laravel. chatter hampir mirip sebuah cms yang sudah jadi tetapi berbentuk package pada laravel, library ini bisa kita gunakan pada project kita apabila kita membutuhkan fitur forum pada project kita.

studi kasus nya apabila kalian membuat suatu project seperti onlineshop, blog, QnA kalian akan butuh platform yang bisa menampung komunitas dari project yang kalian punya, salah satunya adalah forum. dengan menggunakan forum, kalian bisa mengetahui keberadaan komunitas dan orang2 yang tertarik dengan project kalian.
Chatter bisa jadi solusi dimana kalian bisa pakai untuk mendapatkan data dari komunitas. pada pembahasan kali ini saya akan mereview library forum ini, berikut adalah reviewnya.

kelebihan :

1. tampilan chatter flat dan simple
2. fitur yang di sediakan sangat simple dan mudah di pahami
3. mudah untuk menginstall di project kita
4. punya contributor banyak di github


kekurangan :

1. kurang customable
2. tidak bisa di update ke repository (karna file project ada di folder vendor)

contoh tampilan forum chatter di forum.technologue.id


Tampilan depan 


Form new feed


Detail feed and discuss
yup, di atas adalah 3 tampilan utama dari forum chatter, bisa dibilang simple banget, tapi menurut saya itu udah cukup buat diskusi forum. apabila kalian tertarik menggunakan library ini kalian bisa langsung masuk ke halaman repository mereka di github Devdojo . di sana sudah di sediakan langkah2 untuk melakukan instalasi library menggunakan composer.  


Search