Web Sitesi Yapmaya Nereden Başlamalı Hangi Dilleri Öğrenmeliyim

Web Sitesi Yapmaya Nereden Başlamalı Hangi Dilleri Öğrenmeliyim
14 Şubat 2016Internet

Web sitesi yapmak? Benim lise dönemlerinden başlayan hayalimdi hep web sitesi yapabilmek.önceden işte birkaç kelime html bilgisi ile sitemynet.com free hostingi ile web sitesi yapmaya başlamıştım. o zamanlar internette bulunan hazır kodları alıp kendi ayrılmış alanımın html kaynak dosyasına yapıştırarak değişik değişik şeyler yapardım. Her bulduğum şeyi yapıştırırdım sayfama. Kedi sylvester dan tutun chat sayfasına kadar. Sonraları çok bakmadım işte tek tük arada sırada frontpage ile bir şeyler yapmaya çalışıyordum. Fakat benim için yeterli kaynak yoktu. Şimdiki kadar da internet yaygın değildi.

Yıllar geçti teknolojiler hızla ilerledi biz büyüdük daha farklı anlamları oldu hayatımızın. Üniversite sınavındaki kırılımlarda eğer size sevdiğiniz ve istediğiniz bilgisayar mühendisliği düştüyse sonrasında bazı konuları daha rahat ve anlaşılabilir olarak araştırıyorsunuz. Ben de bu kırılımdan güzellikle faydalandım. Ve yıllar içerisinde birçok konuda kendimi geliştirdim. Şimdi ise öğrenimlerimi insanlarla paylaşmaya çalışıyorum mümkün olduğunca. 

Birçok insan da etrafta gerek hobi olarak gerekse para kazanabilmek adına web işlerine girmeye web teknolojilerini öğrenmeye çalışıyor. Bunların çoğu sabırsız bir şekilde 3-4 günde web sitesi açmak istiyor. 3-4 günde web sitesi açabilir misiniz evet blogger veya wordpress gibi hazır uygulamalar ile açabilirsiniz ama öncelikle bir sağlam temellere oturtulmuş bir web bilginiz olursa size daha farklı daha iyi sunum şekillerinde bir web sitesi ortaya çıkartabilir. O zaman başlayalım

Web sitesi yapmak için ilk öğrenmem gereken nedir?

Web sitesi yapımı için kodlama zemininin başı yan binanın iskeleti tabi ki html dir. Html bilginiz olmadan web sitesi inşa etmeye çalışmanız demir olmadan inşaat dikmeye benzer. ya tek katlı bir yumrukta yıkılacak bir binanız olur ya da bir kulübeniz. Ama html bilirseniz eğer eviniz şekilsiz şemalsiz olsa bile sağlam olur. yıkılmaz kolay kolay. Şimdi isterseniz biraz html den bahsedelim. HTML Nedir ? ne işe yarar?

Aslında html bir programlama dili değildir. HTML bir web sitesinde mutlaka olması gereken ve tarayıcıların web yayını yaparken okuduğu dildir. Programlama dilleri ile oluşturduğumuz kodlar çıktı olarak ekrana html verir. yani ne yaparsak yapalım ekrana hep html çıktı vereceğiz. Tarayıcı da bu çıktıyı okuyup bizim gördüğümüz son haline getirir. Her web sayfası html tag'i ile başlayıp yine html ile bitmek zorundadır. html bloklarının arasında iki ayrı blok daha yer almaktadır. bunlardan biri dışarıya görüntü vermeyen kodların genel olarak çağrıldığı head ve sayfamızın tüm işlemlerini , görüntüsünü içeren body bölümleri.Sayfanın kimlik bilgileri (başlığı,anahtar kelimeleri vb) yine head içerisinde yer alır. Yani kısaca bir html sayfasının içeriğini betimlemek gerekirse şu şekilde gösterebiliriz

	<html>
	<head>
	...
	</head>
	<body>
	...
	</body>
	</html>

body etkietlerinin içerisine gireceğiniz bütün bilgiler bir web sayfasının içeriğini temsil eder. Burada sayfa ile ilgili işlemler yapılır. Sayfada gördüğünüz her şey bu blokta yazılır.

html ile web sayfalarını dinamik hale getiremezsiniz. Yani örneğin html sayfa içerisinde iki sayıyı toplayamazsınız. Ya da formdan gelen verileri bir yerde gösteremezsiniz. html statik bir dil olduğundan sadece sizin yazdığınızı dışarı verir. 

  • html çalışma ile ilgili önerilen kaynak : W3Schools

