Kategoriler
Blog

VS Code : Customize

Adobe Dreamweaver, Notepad++, Sublime Text, Atom gibi editörlerin ardından uzunca bir süredir kullandığım ve bir IDE olmaya daha yakın VisualStudio Code ile geliştirme yapmayı kolaylaştıran eklenti ve ayarlarımı bir gönderi olarak blogumda bulundurmak istedim. Aslına bakarsanız sık sık farklı bilgisayarlarda geliştirme yapma durumu yaşadığım için kuracağım eklenti ve yapacağım ayarları dönüp bu gönderiden hızlıca hatırlamayı amaçlıyorum. 🙂

Tema, İkon Seti ve Font

VS Code varsayılan tasarımı da hoş olsa da bana son derece keskin geliyor. Bu yüzden daha önce de aşinalığım olan bir tema daha iyi hissettiriyor.

Atom Material Theme – Ne olduğu adından belli ama yine de belki bilmeyen olabilir diye; VS Code için Atom editörün teması. Atom Material Theme – Visual Studio Marketplace

VSCode-Icons – dosya uzantılarına göre dosya isimlerinin solunda küçük iconlar yerleştiriyor. Algıda seçicilik yönünden son derece yardımcı oluyor. vscode-icons – Visual Studio Marketplace

FiraCode Font – bu bir eklentiden ziyade bir font olarak kullanılıyor. Yazılımlarda sıklıkla kullandığımız “<=” (küçük eşit), “==” (eşittir), “!=” (eşit değil) gibi seçicilerin fontlarını görsel olarak daha hoş sunuyor. GitHub – tonsky/FiraCode: Free monospaced font with programming ligatures buradan indirip bilgisayarınıza fontu kurduktan sonra VS Code içinde Ayarlara (CTRL + ,) girerek birkaç değişiklik yapmanız gerekiyor.

Editör: Font Family bölümünde fontların başına “Fira Code” ekleyin. Bu bölüm sizde boş ise sadece Fira Code yazıp geçebilirsiniz.

Sonrasında VS Code’un settings.json dosyasını açıp, editor.fontLigatures ayarını true yapın. Yoksa ekleyebilirsiniz.

"editor.fontLigatures": true

FTP/SFTP

Yerelde yaptığınız değişiklikleri yayındaki ya da uzakta ki bir ftp sunucuna editör içinden kolayca atma ihtiyacı hissedebilirsiniz. https://marketplace.visualstudio.com/items?itemName=liximomo.sftp

Çalıştığınız dizinde .vscode isimli bir dizin oluşturup içerisine sftp.json isimli bir dosya oluşturup bağlanacağınız sunucunun ftp bilgilerini girmeniz yeterli olur.

{
    "name": "SunucuAdı",
    "host": "xxx.xxx.xxx.xxx", //sunucunun ıp adresi ya da domaini
    "protocol": "ftp",  //ftp sunucunuzun protokolü. sftp kullanmanız önerilir
    "port": 21, //ftp sunucusunun portu
    "username": "kullanıcıAdı", //ftp kullanıcı adınız
    "password": "ftp şifresi",  //ftp şifresi
    "remotePath": "/public_html/",  //sunucuda dosyaların hangi dizine atılacağı
    "uploadOnSave": true //dosyayı kaydettiğiniz anda sunucuya gönderir
}

Regex Eklentileri

Regex için kullandığım iki eklenti var. Birisi okumayı diğeri ise yazmayı kolaylaştırıyor diyebiliriz. Detaylarını eklentinin sayfasından zaten görebilirsiniz.

Regex Snippets – https://marketplace.visualstudio.com/items?itemName=Monish.regexsnippets

Regex Previewer – https://marketplace.visualstudio.com/items?itemName=chrmarti.regex

Prettier – Code formatter

Düzenli kod yazmak konusunda oldukça yararlı bir eklentidir. https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode

Kurduktan sonra Ayarlara gidip Editor: Default Formatter olarak esbenp.prettier-vscode seçmeniz yeterli olacaktır.

GitLens – Git supercharged

Projelerinizde “git” kullanıyorsanız, editör içerisinde dosyaların geçmişini kolayca görmenizi sağlayan GitLens eklentisini mutlaka kullanmanız gerekiyor. https://marketplace.visualstudio.com/items?itemName=eamodio.gitlens

Diğer Eklentiler

Better Comments – Yorum satırlarını renklendirme yoluyla kategorize etmenize imkan veren bir eklentidir. https://marketplace.visualstudio.com/items?itemName=aaron-bond.better-comments

Bookmarks – Geliştirme sırasında satırları işaretlemenizi sağlıyor. Yarıda bıraktığınız ya da hata olduğunu düşündüğünüz satırlara daha sonra hızlıca dönmenizi sağlayabilir. (En azından ben bu amaçla kullanıyorum. 🙂 ) https://marketplace.visualstudio.com/items?itemName=alefragnani.Bookmarks

Bracket Pair Colorizer – Parantezlerin açılış ve kapanışlarını daha rahat ayırt etminizi sağlamayı amaçlıyor. Renklendirme işi gerçekten işe yarıyor. https://marketplace.visualstudio.com/items?itemName=CoenraadS.bracket-pair-colorizer

Docker – Docker kullanıyorsanız kullanmanızı tavsiye ederim. Editör içinden konteynerlarınızı vs. yönetebiliyorsunuz. https://marketplace.visualstudio.com/items?itemName=ms-azuretools.vscode-docker

Composer – Docker kullanıyorsanız composerları daha kolay oluşturmanızı sağlıyor. https://marketplace.visualstudio.com/items?itemName=ikappas.composer

HTML CSS Support – HTML vs CSS yazarken hızınıza hız katacak güzel ve kullanılması gereken bir eklentidir. https://marketplace.visualstudio.com/items?itemName=ecmel.vscode-html-css

Import Cost – Projelerinize dışarıdan dahil ettiğiniz dosyaların boyutlarını yanında yazan kullanışlı bir eklenti. Olmazsa olmaz değil ama güzel bir eklenti. https://marketplace.visualstudio.com/items?itemName=wix.vscode-import-cost

VSCode PHP Geliştirme Ortamı Oluşturma

PHP IntelliSensehttps://marketplace.visualstudio.com/items?itemName=felixfbecker.php-intellisense

PHP Extension Packhttps://marketplace.visualstudio.com/items?itemName=felixfbecker.php-pack

PHP Debughttps://marketplace.visualstudio.com/items?itemName=felixfbecker.php-debug

VS Code settings.json içerisinde PHP’nin kurulu olduğu dizini belirtmek gerekiyor. Bilgisayarınız da PHP kurulu değilse; PHP: Downloads adresinden indirip kurabilirsiniz.

"php.validate.executablePath": "C:/PHP_7.4.15/php.exe",

Yazar Muhammet ŞAFAK

1992 İstanbul doğumluyum. 2008 yılından beri profesyonel olarak PHP geliştiriyorum. Her ne kadar ağırlıklı olarak PHP üzerinde çalışsam da C, C++, Python, Java programlama dillerini de kullanıyorum.

Bir Cevap Yazın