PINTER BARENG KOMPUTER UNTUK NEWBE

04 Februari 2021

Container Pada Bootstrap 4

Kamis, Februari 04, 2021 Bootstrap 4 No comments

Assalamu alaikum Wr. Wb

Salam Pinter Bareng Komputer, ...zero bit...

A. Pengertian Container

Container adalah Elemen Layout Paling Dasar di dalam Bootstrap. Elemen ini wajib dipanggil di awal pembuatan layout menggunakan bootstrap di dalam tag body (<body> </body>). Karena elemen ini yang nantinya akan mengendalikan sistem grid bootstrap sehingga lebar design web dapat menyesuaikan lebar device yang digunakan untuk membuka halaman web tersebut. Istilahnya menjadikan halaman web responsive.

Container bisa dibayangkan sebagai wadah yang nantinya berisi semua elemen grid sistem bootstrap maupun elemen - elemen selain miliknya bootstrap.

Container dipanggil di dalam tag div dengan menggunakan selector class.

B. Jenis - Jenis Container Bootstrap 4

Di dalam bootstrap 4 terdapat 2 jenis container yaitu container dan container-fluid.

Container biasa menjadikan lebar layout design halaman web tidak full layar, masih ada sisa bagian kosong yang cukup lebar di kanan - kiri tampilan layar. Sedangkan saat menggunakan container-fluid maka tampilan layout halaman web full layar.

Untuk penggunaan container ataupun container-fluid tinggal disesuaikan kebutuhan tampilan website yang sedang dibuat.

Contoh Penggunaan Container :

Contoh Penggunaan Container-Fluid :

Keterangan :

Class bg-primary adalah class milik bootstrap 4 untuk membuat background warna biru.
Class text-white adalah class milik bootstrap 4 untuk membuat tulisan berwarna putih.
Class text-center adalah class milik bootstrap 4 untuk meletakkan tulisan ditengah layar.

Semoga artikel ini bermanfaat.

Kembali ke menu Bootstrap 4 - Grid System pada Bootstrap 4

Variabel dan Konstanta di dalam PHP

Rabu, Februari 03, 2021 PHP No comments

Assalamu alaikum Wr. Wb,... Salam Pinter Bareng Komputer, ... zero bit ...

A. Variabel

Variabel adalah tempat menyimpan data di dalam memori komputer yang nilainya bisa berubah seiring berjalananya program. Setiap variabel yang dibuat harus memiliki nama dan nama ini menganut aturan case sensitive.

Aturan membuat nama variabel dalam PHP :

Di dalam PHP nama variabel di awali dengan karakter $ diikuti huruf sebagai karakter pertama setelah $, kemudian kombinasi karakter dan angka.
Variabel PHP bersifat Case Sensitive artinya huruf besar dan kecil dibedakan. Contoh : $nama; dengan $Nama; dengan $nAma; masing - masing sudah berbeda
Tidak boleh ada spasi dan tanda baca dalam nama variabel, kecuali karakter _ (underscore).

Contoh nama variabel yang benar Contoh nama variabel yang salah

$namaMhs; $nama mhs; (ada spasi ditengah)

$alamat_ortu; $alamat/ortu; (ada karakter slash)

$kota2; $2kota; (diawali angka)

Contoh nama variabel yang benar	Contoh nama variabel yang salah
$namaMhs;	$nama mhs; (ada spasi ditengah)
$alamat_ortu;	$alamat/ortu; (ada karakter slash)
$kota2;	$2kota; (diawali angka)

Contoh :

Mengupdate Nilai Variabel :

Istilah mengupdate nilai variabel adalah proses mengganti nilai variabel yang lama dengan nilai baru. Hal ini dimungkinkan karena variabel nilainya memang dapat berubah - ubah sesuai kebutuhan.

B. Konstanta