Bir sayfanın html kaynak kodları dışarıdan görüntülenebilir. Bunun için herhangi bir web sayfasında boş bir yere gelip sayfa kaynağını görüntüle ya da ctrl + U kombinasyonlarını kullanabilirsiniz. Html ile sayfanızdaki her şeye şekil verebilirsiniz. Örneğin resim gösterip resmin boyutunu ayarlayabilir her yazı için ayrı bir font her blok için ayrı bir renk kullanabilirsiniz. Fakat web sayfasının görsel anlamda bir şeye benzemesini bekliyorsanız mutlaka css kullanmak zorundasınız. Evet html ile ilgili genel bilgilerden bahsettiğimize göre web siteleri için olmazsa olmaz css ile ilgili konuşalım.

CSS nedir? CSS ile neler yapılabilir

Css (Cascading Style Sheets) web sitelerinde gördüğünüz görsel arayüzü sağlayan bir stil şablonlarıdır. Css ile hazırlamış olduğunuz html sayfadaki içeriklerin tüm görsel özellikleri ile ilgilenebilirsiniz. Örneğin syfanızda kullanacağınız tüm koyu renkli yazıların kırmızı yazılmasını css sayfanıza ya da head blokunuzda bulunan style etiketleri arasına aşağıdaki kodu ekleyerek sağlayabilirsiniz.

	strong
	{
	color:#FF0000;
	}

Bu etiket ile sayfadaki bütün strong html etiketlerini kırmızı olarak gösterebiliriz. Sadece kırmızı değil yüzlerce özellik tanımlayabiliriz. Font genişliğini,yüksekliğini,gölgesini yani kısaca görsel olarak görmek istediğimiz her şeyi css ile editleyebiliyoruz. Peki sayfadaki tüm strong etiketlerinin kırmızı olmasını istemiyorsak. Yani sadece bizim istediğim strong etiketli strong bloku arasındaki yazılar kırmızı olsa diğerleri normal kalsa. Bunun için class veya id kullanmamız yeterlidir. Örneğin

	.kirmizi
	{
	color:#FF0000;
	}

Yukarıdaki kodu yazdıktan sonra html sayfamızın içerisinde kirmizi class'ını çağırdığımız her yer kırmızı olacaktır. Örnek verecek olursak 

 

<div class="kirmizi">
Buraya yazılan yazılar kırmızı olur
</div>
<p>
Buraya yazılan yazılar normal olur
</p>

Gördüğünüz gibi sayfa içerisinde hangi etikete class olarak kirmizi class'ını tanımlarsak o etiket içerisindeki tüm elemanlar classtaki görünümlere ulaşır. 

Evet html ile ana iskeletini kaba inşaatını yaptığımız binayı css ile şekillendirdik. Tebrikler artık standart bir binaya sahipsiniz. Bu binamızda asansör boşluğu ve pencere delikleri oluşturduk. Kullanılmasalar da artık öyle boşluklarımız var. Peki o boşlukları hareketli hale getirmemiz için ne gerekir ?

Sayfa içindeki hareketler ve dinamizm için javascript

Evet javascript ve onun üzerine geliştirilmiş kütüphaneler sayesinde sayfa içindeki tüm hareketli alanları yapabiliyoruz. Aynı şekilde artık dinamik işlemler yapabiliyoruz. Sayfamızda matematiksel işlemler,kelimeler üzerinde oynayabilme vb. tüm işlemler gibi hareketleri de javascriptler ile halledebiliyoruz. Yani örneğin sayfamıza slider'ı  javascript ile ekleyebiliyoruz. Aynı şekilde bir resmin üzerine geldiğimiz zaman resmin büyümesi,dönmesi gibi dinamik hareketleri javascript ile yapabiliyorsunuz. Javascript yine sayfa içerisinde yazılabildiği gibi başka bir sayfada yazılıp sayfaya dahil de edilebilir. Bugün bir web sitesinde gördüğünüz tüm hareketler javascript ve javasriptten türetilen kütüphaneler sayesinde yapılabiliyor.

