İçindekiler:
- Bir Ön Uç Geliştiricisi Ne Yapar?
- Temel Bilgilerde Ustalaşın
- Temel Web Geliştirme Araçları
- Temel Web Geliştirmeyi Destekleyen Teknolojiler
Bir ön uç web geliştiricisi olmak için bilmeniz gereken her şey!
Front-end geliştirici olma hedefi ile kod yazmayı öğrenmek istiyorsanız, başarılı olmak ve bir iş bulmak için bilmeniz gereken birçok şey var. Web geliştirmenin temellerini sağlam bir şekilde kavrayarak başlamalı, ardından becerilerinizi çoğu web geliştiricisinin kullandığı ekstra araçlar ve kaynaklarla geliştirmelisiniz.
Araştırmayı yaptıysanız ve ön uç geliştirmenin sizin için uygun bir yol olduğundan eminseniz, ustalaşmanız gereken bu araçlara da göz atın. Bu araçları ve kaynakları bilmek size yalnızca web geliştirme sürecinde yardımcı olmakla kalmaz, aynı zamanda iş başvurusunda bulunurken rekabeti sudan çıkarmanıza da yardımcı olur.
Son olarak, kodlamayı öğrenmenin denemek isteyip istemediğinizden% 100 emin değilseniz, işte kodlamayı öğrenmeniz için 10 neden.
Bir Ön Uç Geliştiricisi Ne Yapar?
Öncelikle, bir front-end web geliştiricisinin tam olarak ne olduğunu bilmeniz gerekir. Genel olarak, web geliştirme, üç bölümlü iş türünden oluşur:
- Ön Uç Geliştirici. Bu kişi (ön uç web geliştiricisi veya ön uç mühendisi olarak da adlandırılır), web sayfasının tarayıcısında kullanıcı tarafından görülen ve kullanılan her şeyi içeren web sitelerinin ve web uygulamalarının ön ucuyla çalışan bir web geliştiricisidir.. Ön uç geliştiriciler genellikle tasarım odaklıdır.
- Back-End Geliştirici. Bu kişi, web sitelerinin ve web uygulamalarının arka ucundan veya sunucu tarafından sorumludur. Arka uç, tüm verilerin işlendiği ve güncellendiği yerdir. Back-end geliştiriciler genellikle mantıklı düşünürler.
- Tam Yığın Geliştirici. Bu kişi hem ön hem de arka uçta yetenekli özel bir ninja. "Güzel şeyler" ile "süper teknik" şeylerle çalışmaktan hoşlanıyorsanız, bu iş tam size göre olabilir…
Ayrıca, çok çok uzak bir galakside uzun zaman önce… Web Designer olarak bilinen bir başlık vardı . Web tasarımcısı kodlamayı öğrenmeyle gerçekten uğraşmak zorunda değildi ve yalnızca web sayfalarının tasarım yönlerine odaklandı.
Günümüzde, web siteleri ve web uygulamaları çok daha işlevsel ve etkileşimli hale geldiğinden, iş piyasası hem tasarım hem de kodlamayı bilen insanların hizmetlerini talep ediyor.
Web tasarımcıları için hala bazı işler var, ancak çoğu web tasarımcısı daha iyi fırsatlar, ödeme ve iş güvenliği için kod yazmayı öğrenmeye çalışıyor. Birçok yönden, bir front-end geliştiricinin işi, muhtemelen JavaScript gibi bir programlama dili konusunda yetkin bir web tasarımcısı olarak görülebilir.
HTML, web sayfalarının iskeletidir, CSS dış görünümdür ve JavaScript beyindir.
Temel Bilgilerde Ustalaşın
Web geliştirmede kullanılan üç temel teknolojiden kesinlikle emin olmalısınız, bunlar:
- HTML: Bu, tüm web sayfalarının ilk temel yapı taşıdır, web sayfalarına yapı kazandırır. HTML bir kodlama dilidir, ancak tam teşekküllü bir programlama dili değildir, bunun yerine bir biçimlendirme dilidir. Biçimlendirme dilleri, işleme amacıyla metni "işaretlemenize" olanak tanır.
- CSS: Bu, tüm web sayfalarının ikinci temel yapı taşıdır, web sayfalarının "görünüm ve izleniminden" sorumludur. CSS ayrıca bir programlama dili değildir.
- JavaScript: üçüncü yapı taşı ve çoğu web geliştiricisinin öğrendiği ilk gerçek programlama dilidir. JavaScript bilgisayarın tarayıcısında çalışır ve bir web sayfasının işlevselliğine izin verir.
Web geliştirmenin üç yapı taşını bir insanı hayal ettiğiniz gibi hayal ederseniz, bunu şu şekilde düşünebilirsiniz: HTML, web sayfalarının kemikleri ve iskeletidir, CSS dış görünümü sağlar ve JavaScript beyindir.
Web geliştirme teknolojilerini öğretmede WHIZ olan Brad Traversy'nin HTML hızlandırılmış kursunu alarak şu anda kodlama öğrenmede bir çatlak atabilirsiniz:
Temel Web Geliştirme Araçları
- Metin Editörü: Bir metin editörü kullanarak kod yazıyoruz ve bir tane seçmeniz ve tüm yeteneklerine aşina olmanız gerekiyor. Günümüzün popüler metin editörlerinden bazıları şunlardır: Atom, Sublime Text, Parantezler, Visual Studio Code ve eski güzel MS Not Defteri ve Mac Metin Düzenleme.
- Tarayıcı Geliştirici Araçları: Google Chrome ve Mozilla Firefox, tarayıcınızdaki herhangi bir web sitesinin kodunu görüntülemenize ve değiştirmenize olanak tanıyan dahili geliştirici araçlarıyla donatılmıştır.
- Bu araçlar, hata ayıklama amaçları için ve elbette iyidir… Web sitesinde geliştirici araçlarıyla yaptığınız değişiklikleri görebilen tek kişi sizsiniz, çünkü siteyi yalnızca kendi tarayıcınızın içinde göründüğü şekliyle değiştiriyorsunuz.
- Sürüm Kontrol Sistemleri: Sürüm kontrol sistemleri, web projelerinizdeki değişiklikleri yönetmenize izin verir. Bu, üzerinde çalıştığınız projeyi mükemmelleştirene kadar konuşlandırılan projeye müdahale etmeden bir projenin farklı sürümlerine geri dönmenize olanak tanır. Kullanımda olan birkaç sürüm kontrol sistemi vardır, ancak Git en baskın olanıdır.
- Komut Satırı (Terminal): Profesyonel web geliştirme için komut satırına tam bir hakimiyet gereklidir. Komut satırı korkutucu görünüyor, ancak yeni yazılım paketlerini yüklemeyi kolaylaştırıyor ve ayrıca dosyalar ve klasörler arasında gezinmeyi çok kolaylaştırıyor. Bir gün içinde komut satırında ustalaşmayı öğrenebilirsiniz.
Temel Web Geliştirmeyi Destekleyen Teknolojiler
- CSS Ön İşlemcisi: Bu teknoloji, CSS yazmayı ve korumayı çocuk oyuncağı haline getirir. Şimdiye kadar, en yaygın CSS ön işlemcisi SASS'dir ve bir günde öğrenilebilir
- CSS Çerçeveleri: Karmaşık CSS görevlerini oluşturmak için daha az zaman harcamak söz konusu olduğunda, bilmeniz gereken CSS çerçevesi Twitter Önyükleme'dir.
- CSS Flexbox ve CSS Izgarası: Bunlar, web sayfalarınızı mobil duyarlı hale getirmeye önemli ölçüde yardımcı olan CSS web modeli düzenleridir.
- Donatılacak Araçları: WebPack ve Browserify ile Gulp hızlı tarayıcıya yardım yüke sayfanızı kullanılmaktadır. Bu araçlar, daha hızlı yükleme süreleri için içeriğinizi küçültmeye veya daraltmaya yarar.
- JavaScript Kitaplıkları ve Çerçeveleri: kitaplıklar ve çerçeveler, web sayfalarına hızlı, daha kolay ve daha verimli bir şekilde JavaScript etkileşimleri eklemenizi sağlar. Ayrıca JavaScript'in daha karmaşık yönlerini basitleştirmeye de yardımcı olurlar. Popüler kütüphanelerden ve çerçevelerden bazıları şunlardır: JQuery, React ve Angular.
Gördüğünüz gibi, bir front-end web geliştiricisi olmak için öğrenmeniz gereken çok şey var. İyi haber şu ki, bu araçların, kaynakların ve teknolojilerin TÜMÜ ücretsiz olarak öğrenilebilir. Sadece YouTube'da tonlarca ücretsiz kaynak olduğunu zaten görebilirsiniz…
Daha kapsamlı bir öğrenmeye ihtiyacınız varsa, bu araçların tümü Team Treehouse gibi çevrimiçi öğrenme kaynakları kullanılarak neredeyse sıfıra indirilebilir. Udemy'de Tam Ön Uç Geliştirme kursu veya Modern React gibi tek kurslar da mevcuttur.