Konstanta adalah nama dari suatu nilai sederhana dan bersifat tetap. Konstanta dinyatakan seperti halnya variabel, hanya saja dalam pendeklarasiannya konstanta ditulis dengan huruf besar dan tidak diawali dengan $.

Berikut cara pendefinisian konstanta :

define(“Nama Konstanta”, nilai konstanta);

Contoh :

Semoga artikel ini bermanfaat.

Kembali ke Menu PHP - Tipe Data di dalam PHP

Pengenalan PHP

Rabu, Februari 03, 2021 PHP No comments

Assalamu alaikum Wr. Wb, Salam Pinter Bareng Komputer, ...zero bit...

Semoga artikel ini bermanfaat.

Kembali ke menu PHP - Variabel dan Konstanta di dalam PHP

Cara Instalasi Bootstrap 4

Rabu, Februari 03, 2021 Bootstrap 4 No comments

Assalamu alaikum Wr. Wb

Salam Pinter Bareng Komputer, ...zero bit...

Pada artikel ini saya ingin menjelaskan bagaimana cara instalasi Bootrstrap 4 ke dalam projek web yang sedang kita bangun.

Silakan kalian buka dokumentasi yang telah diberikan di dalam website resmi dari Bootstrap 4 di alamat : Dokumentasi Bootstrap 4 (getbootstrap.com). Di dalam dokumentasi tersebut bisa kalian baca langkah - langkah untuk melakukan instalasi Bootstrap 4 ke dalam projek web yang sedang kita kerjakan.

Namun bagi kalian yang ogah membaca panduan instalasi dalam bahasa Inggris, berikut ini saya tuliskan langkah - langkah instalasinya :

Buat sebuah folder projek web baru di dalam drive komputer kalian, beri nama misalkan : websekolah.
Buat sebuah file html baru dengan nama : index.html. (Catatan : untuk alasan keamanan setiap folder baru di dalam projek web sebaiknya di dalamnya memiliki file dengan nama index.html, walaupun isinya kosong)
Buka dokumentasi Bootstrap yang alamatnya sudah saya share di atas, kemudian masuk ke menu download. Dijelaskan di sana bahwa untuk dapat menggunakan semua library framework Bootstrap 4 ada 2 cara yang dapat dilakukan, yaitu

Mendownload semua file library nya kemudian settingkan ke dalam folder projeknya
Menggunakan Bootstrap CDN, yaitu dengan cukup mengcopy link css dan js miliknya Bootstrap 4 kemudian mempaste di dalam halaman web yang ingin menggunakannya.

Cara 1 : Mendownload Library Framework Bootstrap 4

Masuk ke dalam dokumentasi bootstrap 4 kemudian silakan download semua file library boostrap dengan mengklik tombol download. Kalian bisa pilih versi download Compiled CSS and JS atau versi download Source File. (Catatan : jika ingin menghemat ukuran file projek, saya sarankan download yang versi Compiled CSS and JS)

Setelah download selesai kalian akan mendapatkan sebuah file dengan nama : bootstrap-4.4.1-dist.zip.
Lakukan extraksi file menggunakan aplikasi WinRar atau WinZip dan arahkan ke dalam folder projek yang sudah kalian buat sebelumnya.
Kalian boleh merename nama folder bootstrap-4.4.1-dist dengan nama baru yang kalian mau, atau tetap dengan nama aslinya. Di sini saya rename dengan nama bootstrap4.
Jika kalian buka isi folder bootstrap4 ada 2 folder yaitu CSS dan JS yang masing - masing sudah ada isinya. Folder CSS isinya adalah file - file style sedangkan folder JS isinya adalah file - file jquery.
Isi folder CSS semunya adalah file - file untuk melakukan setting tampilan melalui CSS.
Isi folder JS adalah file - file jQuery javascript untuk mengendalikan tampilan saat terjadi event tertentu yang mengenai komponen.
Misalkan kita ingin menggunakan library bootstrap 4 di dalam halaman index.html, maka buka file index.html dengan Sublime kemudian copy paste script berikut yang bisa kalian ambil dari dokumentasi bootstrap 4 pada menu Getting Started dengan mengklik tombol copy yang ada di pojok kanan atas.
Hasil copy - paste di dalam file index.html:

Jika dijalankan di dalam browser maka hasilnya seperti berikut :
Agar script di dalam halaman index.html dapat terhubung ke dengan file library bootstrap 4 yang sudah kita download maka perlu dilakukan penyesuaian pada scriptnya. Bagian - bagian yang akan disesuaikan adalah bagian - bagian yang diberikan tanda cek merah pada poin 9 di atas.
Demikianlah cara melakukan instalasi Bootstrap 4 dengan melakukan download file librarynya langsung dari situs resmi bootstrap 4. Kelebihan cara ini adalah saat dijalankan di dalam browser semua resource bootstrap 4 tidak perlu dibaca online dari situnya namun bisa langsung diambil dari file2 yang sudah di

Cara 2 : Menggunakan BootstrapCDN

Cara 2 ini sama dengan langkah 8 dan 9 dari Cara 1 di atas. Kelemahan cara ini adalah saat projek web dijalankan maka semua resource bootstrap 4 akan diambilkan online dari repository bootstrap 4, sehingga jika kondisi tidak ada internet maka tampilan hasil design webnya akan berantakan, karena tidak disupport oleh bootstrap 4.

Semoga artikel ini bermanfaat.

Menuju ke menu Bootstrap 4 - Container Pada Bootstrap 4

Pengenalan Bootstrap 4

Rabu, Februari 03, 2021 Bootstrap 4 No comments

Assalamu alaikum Wr. Wb

Salam Pinter Bareng Komputer, ...zero bit...

A. Sejarah Bootstrap

Bootstrap merupakan sebuah library framework CSS yang dibuat khusus untuk bagian pengembangan front-end website. Bootstrap merupakan salah satu framework HTML, CSS dan javascript yang paling populer saat ini dikalangan web developer. Saat ini hampir semua web developer telah menggunakan bootstrap untuk membuat tampilan front-end menjadi lebih mudah dan sangat cepat karena seorang web developer hanya perlu menambahkan class - class tertentu seperti saat membuat tombol, grid, navigasi, corousel dan sebagainya.
Bootstrap, awalnya bernama Twitter Blueprint, dikembangkan oleh Mark Otto dan Jacob Thomton di Twitter sebagai library framework untuk mendorong konsistensi di perangkat internal yang sesuai. Sebelum ada Bootstrap sudah banyak library yang digunakan Twitter untuk pengembangan antar muka (front-end) nya yang menyebabkan ketidakkonsistenan dan beban pemeliharaan yang berat.
Nama Twitter Blueprint diubah menjadi Bootstrap dan dirilis sebagai proyek open source pada tanggal 19 Agustus 2011.

B. Bootstrap 2 dan 3

Pada tanggal 31 Januari 2012, dirilis Bootstrap 2. Pada Bootstrap 2 ini telah ditambahkan sistem layout 12 kolom grid yang responsif, dukungan built-in untuk beberapa Glyphicon (icon - icon), beberapa komponen baru, serta dilakukan penyempurnaan untuk komponen - komponen yang sudah ada sebelumnya.

Pada tanggal 19 Agustus 2013, dirilis Bootstrap 3. Pada Bootstrap 3 semua komponen - komponen didesign ulang menggunakan design flat, dan pendekatan mobile-first. Sehingga diharapkan saat website yang dibangun dengan Bootstrap 3 ini dibuka di alat - alat mobile maka tampilannya akan bisa responsive.

C. Bootstrap 4

Pada tanggal 29 Oktober 2014, Mark Otto mengumumkan bahwa Bootstrap 4 sedang dalam pengembangan. Versi Alpha Bootstrap 4 dirilis pada tanggal 19 Agustus 2015. Sedangkan versi Beta pertama dirilis pada tanggal 10 Agustus 2017.

