Sabtu, 30 Mei 2020

User Snipset Visual Code


  • Buatlah file j.son
  • Masuk file - preference kemudian user snipset
{
"aqil php": {
"prefix": "php",
"body": "<?php $1 ?>",
}

"aqil phpp": {
"prefix": "phpp",
"body": "<?= $1 ?>",
}
 
"aqil echo": {
"prefix": "ec",
"body": "echo \"${1:text}\" ",
}
"aqil Fungsi": {
"scope": "php",
"prefix": "fung",
"body": "function ${1:nama_fungsi}(${2:\\$variable}) {\t${3:#code...};}",
}
 
"aqil Coment": {
"scope": "javascript,html, php",
"prefix": "comen",
"body": "$BLOCK_COMMENT_START ${1:placeholder} $BLOCK_COMMENT_END"
}
 
"aqil Input": {
"prefix": "inpul",
"body": [
"<p>",
"<label for=\"$1\"> ${2:Username}</label>",
"\t<input type=\"${3:text}\" name=\"$4\" placeholder=\"$5\" id=\"$6\" value=\"$7\">",
"</p>",
]
}
 
 
 
"aqil Form": {
"prefix": "formul",
"body": [
"<form action=\"${1:file.php}\" method=\"${2|GET,POST|}\">",
"\t<fieldset>",
"\t<legend >${3:judul}</legend>",
"\t$5",
"\t</fieldset>",
"</form>"
],
}
 
"aqil label": {
"prefix": "fielku",
"body": [
"<fieldset>",
"<legend align=\"$1\">${2:username}</legend>",
"$3",
"</fieldset>"
],
}
}
Baca Selengkapnya »
di Tidak ada komentar:
Label:

Rabu, 27 Mei 2020

Font Fira Code untuk VS CODE

 "editor.fontFamily": "Fira Code",
    "editor.fontLigatures": true,
      // Set the default
"editor.formatOnSave": false,
// Enable per-language
"[javascript]": {
    "editor.formatOnSave": true
},
"[php]": {
  "editor.formatOnSave": true
}


copy code di atas, lalu pastekan di Settting.json VSCODE
simpan dan reload kembali VSCOdenya.

klik di sini untuk font Fira Code

Taq untuk php



{
"PHP Tag": {
"prefix": "php",
"body": "<?php $1 ?>"
},
"Inline Echo": {
"prefix": "phpp",
"body": "<?= $$1; ?>"
},
"Input Label": {
"prefix": "formel",
"body": [
"<label>",
"\t${3:Username}",
"\t<input type=\"${1:text}\" name=\"${2:username}\">",
"</label>"
]
},
"My Form": {
"prefix": "myform",
"body": "<form method=\"${1|get,post|}\" action=\"$2\">$3</form>"
}
}
Baca Selengkapnya »
di Tidak ada komentar:
Label:

Minggu, 17 Mei 2020

Tutorial GIT dan GITHUB


Fungsi GIT adalah VCS (Version Control System) 

  • Rekaman/ snapshot, kita bisa melacak versi/ history perubahan 
  • kolaborasi 
  • sharing/ memamerkan
  • bisa reset/checkout

Bekerja dengan GIT

  1. GIT adalah VSC terdistribusi untuk mengelola perubahan file di dalam folder
  2. Repo/repository : Folder 
  3. Commit : riwayat perubahan file
  4. Hess : string random, yang panjang/ penanda unik sebuah commit.
  5. Checkout : mundur mau mengerjakan project yang lama
  6. Branch : Percabangan
  7. Merge : Penggabungan
  8. GIT bisa diinstal secara lokal

Bekerja dengan GITHUB

  1. Website yang bisa kunjungi : https://github.com/
  2. Yaitu layanan cloud, untuk menyimpan dan mengelola project
  3. Bisa melakukan seperti GIT, bedanya untuk GITHUB bisa dilakukan secara online
  4. Kesimpulan : GITHUB adalah komputer