Yapmış olduğumuz binamızın javascript sayesinde asansörünü,pencerelerini ve kapılarını hareket edebilir yaptık. Artık binada oturmaya hazırız. Şimdi binamızda yaşayan insanları dinamik hale getirelim. yani her dairemize ayrı ayrı insanlar atayalım. Bunun için programlama dillerine ihtiyacımız var.

Web sitesi Yapmaya Nereden Başlamalı Hangi PRogramala Dilleri

Hangi Programlama Dilini Kullanmalıyım?

Evet geldik işim programlanabilir kısmına. Web sitemizin içeriğini javascript ile kısmen dinamikleştirebiliyorduk. Fakat programlama dilleri ile istediğimiz kadar dinamikleştirebiliriz. Veritabanı bağlantıları ile bunu iyiden iyiye hissettirebiliriz sayfamıza.Bir sayfamız var ve bu sayfada formlar kullanarak formlardaki değerleri alır veritabanına kaydedip istediğimiz zaman istediğimiz yerde kullanabiliriz. O anki tarihi alıp girilmiş olan tarihten çıkarıp yaş hesaplayabiliriz. Bir haber sitesi düşünün ya da. Haber sitesine formlara haberin başlığını, içeriğini giriyorsunuz, resim seçiyorsunuz ve o içerik istediğiniz sayfada karşınıza çıkıyor. Her sayfa için ayrı ayrı sayfa oluşturmak yerine tek bir sayfada hepsini farklı sayfa gibi görüntüleyebilirsiniz. Yani yapabileceklerimiz kısaca özetlersek

  • Dinamik içerik sayfalar (Haber siteleri,forumlar,sözlükler,bloglar ...)
  • Anlık bilgi paylaşımları (Facebook,twitter,insagram tarzı siteler)
  • E-ticaret siteleri 
  • Personel,Ticari uygulamalar
  • Film-dizi siteleri 

Kısaca aklınıza gelebilecek her şeyi programlama dilleri aracılığı ile yapabiliyorsunuz. En basitinden bir sayfanın iletişim bölümüne girdiğiniz formu doldurup gönder butonuna bastığınız zaman bile programlama dili sayesinde o bilgiler mail olarak gider. Keza yine aynı şekilde twitter'da attığınız bir tweet yine veritabanına kaydolur ve programlama aracılığı ile yayınlanır. 

Piyasada en etkin kullanılan iki programlama dili asp.net ve php dir. En yaygın ve kolay kullanım phpdir. Daha önce buradaki yazımda ikisi arasındaki farkları ele alan bir yazı yazmıştım. Bu dillerin yanında yine birden çok veritabanı kullanılmaktadır. MySQL ve MSSQL bunların başında gelmektedir. her iki dil ile de her iki veritabanına bağlanabilmek mümkündür. Ancak erişim kolaylığı bakımından php - MySQL ve Asp.NET - MSSQL bağlantıları daha uygundur.

Yapmış olduğumuz binanın en son pencerelerini kapılarını ve asansörü dinamize etmiştik. Şimdi ise içinde yaşayan insanları taşımamız lazım. Bunun için programlama dillerini ve veritabanlarını kullanabiliriz. Veritabanı sayesinde her daireye bir numara verdik örneğin daire no :5. Sonra programlama dili sayesinde biz bu 5 nolu dairenin içerisini döşüyoruz. Yani programlama dili sayesinde biz veritabanından bir daire seçip bu dairenin içerisine ne koyacaksak ekleyebilir; kaydederek de yine programlama dili aracılığıyla bu eşyaları veritabanına kaydedebiliriz. Bütün dairelerimizi doldurduk diyelim içerisine insanlar ve eşyaları programlama dilleri aracılığı ile veritabanı bağlantıları sayesinde kaydettik. Şimdi bu insanların hangi dairede kaldığını listeleyelim. Aşağıda dış kapıda bulunan kapı zilleriyle bu daireler arasında haberleşme yapabiliriz. Bir zile tıkladığında dairelerin biriyle haberleşmesini gene programa dilleri ve veritabanı sayesinde yapıyoruz.

Benim kendi yazdığım bu web sitesi dahil etrafta dinamik olarak içerik bulunduran bütün siteler programlama dilleri kullanmaktadır.