Versi stabil Bootstrap 4 dirilis pada tanggal 18 Januari 2018, mayoritas adalah pembaharuan (editing) dari Bootstrap 3. Perubahan yang signifika di antaranya :

Peralihan dari Less menuju Sass.
Peluncuran but ulang untuk normalisasi css.
Menghapus dukungan peramban web IE8, IE9, dan iOS 6.
Penambahan dukungan flexbox dan menghapus dukungan komponen non-flexbox.
Penambahan kustomisasi pilihan navigasi.
Penambahan utilitas untuk pemberian ruangan dan ukuran yang responsif.
Beralih dari piksel ke em.
Meningkatkan ukuran fon global dari 14px menjadi 16px.
Menghapus panel, keluku, dan juga komponen-komponen yang mendukung elemen cards.
Menghapus font ikon Glyphicons.
Menghapus komponen pembuat halaman (pager).
Menambahkan sejumlah besar utilitas "class".
Memperbaiki perancangan formulir.
Memperbaiki tombol dan dropdown.
Memperbaiki objek media dan "class" untuk gambar.
Penulisan ulang hampir semua komponen, plugin jQuery, dan dokumentasi.

Sumber :
Bootstrap (kerangka kerja) - Wikipedia bahasa Indonesia, ensiklopedia bebas

D. Bootstrap 5

Bootstrap 5 merupakan versi terbaru dari Bootstrap. Terdapat perubahan besar dalam Bootstrap 5, contohnya :

Menghapus jquery dari komponen dan menggunakan vanilla javascript

Menulis ulang komponen grid untuk mendukung fitur kolom yang ditempatkan di luar baris dan gutter (ruang antar kolom) yang responsif.

Migrasi perangkat lunak dokumentasi dari Jekyll ke Hugo.

Menghapus dukungan peramban web IE10.

Memindahkan infrastruktur pengujian dari QUnit ke Jasmine.

Semoga artikel ini bermanfaat.

Menuju ke menu Bootstrap 4 - Cara Instalasi Bootstrap 4

Install Package Tambahan pada Sublime Text 3

Selasa, Februari 02, 2021 Sublime 3 No comments

Assalamu alaikum Wr. Wb

Salam Pinter Bareng Komputer, ...zero bit...

Pada kesempatan ini saya ingin membahas mengenai bagaimana caranya menginstall package atau plugin - plugin tambahan ke dalam Sublime Text kita.

Seperti yang telah kita ketahui bahwa Sublime Text 3 telah menyediakan banyak sekali fitur dan kemampuan yang dapat membantu seorang programmer dalam mendevelope script projeknya serta menampilkan jendela editor script yang tidak membosankan.

Contohnya, Sublime Text 3 memiliki fitur untuk mengganti Color Scheme agar tampilan jendela Sublime tidak membosankan. Namun bagaimana jika pilihan di dalam Color Scheme ini tidak ada yang cocok dengan keinginan kita? Jawabannya adalah dengan menambahkan sendiri fitur baru ke dalam Sublime Text 3 yang telah kita miliki.

Ada orang yang namanya Will Bond (wbond.net) yang telah membuat fitur Package Control yang merupakan tempat di mana semua plugin miliknya Sublime Text ini dia kumpulkan sehingga memudahkan siapapun yang ingin menginstall plugin tambahan untuk Sublime Text. Namun sebelum dapat menginstall plugin - plugin maka package control harus sudah terinstall di dalam Sublime.

Berikut cara mengintall package control ke dalam Sublime Text 3 :

