arama

Web Sitesi Kodlamanız İçin Gereken Programlar

  • paylaş
  • paylaş
  • paylaş
  • paylaş
  • Yunus Emre BAKAÇ Yunus Emre BAKAÇ

Web Sitesi kodlamanız için gereken programlar
Web sitesini, daha doğrusu herhangi bir programlamayı yapmak için editörlere veya IDE’lere ihtiyaç duyarız. Bunlar geliştiriciler için hazırlanmış, içine yine yazılımcılar tarafından geliştirilen ve çok hızlı kod yazmamızı, hatta yazdığımız kodların belli bir düzene sahip olmasını sağlayan bir çok eklenti mevcuttur.

Web sitesini yapmak için local (yerel) sunucu kullanımı
Web sitemizi yaparken, localhost kavramına değinmek istiyorum. Alan adı ve hosting satın almadan üzerinde testler yapabileceğimiz bir geliştirme ortamı desek pek de yanlış olmaz. Aslında hosting sunucuları da bir localhost görevi görmektedir. Fakat bizim evimizde kullandığımız bilgisayar ile hosting için kullanılan bilgisayarlar işlem yapma hızında pek yarışamayacağını için biz kendi bilgisayarımız üzerinden internet yayını yapmıyor, hem daha internet hızını söylemedim 🙂

Kısaca, localhost kurulumu yapmadan da web sitemini yapabiliriz fakat efektif olmaz, elinizin altında bir sunucu varmış gibi çalışmanız sizi motive edecektir. Tarayıcı URL kısmında localhost/index.html yazması sizi daha farklı etkileyecektir.

Kullanabileceğimiz Web Editörleri
Bu konuda çok fazla alternatif bulunmaktadır, her ne kadar Notepad++ ve Sublime text 3 kullanmış birisi olsam da Visual Studio Code editörünü kullanmaya geçmem pek uzun sürmedi.

Neden Visual Studio Code kullanıyorum?
VSCode açıkçası pek hızlı değil (en azından Sublime text’e göre) fakat kullanım açısından ekstra şeyler öğrenmenize gerek kalmıyor. Eklentiyi kuruyorsunuz ve kullanıma hazır. Sublime Text 3 Package Control denen bir şey ile çalışıyor desem pek de yanlış olmaz. Çünkü eklentiler, temalar veya aklınıza gelecek her şeyi hemen hemen oradan yapıyorsunuz ve bunu yapabilmeniz için kütüphaneyi Sublime Text konsolundan import etmeniz gerekmektedir.

VSCode kurulum entegreli Git desteği olsun, Debug özelliği olsun bir çok konudan benim için daha avantajlı. NodeJS, TypeScript desteği mevcut. Giriş ve orta seviye her kullanıcı için imkan bakımından kusursuza yakın. Sublime text 4 çıkarsa büyük ihtimalle ona geçerim, çünkü aralarında ki en büyük fark Sublime Text 3 Python 3 ile yazıldı, VSCode Nodejs ile, hatta ElectronJS kütüphanesi ile yapıldı.

Kullanabileceğiniz 5 Editör(Tavsiye sırasına göre)
Visual Studio Code
Sublime Text 3
Brackets
Notapad++
Atom
VSCode tavsiyemdir, tabi ki son karar sizin. Hepsini denemenizde fayda var. Yaa şu özellik burada çok daha iyi abi dememeniz için hepsini deneyin evet 🙂

Localhost ile çalışabilmemiz için gereken program
Bu konuda aslında çok fazla konuşmak istemiyorum çünkü birbirinden pek farkı olmayan programlar. Hele ki işe yeni başladıysanız hiç kafanıza takmayın altta vereceğim herhangi bir programı indirip kurabilirsiniz.

XAMPP
Ampps
MAMP ( Ücretsiz versiyonu da mevcut)
WAMP
Visual Studio Code kullananlar için Kullandığım kısayol tuşları
Ctrl + K + C : Seçili bölgeyi veya üstüne tıklanmış olan satırı yorum satırına dönüştürme

Ctrl + K + U : Yorum satırı olan bölgeyi, yorum satırı olmaktan çıkarmak için kullanıyoruz.

Alt + Shift + Alt Ok: Kodumuzu bir alt satıra kopyalamak için kullanırız.

Alt + Shift + Üst Ok: Kodumuzu bir üst satıra kopyalamak için kullanırız.

Ctrl + N : Yeni boş belge açar.

Ctrl + Shift + N : Yeni bir pencere açar

Ctrl + K +-M (Burada CTRL +K Yaptıktan sonra CTRL tuşunu bırakıp M tuşuna basıyoruz: Kodlarımızı hangi dilde yazdığımızı seçebileceğimiz bir pencere açılır.

Ctrl + K +- Z: Zen mode, Tam ekran yaparak odaklanmanızı sağlıyor, kısayol tuşlarınız olan hakimiyetimiz arttıkça bu modu seveceksiniz.

Ctrl + Shift + P: Komut Paletini Gösterir, yüklediğimiz eklentilerin çalışması için veya VSCode’u tamamen yönetebileceğimiz yer diyebilirim. Tema değişikliği , eklenti çalıştırma gibi işlemler.

Ctrl + Shift + F: Açık olan çalışma dosyamızda arama yapar. (Çok efektikftir, WordPress’te belli bir kod bloğunu arıyorsanız veya bir fonksiyonu inanılmaz bir arama hızı var)

HTML ve CSS öğrenmeden önce bilmemiz gerekenler yazımız ile devam edeceğiz.

Sağlıcakla kalın 🙂