Ben uzun süre php kullandım. Asp.NET'i keşfettikten sonra bir daha php yazmak işkence gibi geldi. Hem visual studio'nun kolay arayüzü hem de arayüz - kod kısımlarının farklı sayfalarda yapılması sebebiyle daima Asp.NET'i tercih ederim. php kadar kolay bir değil ama öğrendiniz mi sizin hızınıza hız katacaktır. Sıfırdan başlayacaksanız php ile başlayıp sonra asp.net öğrenmeniz de işinizi görebilir.

Evet yapmış olduğum tüm örneklemeler bu işe yeni başlayan insanlar içindir. Bilmeyen insana çok kod göstermeye gerek yoktur. Onlara kendi hayatlarından örnekler vererek bu sistemi anlamaları kolaylaşmaktadır. Eğer bu makaleyi okuyup da eksik kalan ya da kafanızı kurcalayan bir şey olursa aşağıya yorum yazarak bana ulaşabilirsiniz.

6540 Görüntülenme sayısı
  1. Yorum Icon
    8/21/2017 6:09:33 PM#1CN

    Merhaba Ender bey ben 17 yaşındayım html dili ile uğraştım ana sayfa yaptım izlediğim Videolar sayesinde ama biraz zor geldi ve şimdi çok büyük hayallerim Var Web site tasarlayarak reklam üzerinden para kazanmak gibi okulum bilişim üzerine değil ve hafta da 3 gün ben kendimi günde 5 saat uğraştırarak güzel bi Web site tasarlayabilirmiyim 5 ay içinde falan hep başlayacağım ama hep sen kimsin sen yapamazsın gibi düşünceler geliyo ve yapmak istemiyorum sizce yapabilir miyim erken yorum atarsanız çok sevinirim şimdiden ALLAH razı olsun

    Yorumu Cevapla
    • Yorum Icon
      8/21/2017 11:06:18 PMEnder Ariç

      Merhaba, web sitesi geliştirmek için öncelikli şart okulunu okumak değil de hevesli olmak. Makine mühendisliği vb bölümlerde okuyup güzel web uygulamaları geliştiren bir sürü tanıdığım var. dediğiniz süreler yeterli sadece hırsınızı kaybetmeden üzerine giderseniz temel düzeylere erişebilirsiniz. Ondan sonra her geçen gün üzerine katar her geçen gün yeni şeyler öğrenerek güçlenirsiniz. Korkacak bir şey yok. Para kazanma olayı hemen olmaz o konuda uyarayım ama.

    • Yorum Icon
      8/22/2017 5:01:57 AMCN

      Öncelikle hemen cevap verdiğiniz için çok teşekkür ederim sonrasında ben para kazanmak istiyorum hemde sevdiğim işler Web tasarım,Web programlama işi nasıl hemen para kazanamam anlamadım 5 ay sonra chat sitesi gibi bir sayfa kursam Facebook gibi olmasa da ona yakın siteyi de reklamlarla döşesem para kazanamaz mıyım?

    • Yorum Icon
      8/22/2017 6:00:42 AMEnder Ariç

      Bu tür bir düşünceyle para kazanmak biraz zor olabilir. Ne diyelim. Bol şans.

    • Yorum Icon
      8/22/2017 7:48:41 AMCN

      Abi haklısın seni çok yoruyorum cevap vermek istemesen de haklısın ama hem Web tasarım veya Web program konusunda hem çalışıp hemde nasıl para kazanırım açıklayabilir misin seni örnek almak istiyorum kendime çok merak ediyorum ve sen gerçek bilgi söylersin diye sana soruyorum kusura bakma sağol şimdiden

  2. Yorum Icon
    5/27/2017 3:09:49 PM#2Zeki K

    Ender bey merhaba. Ben Java gibi nesne yönelimli programlama dillerinde ihtisaslaşmak istiyorum ama günümüzde tüm bilgi paylaşımı internette web üzerinden olmaktatır. Hali ile temel web bilgisinede ihtiyaç oluyor. Web programcılığı ile ilgili tavsiye edebileceğiniz video kanal yada kitap var mıdır? Birde geliştirici olmak için donanım ortalama bir laptop sistemi nedir? Saygılarımla

    Yorumu Cevapla
  3. Yorum Icon
    2/15/2017 12:53:05 AM#3Veli

    Merhaba, internette çok kaynak var fakat bilmeyen birine en iyi anlatan yazı bu olmuş. Teşekkür ederim. Benim 2 sorum var. Wordpress ile güzel bir tema yapmak için html, css, ve JavaScript öğrenmek yeterli mı? Bu 3 dili öğrenme ortalama ne kadar zamanı mı alır ? Şimdiden teşekkür ederim.

    Yorumu Cevapla
    • Yorum Icon
      2/17/2017 2:10:46 PMEnder Ariç

      Merhaba, geç geri dönüş için kusura bakmayın. wordpress zaten çoğunlukla hazır içerik ve modül yönetim sistemi olduğundan bunlarla ilgili bilgi sahibi olmak wordpress ve temalarını kullanabileceğiniz anlamına geliyor. tabi php bilginizin de olması gerekmekte. tema oluşturmaktan kastınız sıfırdan bir wordpress teması oluşturmaksa eğer bunların yanında phpyi ve wordpressin mantığını da iyice anlamanız gerekmekte. tahminimce siz wordpress ile site geliştirmekten bahsediyorsunuz ve bence bahsettiğiniz şeylere bir tutam php sizi ilerletecektir.

  4. Yorum Icon
    2/14/2017 4:59:59 AM#4Sinan Yazıcı

    Selam olsun. Paylaşım için teşekkür ediyorum. Arama yaparken beni buraya çeken şey paylaşımın başlığı oldu. Saat sabahın 5 i ve ben satın aldığım alan ismi için sıfır bilgiye sahip biri olarak (ki html nin ne olduğunu bu yazıda öğrendim ) yazınızı okudum. Size ne durumda olduğumu yazmak istiyorum öncelikle. Söylediğim gibi sıfır bir bilgiye sahibim ancak bir amaç için bu işe el atmak durumundayım. Alan ismim var birde elimde websitex5 pro programı var. Ve size sormak istediklerim var. Şöyle özetlemeye çalışayım. 1 - Aktif bir iletişime açıkmısınız (bu benim için gerçekten çok önemli) 2- worpress i araştır oradan işini gör mü dersiniz yoksa kodlama işine gir sabırla mücadeleni ver mi diyorsunuz ? 2. soruma vereceğiniz cevaba göre başka sorularım var zaman ayırırsanız çok sevinirim. Selam ile..

    Yorumu Cevapla
    • Yorum Icon
      2/17/2017 2:09:46 PMEnder Ariç

      Merhaba, geç geri dönüş için kusura bakmayın. Sıfırdan bir web sitesine kalkışmak biraz zaman alabilecek bir şey. Bilgisayar mühendisi olup da bu işin altından kalkamayacak tanıdıklarım var. wordpress bir nebze bu aşamada size daha yardımcı olacaktır. iletişime tabi ki açığım fakat zaman konusu biraz sıkıntılı. yine de yardımcı olmaya çalışırım.

  5. Yorum Icon
    11/4/2016 11:46:52 AM#5sesli sohbet

    bu önemli paylaşımı paylaştığınız icin size cani gönülden teşekkür ederim hocam

    Yorumu Cevapla
  6. Yorum Icon
    8/28/2016 5:15:54 PM#6 KASIM ALTUNDAS

    hocam yazınız çok güzel ve açıklayıcı olmuş. Yalnız merak ettiğim iki husus var. 1. Bu programların hepsinin öğrenme süresi ortalama ne kadar? 2. Sitemizi yaptık diyelim google üst sıralarda nasıl çıkarırız? Teşekkürler.

    Yorumu Cevapla
    • Yorum Icon
      8/28/2016 5:23:14 PMEnder Ariç

      Merhaba, bunların hepsini tam anlamıyla öğrenmek ciddi zaman ve emek isteyen konular. Daha çok dillerin (işinize yarayan dillerin php üzerine başlamışken hadi aspnet de öğreneyim demenin bir anlamı yok başlangıçta) temel önemli kısımlarını kısa sürede öğrenip kendinizi projeler üzerinde geliştirebilirsiniz. Bu sayede bir şeyler yapmaya çalışırken spesifik olarak aradıklarınıza erişebilir onları da öğrenebilirsiniz. 2.sorunuza gelirsek onda da seo denen bir mantık var. seo mantığını ne kadar iyi oturtursanız o kadar üst sıralara çıkarsınız. ben seo konusunda mutlak bir bilgisa sahibi değilim ama öğrenmesi çok zor değil internette bir sürü kaynak var.

BİR YORUM YAZIN

Bilgileriniz Güvende!E-Posta adresiniz ve diğer bilgileriniz kimseyle paylaşılmayacaktır.