Pastikan fitur package control sudah terinstall di dalam Sublime. Caranya buka menu Preference, lihat apakah sudah muncul sub menu Package Control. Jika sudah muncul artinya package control sudah terintall ke dalam sublime lanjut ke langkah 3. Jika belum maka lanjut ke langkah 2.
Untuk menginstall package control maka bisa dilakukan membuka langkah - langkah yang sudah dijelaskan di dalam situs resmi : install package control.
Pilih menu Preferences - Package Control - Ketikkan : install package - enter
Tunggu sampai proses loading repository selesai ( catatan : harus dalam kondisi jaringan internet stabil)
Akan muncul jendela Package Control, silakan ketikkan package (plugin) yang ingin diinstall. Jika sudah ditemukan bisa langsung disorot dan enter untuk memulai proses installasi.
Misalkan kita ingin menginstall color scheme baru dengan nama Yotsuba, maka ketikkan Color Scheme - Yotsuba, kemudian enter. Tunggu sampai proses intallasi selesai.
Lakukan restart aplikasi Sublime dengan cara menutup kemudian membuka kembali aplikasinya.
Setelah selesai bisa dicek di menu Preferences - Color Scheme, akan bertambah dan bisa kita pilih color scheme yang kita inginkan.
Untuk instalasi plugin yang lain langkah 1 - 4 sama, yang beda adalah mulai dari langkah 4 ke atas.

Demikian langkah - langkah untuk melakukan instalasi Package tambahan di dalam Sublime Text 3.

Berikut beberapa plugin yang sering diinstall pada Sublime Text untuk mempermudah pembuatan website :

Emmet - Merupakan plugin yang dapat membantu melengkapi secara otomatis script yang sedang dikerjakan. Contohnya untuk membuat halaman html 5 dengan script dasar html 5 maka di layar kerja cukup diketikkan html5 kemudian tekan spasi, maka secara otomatis tag html 5 lengkap akan diciptakan.
Bracket Highlighter - Plugin ini berfungsi untuk membantu mencari pasangan tag – tag saat mengetik script menggunakan sublime text.
LiveReload - Plugin ini akan secara otomatis melakukan reload pada web browser, ketika pekerjaan di sublime text di save. Jadi Tidak perlu repot repot lagi melakukan reload di browser untuk melihat hasil pekerjaan.
SideBar Enhancements - Dengan plugin ini, kita dapat melakukan pengaturan folder atau file file yang diperlukan dalam membangun web dengan mudah di sidebar. Membuat, Membuka, menghapus, dan mengubah lokasi file atau folder.
Color Highlighter - Dengan ini kita bisa langsung melihat perubahan warna secara langsung di code sesuai dengan code warna yang digunakan saat mengarahkan pointer ke code warna.
Can I Use - Plugin ini dapat kita gunakan untuk mengecek browser yang support dengan property HTML atau CSS yang kita gunakan. Caranya blok property HTML atau CSS yang ingin diketahui informasinya. Kemudian tekan Ctrl+Alt+F.
ColorPicker - Bagi yang tidak hapal code code warna, plugin ini kana sangat membantu. Tekan Ctrl+Shift+C (untuk pengguna Linux/Windows) atau cmd+Shift+C (Untuk Pengguna Mac OS).
AutoPrefixer - Plugin ini akan secara otomatis menambahkan prefiks yang diperlukan di CSS. Untuk Menggunakannya Tekan Ctrl+Shift+P, lalu pilih “Autoprefix CSS”. Lihat gambar di bawah.
HTML5 Snippet - Untuk menambahkan secara otomatis syntax HTML 5. Untuk menggunakannya klik Plain Text di Sudut Kanan Bawah, lalu pilih HTML 5. 10. Trimmer Berguna untuk membantu menghapus spasi yang tidak berguna pada script yang dapat menyebakan error pada javascript.

Catatan :

Untuk proses instalasi plugin - plugin ini sama dengan yang sudah saya jelaskan di atas.

Semoga artikel ini bermanfaat.

Kembali ke menu Bootstrap

GoTo Anywhere pada Sublime Text 3

Selasa, Februari 02, 2021 Sublime 3 No comments