Penggabungan GIT dan GITHUB

  1. Remote : sumber yang memiliki repo di GITHUB
  2. Clone : mengambil repo dari remote
  3. Push : mengirim commit.
  4. Pull : menarik commit
  5. Caranya buat folder/repo di GITHUB (online) dulu, baru diclone di GIT (lokal)

Kesimpulan

  1. Version Control System adalah  Sistem yang menyimpan dan mengelola rekaman perubahan dari source code
  2. GIT adalah salah satu software yang bisa melakukan VSC
  3. GITHUB adalah website/layanan untuk mengelola project GIT

Tutorial GIT

https://git-scm.com/

sintak : 

  • ketik git akan muncul beberapa code
  • coba ketik clear, akan terhapus
  • coba tekan git --version akan muncul versinya berapa? fersi 2,27
  • coba ketik pwd  akan tampil direktori tempat folder kita
  • coba ketik ls lihat isi folder
  1. $ git init  untuk inisialisasi repo git
  2. $ git add <file(s) (tekan .)
  3. $ git status = untuk melihat status file, apakah sudah masuk staging area atau belum
  4. $ git commit  = untuk comit caranya : 
git commit -m "Menambahkan file index.html"
  1. $  git config --global user.name "aqilaziz"
  2. $ git config --global user.email "gonzes7@gmail.com"
  3. $ git branch
  4. $ git hel
    dilakukan dalam console/ command prompt

    3 Area Repo Git

    • Working tree = tempat nyimpan file
    • Staging area = ketika ada perubahan memasukkan dalam git.add
    • History = git commt
    semuanya akan tersimpan dalam folder (.git)


    Code Editor VIM


    • Cara keluar dari editor vim adalah tekan q:!

    Kesimpulan : 
    1. Membuat folder terlebih dahulu
    2. Kemudian menjadikan folder tersebut diinitiasi oleh git. caranya masuk direktori folder (misal : web aqil ) tersebut dengan cara printah cd. kemudian ketik $ git init
    3. Kemudian buatlah file di code edito (VSCODE) misal file index.html
    4. Check di dalam folder tersebut (web aqil) ada apa saja dengan perintah ls
    5. Kemudian ketik $ git status  akan ada peringatan bahwa file tersebut belum di masukkan dalam stagging area
    6. Kemudian masukkan ke staging area dengan cara $ git add . (spasi titik)
    7. Kemudian langkah terakhir commit deengan cara ketik $ git commit - m " Mengubah file index dan menambahkan file css."
    8. Untuk melihat perubahan apa saja yang dilakukan tekan $git log atau misalkan melihat 3 perubahan terakhir $git log -3





































    Baca Selengkapnya »
    di Tidak ada komentar:
    Label: ,

    Jumat, 15 Mei 2020

    Ekstensi yang harus Diinstall di VSCode

    short cut untuk menampilkan tampilan ekstensi : CTRL + Shift + X

    • Matikan Editor Open dengan cara Ctrl +, (koma)


    1. Masuk setting atau Ctrl + , (koma)
    2. Ketik open edit visible, untuk menghilangkan tampilan open edit, kemudian ubah nilainya yang semula 9 menjadi 0
    3. Ketik minimap, hilanngkan centangnya
    4. Install font firacode, Masukkan file j.son edit
    5. Kemudian masukkan populer ekstensi
    6. Tambahkan esktensi live server chrome, setingannya bisa dilihat di blog


    1. Auto Close Tag
    2. Auto Rename Tag
    3. Beauty
    4. Bracket Pair Colorizer
    5. CSS Peek
    6. HTML CSS Support
    7. HTML Snippets
    8. Indent Rainbow
    9. Intillisense for CSS class name in HMTL
    10. JS-CSS-HTML Formatter
    11. One Dark Pro (tema)
    12. Open in Browser
    13. PHP Intelephense, ketik @builtin php, disable PHP Language Features.
    14. Material Icon Theme
    15. VSCode Icon Team
    16. Live Server, untuk php lihat tutorial berikut : ingat cukup foldernya saja, tanpa ditulis index.php


    Baca Selengkapnya »
    di Tidak ada komentar:
    Label:

    Shorcut Visual COde | Emmet Abreviation

    klik di sini

    Shortcut Penting VSCOde

    1. Ctrl+Space : untuk menampilkan saran/penawaran
    2. Ctrl+Shift+ P : untuk menampilkan thme color menampilkan, dll
    3. Ctrl + B : menghilangkan taskbar
    4. Ctrl + , (koma) : untuk menampilkan setingan font/ ukuran dsb.
    5. Ctrl + D, untuk mengganti semua nilai yang sama.
    6. Alt + Z, untuk wrapt text spy bisa dikecilkan windowsnya.
    7. Ctr+/ (slash) : untuk menampilkan komentar
    8. Alt + panah bawah : switch tukar (caranya teksnya di blok dulu)


    Baca Selengkapnya »
    di Tidak ada komentar:
    Label:

    Adobe Reader DC 2020

    klik di sini
    Baca Selengkapnya »
    di Tidak ada komentar:
    Label:

    Tutorial VSCode


    KELEBIHAN
    VISUAL STUDIO CODE (VS CODE) DARI SUBLIME
    Kenapa pindah ke VS Code?
    1.       Karena Visual Studio Code Gratis.
    2.       Untuk pengajaran persis sama dengan siswa gak ada sama sekali, tanpa ada plugin.
    3.       Sudah ada plug in favorit yaitu Emmet, untuk menulis html dan css.
    4.       Sudah ada linter, untuk mengecek kesalahan yang kurang. Contoh titik koma
    5.       Plugin untuk sublime tapi kalau VS code namanya eksensi.
    6.       Adanya intellisense, ngetik kemudian diberi saran/ penawaran, lebih lengkap dari sublime.
    7.       Bekerja dengan warna, sudah dimunculkan warnanya apa. Dan ketika disorot warnanya sudah ada color picker.
    8.       Punya sidebar, paling atas untuk esplorer.
    9.       Untuk membuat folder coba yang didalamnya ada file cs.js. maka tinggal ketik new, dan coba/cs.js
    10.    Karena dapat mudah mengelola ekstension/plug in. Sidebar kiri paling bawah.
    11.    Dapat mudah dengan terintegerasi dengan GIt.
    12.    Sublime lebih cepat, untuk PC yang rendah, lebih cepat sublime.

    Mengkonfigurasi VSCode :
    1.       Kunjungi websitenya : https://code.visualstudio.com
    2.       Adanya commad pallete : Ctrl + Shift + P
    3.       Atau File preference – setting
    4.       Hilangkan ope editor : tekan Ctrl, (control koma) ketik open edito visible. Ubah angka 9 menjadi nol.
    5.       Minimap centang enible.
    6.       Font size gunakan 24, line hight : 40
    7.       Mengganti tema, pilih ekstensi (sidebar paling bawah), pilih one dark pro, material theme.
    8.       Mengubah font default, pilih : source code pro.
    9.       Control P untuk mencari file yang ada di folder
    10.    Ekstensi yang sering digunakan dalam php
    a.       Php intelephense, matikan vitur bawaan php di VScode. Yaitu PHP suggest basic
    b.       Bootsrap
    c.        Laravel snipset 5.

    Shortcut Visual Code Cheat Sheet

    10 Ekstension VS Code

    Shortcut untuk menampilkan ekstension : Ctrl + Shift + X
    1.       Sublime text keymap
    2.       Open in browser atau live server (klik kanan open with live server)
    3.       Autorename tag atau seleksi control D
    4.       Intellisense for css class name untuk bootsrap
    5.       CSS Peek
    6.       Indent-Rainbow
    7.       Bracket pair colorize, kurung kurawal.
    8.       Beautify : format ident dalam format yang sama, caranya biar bisa rapi ketika disave, yaitu preference kemudian pilih user setting, centang format on save
    9.       PHP intellisense
    10.     Php intelephense,


    Baca Selengkapnya »
    di Tidak ada komentar:
    Label:
    Langganan: Postingan (Atom)