Post Top Info

Post Top Info

tutorial

Tutorial Menggunakan Atom Code Editor

atom code editor

Atom merupakan code editor yang cukup populer dan terintegrasi dengan sangat baik dengan github. Meskipun interfacenya cakep bener tapi sayang user experience-nya sedikit membingunkan sehingga bagi yang baru menggunakannya butuh waktu untuk membiasakan diri dan mempelajari tools serta kontrol yang disediakan oleh Atom.

A. Menyembunyikan Panel Project Pada Atom

Jika panel project ini muncul, awalnya kita akan bingung gimana caranya menyembunyikan atau menampilkan kembali panel ini. Di-close nggak bisa, diklik kanan nggak ada opsinya. Ya...itu karena kita nggak bakal nemu settingan yang ada bau-bau "Project Panel" pada menu, kenapa...? karena Atom menamai panel project ini dengan sebutan Tree View.

Jadi Anda harus tau dulu bahwa project panel ini disebut dengan tree view oleh Atom.

Nah maka dari itu Panel project yang secara default nangkring disebelah kiri jendela atom dapat kita sembunyikan atau tampilkan dengan mengklik menu View > Toggle Tree View atau bisa juga dengan menekan shortcut CTRL + K kemudian CTRL + B (pencet dulu CTRL + K abis itu baru pencet lagi CTRL + B). 


B. Clone Repository Github Via Atom

Jika anda sudah memiliki repository pada github dan ingin melakukan cloning repository ke komputer local maka ikuti langkah berikut ini :

  1. Akses View > Toggle Command Pallate (CTRL + SHIFT+P)
  2. Ketikan github:clone lalu tekan Enter.
  3. Bakal muncul jendela popup, pada bagian Clone From isikan link/url dari repository yang akan anda clone. Klik tombol Clone. 
  4. Untuk dapat melakukan editing pada file-file yang ada di repo anda harus login ke github dulu ya. nah, dari panel github yang ada di atom klik tombol Login, lalu akses https://github.atom.io/login
  5. Login github, lalu Copy Token yang diberikan, kemudian paste-kan token tersebut ke panel github yang ada di Atom. Selanjutnya klik tombol Login yang ada pada panel github di Atom.


C. Please tell me who you are Error Pada Atom

Jika muncul error seperti dibawah ini saat melakukan fetch, push ataupun pull

*** Please tell me who you are.

Run

git config --global user.email "[email protected]"
git config --global user.name "Your Name"

to set your account's default identity.
Omit --global to set the identity only in this repository.

fatal: unable to auto-detect email address (got 'atomuser@nama-pc.(none)')


Maka yang harus anda lakukan adalah :

1. Untuk OS Linux

Gampang, tinggal ketikan saja perintah yang disarankantinggal ganti [email protected] dengan email yang anda gunakan di github dan ganti Your Name dengan nama anda di github.

git config --global user.email "[email protected]"
git config --global user.name "Namamu Bro"

2. Untuk OS Windows 

caranya juga gampang, buat file baru (boleh pakai notepad aja), lalu isikan code dibawah ini , tentu saja anda harus menggantinya dengan nama dan email anda sendiri ya...

[user]
name = <eri bowo>
email = <[email protected]>

lalu simpan dengan nama file .gitconfig , nyimpannya dimana bro..??? oh iya simpan di C:\Users\username-anda\ jadi kalau misalkan username anda bojongkenyot ya berarti simpannya di C:\Users\bojongkenyot\


D. Multiple Line Search

Jika anda ingin melakukan pencarian mulitple line, atau pencarian yang melibatkan lebih dari satu baris, Misal Anda punya script seperti dibawah ini :

<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZg0np1zCbPNGvwEgYtw13o8D7IuemvadBbfrjD099c4qUwIB-Jt0OXxIU57Fw8NTj5IuSRs6hfGP6L4FJ4di-iwaPW2Lx_Irl7wwPzGzSSvHBdd4SdQll4QKJ5EU9dLKOSUAHrD4x2qQ/" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="152" data-original-width="385" height="126" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZg0np1zCbPNGvwEgYtw13o8D7IuemvadBbfrjD099c4qUwIB-Jt0OXxIU57Fw8NTj5IuSRs6hfGP6L4FJ4di-iwaPW2Lx_Irl7wwPzGzSSvHBdd4SdQll4QKJ5EU9dLKOSUAHrD4x2qQ/" width="320" /></a></div> <br /><br /> </li> <li style="text-align: justify;">Gambar 12.13 Klik menu thumbnailer</li> <li style="text-align: justify;"><br /></li> <li style="text-align: justify;">Lalu pada halaman selanjutnya cari dan klik direktori tempat Anda menyimpan gambar tadi, karena kita menyimpannya pada direktori public_ftp maka klik direktori public_ftp</li> <li style="text-align: justify;"> <div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoyIz7DDGCVbYtIB3HZJY7Or9ZKzaSrY2at3359uGLFGBE_zfFYoo5ybpM0fdsDEEtE9ukPw6evt1-gOim2cCRRTug3HGNCDyA9D6xuq1wnXOh3CT91_PcMyswW1Ots9ojo_pDYVqeNHU/" style="margin-left: 1em; margin-right: 1em;"><img alt="" data-original-height="115" data-original-width="242" height="152" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoyIz7DDGCVbYtIB3HZJY7Or9ZKzaSrY2at3359uGLFGBE_zfFYoo5ybpM0fdsDEEtE9ukPw6evt1-gOim2cCRRTug3HGNCDyA9D6xuq1wnXOh3CT91_PcMyswW1Ots9ojo_pDYVqeNHU/" width="320" /></a></div>

Nah misalnya anda ingin mencari syntax :

<li style="text-align: justify;"> <div class="separator"

karena terdiri dari 2 baris atau lebih maka anda tidak bisa menggunkan fitur search CTRL + F, tapi Anda harus menggunakan fitur search CTRL + E.

  1. Tetap pertama Anda gunakan fitur CTRL + F
  2. lalu pastekan multiline syntax yang ingin anda cari.
  3. Pasti nanti Atom nggak nemu syntax yang Anda cari, nah kalo dah gitu Anda tekan dah tuh tombol CTRL + E dan tadaaa.........emejing...!!

Related Posts

Tidak ada komentar:

Posting Komentar