Assalamu alaikum Wr. Wb

Salam Pinter Bareng Komputer, ...zero bit...

Pada postingan ini saya ingin membahas mengenai kemampuan yang dimiliki Sublime Text 3 untuk dapat membantu programmer saat ingin menuju atau membuka file tertentu ataupun bagian tertentu dari script program yang sedang dia kerjakan.

Kemampuan ini saya sebut Goto Anywhere. Sekali lagi kita akan menggunakan command pallete untuk menggunakan kemampuan ini.

Berikut contoh penggunaan command pallete untuk membuka file tertentu di dalam folder tertentu :

Perhatikan struktur folder dan file di atas !

Untuk membuka file demo.js yang berada di dalam folder dist - js buka jendela GoTo dengan menekan tombo CTRL + P
Kemudian ketikkan kata demo, maka akan ditampilkan semua file yang mengandung kata demo, tinggal dipilih dan dienter untuk membuka file yang dimaksud

Catatan :

Untuk membuka function, class atau selector css maka awali pencarian dengan lambang @
Untuk menuju baris tertentu dari kumpulan script dapat dilakukan dengan mengetikkan lambang titik dua (:) diikuti nomor baris yang dituju. Contoh : untuk menuju baris 40 maka bisa diketikkan :40

Semoga artikel ini bermanfaat.

Kembali ke menu Bootstrap - Instalasi Package Tambahan Sublime Text 3

Command Pallete Sublime Text 3

Selasa, Februari 02, 2021 Sublime 3 No comments

Assalamu alaikum Wr. Wb

Salam Pinter Bareng Komputer, ...zero bit...

Saat pembuatan script / syntax program dengan mengetikkan perintah - perintahnya langsung pada jendela script editor maka tangan kita akan selalu berada di atas keyboard. Untuk menambahkan kecepatan saat melakukan scripting sebaiknya tangan kita tidak sering berpindah antara keyboard dan mouse, untuk itu perlu sebuah cara cepat untuk mengakses semua menu yang disediakan oleh Sublime Text 3.

Sublime Text 3 menyediakan Command Pallete, yaitu sebuah fasilitas untuk mempercepat mengakses menu - menu yang dimiliki Sublime Text 3 selain menggunakan shortcut. Untuk memunculkan command pallete gunakan kombinasi tombol CTRL + SHIFT + P sedangkan untuk menyembunyikan command pallete yang sudah muncul dapat dilakukan dengan menekan tombol ESC. Tampilan jendela command pallete seperti gambar di bawah ini :

Contoh penggunaan Command Pallete :

Misal kita ingin mengkonversi ketikan dari huruf kecil semua menjadi huruf besar semua (capital) maka dapat menggunakan perintah di command pallete yaitu Conver Case Upper Case.
Misal kita ingin merubah jenis syntax dari script yang sedang kita buat bisa menggunakan menu View - Syntax atau dapat juga menggunakan command pallete dengan mengetikkan : Syntax, kemudian pilih syntax yang ingin dipilih.
Command Pallete juga dapat digunakan untuk menampilkan dan menyembunyikan menu - menu yang dimiliki Sublime Text 3 cukup dengan mengetikkan nama menu misalnya Minimap kemudian pilih toogle minimap.

Snippet

Snippet merupakan struktur perintah - perintah yang sudah dibuatkan oleh Sublime Text 3 dan tinggal kita pakai. Snippet ini dapat dipanggil menggunakan command pallete. Snippet ini tampil menurut kelompok syntax yang telah kita pilih sebelumnya.

Contoh penggunaan Snippet dengan menggunakan Command Pallete :

Buat sebuah halaman html baru, berikan nama : index.html
Setting Syntax menjadi HTML
Buka command pallete kemudian ketikkan : html. Setelah muncul pilih snippet html maka akan ditampilkan struktur tag html lengkap.

Semoga artikel ini bermanfaat.

Kembali ke menu Bootstrap - Goto Anywhere Sublime Text 3

Penggunaan Sublime Text 3

Senin, Februari 01, 2021 Sublime 3 No comments

Assalamu alaikum Wr. Wb

Salam Pinter Bareng Komputer, ...zero bit...

Terdapat 3 bagian utama dalam jendela aplikasi Sublime Text 3 yang wajib diketahui. Bagian - bagian ini akan sering dibuka dan digunakan oleh setiap pengguna Sublime Text, yaitu :

a. Jendela SideBar

Sidebar ini adalah jendela paling kiri yang bisa dimunculkan ataupun disembunyikan. Cara memunculkan dan menyembunyikan jendela ini adalah dengan menekan kombinasi tombol : CTRL + K, atau CTRL + B.

Kegunaan dari sidebar adalah untuk menampilkan folder dan file - file projek yang sudah dihubungkan dengan Sublime. Dengan memunculkan folder serta file - file projek di dalam sidebar ini maka programmer akan dimudahkan saat proses pembuatan folder dan file baru ataupun jika ingin mengedit isi file yang sudah ada yaitu dengan cukup mendouble klik file yang akan dibuka untuk kemudian diedit.

b. Jendela Script Editor

Di bagian inilah programmer akan mengetikkan semua script dalam pembuatan aplikasi. Kelebihan Sublime Text 3 adalah kemampuan memberikan Syntax Highlighter sehingga memudahkan programmer dalam mengkoreksi script buatanya karena setiap perintah, properties, function maupun procedure masing - masing akan diberikan warna yang berbeda.

Untuk dapat mengaktifkan syntax highlighter ini maka lakukan langkah berikut ini :

Buat file baru (CTRL + n), dan simpan (CTRL + S) dengan format : namafile dot extensi. Contoh : index.html
Pilih Syntax file baru yang dibuat tersebut melalui menu : View - Syntax - HTML
Dengan memilih syntax yang sesuai maka Syntax HighLighter akan aktif dan menyesuaikan dengan script yang diketikkan.
Di jendela Script Editor ketikkan : html kemudian tekan tombol tab, maka secara otomatis akan diciptakan tag <html> </html>

c. Jendela Mini Map

Jika script dalam sebuah file sudah sangat banyak maka jendela Mini Map akan sangat membantu seorang programmer untuk menuju ke lokasi script tertentu di dalam jendela editor.

Jendela Mini Map merupakan preview dari isi sebuah file yang sedang dibuka. JIka bagian Mini Map diklik maka di bagian script editor akan secara otomatis menyesuaikan tampilannya. Jendela minimap ini dapat ditampilkan maupun disembunyikan sesuai kebutuhan melalui menu View.

d. Fitur Unggulan Sublime Text 3

Berikut beberapa fitur unggulan yang dimiliki oleh Sublime Text 3, yaitu :

Membuat komentar dengan cepat menggunakan kombinasi tombol CTRL + /
Memindahkan 1 baris syntax dengan cepat menggunakan kombinasi tombol CTRL + SHIFT+ UP/DOWN
Menggandakan 1 baris syntax dengan cepat menggunakan kombinasi tombol CTRL + SHIFT + D
Menghapus 1 baris syntax dengan cepat menggunakan kombinasi tombol CTRL + K
Mengedit kata - kata yang sama bersamaan dengan cepat menggunakan Multiple Cursor, caranya adalah dengan memblok kata yang ingin diedit kemudian tekan CTRL + D sampai semua kata tersebut ditemukan setelah itu tinggal anda Edit, maka secara otomatis semua kata tersebut akan diubah menjadi kata yang baru saja anda ketikkan.
Memperbesar atau mengecilkan ukuran font syntax dengan cepat dengan menekan tombol CTR + +/-
Gunakan tombol TAB atau CTRL + ] untuk menggeser syntax 1 tab ke kanan dan gunakan tombol SHIFT + TAB atau CTRL + [ untuk menggeser syntax 1 tab ke kiri.
Anda dapat menggunakan menu Preference - Color Scheme untuk mengganti tema tulisan dan warna background pada jendela syntax.

Semoga artikel ini bermanfaat.

Kembali ke menu Bootstrap - Command Pallet Sublime Text 3

Pengenalan dan Instalasi Sublime Text 3

Senin, Februari 01, 2021 Sublime 3 No comments

Assalamu alaikum Wr. Wb

Salam Pinter Bareng Komputer, ...zero bit...

Dalam pembuatan halaman web seorang developer web akan sangat membutuhkan aplikasi editor untuk memudahkan dalam proses pengetikan script. Banyak sekali teks editor yang dapat digunakan dalam pembuatan script pemrograman, seperti sublime text 3, notepad ++, code lobster, visual studio code dan sebagainya.

Namun, dalam artikel ini saya hanya akan menjelaskan tentang Sublime Text 3. Sublime merupakan salah satu text editor yang banyak digunakan oleh programmer saat ini. Saya sendiri sudah lama menggunakan text editor sublime untuk mengerjakan projek - projek web saya dan saya menilai text editor ini sangat powerfull dan ringan.

Sublime Text Editor merupakan text editor yang dibuat untuk mempermudah pekerjaan programmer, membantu programmer dalam mengerjakan tugas - tugasnya. Sublime dibangun dengan menggunakan bahasa Phyton dan sampai saat artikel ini saya posting Sublime Text telah mencapai versi 3.

Sublime text editor menyediakan banyak sekali fitur yang sangat bermanfaat, seperti sidebar, syntax highlighter, minimap, multi tab, drag and drop, snipper dan lainya.

Salah satu yang saya suka dari Sublime text editor adalah karena Sublime mendukung penambahan plugin - plugin khusus untuk semakin memudahkan dalam proses pengetikan script program.

Sublime text editor juga dibuat untuk dapat mendukung sistem operasi Windows, Linux dan Mac Os X, sehingga programmer tidak perlu berpindah sistem operasi agar dapat menggunakan Sublime Text Editor.

Cara Instalasi Sublime Text Editor

Download master file exe dari Sublime Text Editor di alamat situs resminya. Berikut ini alamat resmi nya : Sublime Text Editor Download
Setelah selesai didownload maka file hasil download dapat langsung didouble klik untuk memulai proses instalasi.
Setelah selesai instalasi maka akan diperoleh tampilan jendela aplikasi Sublime Text Editor versi 3 seperti gambar di bawah ini :

Semoga artikel ini bermanfaat.

<< Kembali ke menu Bootstrap - Penggunaan Sublime Text 3 >>

04 Februari 2021

A. Pengertian Container

B. Jenis - Jenis Container Bootstrap 4

03 Februari 2021

A. Variabel

Variabel adalah tempat menyimpan data di dalam memori komputer yang nilainya bisa berubah seiring berjalananya program. Setiap variabel yang dibuat harus memiliki nama dan nama ini menganut aturan case sensitive.

Aturan membuat nama variabel dalam PHP :

B. Konstanta

Cara 1 : Mendownload Library Framework Bootstrap 4

Cara 2 : Menggunakan BootstrapCDN

A. Sejarah Bootstrap

B. Bootstrap 2 dan 3

C. Bootstrap 4

D. Bootstrap 5

02 Februari 2021

Catatan :

Contoh penggunaan Command Pallete :

Snippet

Contoh penggunaan Snippet dengan menggunakan Command Pallete :

01 Februari 2021

a. Jendela SideBar

b. Jendela Script Editor

c. Jendela Mini Map

d. Fitur Unggulan Sublime Text 3

Cara Instalasi Sublime Text Editor

Social Profiles

Subscribe This Blog

Label

Blog Archive

Arsip Blog

Mengenai Saya