Başka bir forumda gorduğum ve ilgimi ceken bir yazıyı sizinle paylaşmak istedim.“Bilgisayar / yazılım muhendisliği bolumu okuyorum, sizce hangi alana yonelmeliyim?”, “İnternet sitesi tasarımı uzerine yoğunlaşmak istiyorum, sizce nereden başlamalıyım?”, “Mobil uygulama geliştirmek istiyorum hangi platformda hangi dille kodlama yapmalıyım?” gibi sorulara, her ay guzel bir yazı dizisi hazırlamak eminim cok kişiye yardımcı olacaktır. -------------------------------------------------------------------- Bugunku yazım, “nasıl iyi bir front end developer olabilirim” uzerine. Bu işe nasıl başlarım, hangi yeteneklere sahip olmalıyım ve ne kadar calışmalıyım gibi temel kavramlar uzerinde duracağım. Oncelikle Front end developer unvanı ile anılan kişi, kullanıcıların etkileşime girdiği on yuzun HTML&CSS, JavaScript, jQuery teknolojilerini kullanarak yapan kişidir. Kısaca gorduğunuz, tıkladığınız, gorsel ve dokunsal olarak tecrube ettiğiniz her şeydir. Ulkemizde henuz ayrımı cok net bilinmese de, Front end developer ve back end developer kavramları kurumsal alanlarda birbirinden tamamen ayrılmıştır. Bir sonraki yazı dizimde de back end developer kavramından detaylıca bahsedeceğim. Fakat şu an icin kısa bir ayrım orneği vermek gerekirse; back end developer bir şehrin altyapısını oluşturan kişi (elektrik, su ve kanalizasyon sistemleri, bina yapıları gibi), front end developer ise bu şehrin gorunen kısmını (yollarını, bina dış cephelerini, parklarını ve peyzajını) yapan kişi olarak duşunebilirsiniz. Gelelim tekrar konumuz olan front end developer kavramına. Piyasada genellikle bu isimle anıldığı icin surekli ingilizce telafuzunu yapıyorum. Guzel dilimizde de “on uc / on yuz geliştirici” veya forum dillerinde “arayuz tasarımı” olarak da denk gelebilirsiniz. Front end developer kavramının bir cok alt kırılımı mevcut. Bunların detayına girmeyeceğim ama kısa kısa değineceğim. Zira hepsinin kullanacağı teknolojiler hakkında bilgilenmek, bizim daha cok işimize yarayacaktır. Sonrasında siz keyif aldığınız dala atlayabilir ya da daldan dala gezebilirsiniz. Front End Developer Alt Dalları Front End Web Developer CSS Developer JavaScript Developer jQuery Developer UI / UX Developer Mobile Front End Developer Front End Test ve Problem Cozumu
Front End Developer Olmak İcin Mutlaka Sahip Olmanız Gereken Teknolojiler 1- HTML & CSS HTML (Hyper Text Markup Language) ve CSS (Cascading Style Sheets) kavramları web kodlamanın en temel yapı taşlıdır. Bu iki şey olmadan bir internet sitesi oluşturamazsınız. Herhangi bir internet sitesi geliştirmek icin HTML ve CSS’ de ustalaşmak gerekiyor. Guzel haber, sağlam bir calışma ile sadece birkac haftada bunun ustesinden gelebilirsiniz. Not: Yalnızca HTML ve CSS bilgisi edinmek, temel internet sitelerini oluşturmanıza izin verir. Karmaşık yapılar oluşturmak icin sonraki adımlarda da ustalaşmanızı gerektirir. 2- JavaScript JavaScript, internet sitelerine biraz daha işlevsellik eklemenize izin verir. HTML, CSS ve JavaScript (kısaca JS) dışında bir şey kullanmadan cok sayıda temel web uygulaması oluşturabilirsiniz. En temel duzeyde JS, internet sitelerinize bir cok interaktif oğe eklemenizi sağlar. JS’yi, gercek zamanlı olarak guncellenen haritalar, etkileşimli filmler ve cevrimici oyunlar oluşturmak icin kullanabilirsiniz. Pinterest gibi siteler, kullanıcı arayuzunu kullanımı kolaylaştırmak icin JavaScript'i yoğun bir şekilde kullanmaktadır. Guzel haber, JavaScript’te master olursanız, dunyadaki en populer programlama dilinde dev bir kariyer elde edebilirsiniz. 3- jQuery jQuery bir JavaScript kutuphanesidir. jQuery ile her şeyi sıfırdan kodlamak zorunda kalmazsınız, projelerinize hazır oğeler eklemenizi, boylece gerektiği gibi kişiselleştirebilmenizi sağlar. (JavaScript'in bilinmesinin bir nedende budur). Geri sayım sayacları, arama formu, otomatik tamamlama ve hatta kılavuz duzenlerini otomatik olarak yeniden duzenleyip yeniden boyutlandırmak gibi işlerde, jQuery’yi kullanabilirsiniz. 4- JavaScript Frameworks JavaScript icin alternatif bir cok framework bulunmaktadır. En populerleri; Angular JS, Backbone, Ember, React JS, Node JS ve Vue JS’tir. Bu frameworkler JavaScript kodunuz icin hazır bir yapı sağlar. Farklı ihtiyaclar icin farklı framworkleri tercih edebilirsiniz. Amac sıfırdan kodlamayı en aza indirgemektir. 5- Frond-End Frameworks CSS ve on yuz geliştirmek icin yine kodlama işini azaltmak amaclı kullanılan populer frameworkler mevcuttur. Bunlardan en bilinenlerinden birisi Bootstrap’tir. İcerisinde hazır CSS ve JavaScript kutuphaneleri bulunmaktadır. Boylece projelerinizi hızlı bir şekilde geliştirmeye başlayabilir, esnek yapılarıyla istediğiniz gibi şekillendirebilirsiniz. YouTube ve Udemy uzerinde oldukca fazla kaynak mevcuttur. Kurulumu ve kullanımı hakkında bu siteleri kullanabilirsiniz. 6- CSS Preprocessors (On İşlemciler) On işlemciler, CSS kodlamanızı hızlandırabilecek başka bir unsurdur. Bir CSS on işlemcisi, CSS'mizin olceklenebilir olmasını ve birlikte calışılmasını kolaylaştırmak icin CSS'ye ekstra işlevsellik katar. İnternet sitenize yayınlamadan once kodunuzu işler ve onu iyi bicimlendirilmiş ve capraz tarayıcı dostu CSS haline getirir. SASS ve LESS is talebi oncesi islemcilerin en buyuk iki tanesidir. 7- Responsive ve Mobil Tasarım Reponsive (duyarlı) tasarım, internet sitesinin duzeninin ekran boyutuna gore ve kullanılan cihaza gore değiştiği anlamına gelir. Orneğin bir internet sitesi buyuk monitorlu ve yuksek cozunurluklu masaustu bilgisayardan ziyaret edildiğinde farklı tasarım gorulecek, aynı siteyi herhangi bir mobil cihazda ziyaret ettiğinde ise o cozunurluğe gore optimize edilmiş ancak aynı temel dosyaları kullanan farklı bir tasarım ile karşılaşılacaktır. Mobil tasarım, responsive tasarımı icerebilir. Ancak bazen bir kullanıcının bir masaustu bilgisayarda sitenizi ziyaret ederken yaşamak istediği deneyim, kullanıcıların akıllı telefonlarından ziyarette gormek istediklerinden tamamen farklıdır. Bu gibi durumlarda, mobil sitenin tamamen farklı olması mantıklıdır. Orneğin, cevrimici bankacılığa sahip bir banka internet sitesi, kullanıcıların en yakın banka yeri ve basitleştirilmiş hesap gorunumu gibi şeyleri (mobil ekranlar daha kucuk olduğu icin) goruntulemelerini sağlayan ayrı bir mobil tasarım yapabilir. Kısacası mobil uygulamalar . 8- Capraz Tarayıcı Geliştirme Modern tarayıcılar, internet sitelerini tutarlı bir şekilde goruntulemede oldukca başarılıdır. Fakat sahnenin arkasında kodu nasıl yorumladıkları konusunda hala farklılıklar vardır. Firefox, Chrome, Safari, Opera ve İnternet Exploerer gibi farklı tarayıcılarda internet site tasarımlarınız farklı gorulebilir. Bu konu farklı bir yazımızda detaylı olarak bahsedilecek kadar detaylıdır. Bu nedenle eğer şu an icin ilgili olduğunuz bir konu ise iyi bir araştırma ile kendinizi bilgilendirebilirsiniz. 9- Test ve Hata Ayıklama Her kodlama işleminde olduğu gibi internet sitesi geliştirmede de hatalar olur. Bu nedenle test etme ve hataları duzenleme gibi stresli, yoğun calışma gerektiren bu aşama oldukca sancılıdır. Bu nedenle temiz kodlama, test ve hata ayıklama işleminde oldukca onemlidir. Tasarımızda yolunda gitmeyen bir durumda projenizi test etmek sizi oldukca yoracaktır. Bu gibi durumlar icin ucuncu şahıslardan yararlanmak iş yukunuzu oldukca hafifletecektir. Bu nedenle cok gizli olmayan projelerinizi Beta surumu ile surmek, size bu aşamada oldukca avantaj sağlayacaktır. 10- Problem Cozme Yetenekleri Her şey tamam ve diyelim ki mukemmel işleyen bir on yuz oluşturdunuz ve bu tasarımınızı bir back end developer icerik yonetim sistemi ile entegre ederken aniden muthiş ozelliklerin yarısı calışmaktan vazgecti. İşte burada biraz da uzun yıllar calışmanın getirdiği tecrube ile projenin felakete donuşmesini engelleyecek proje cozme yetenekleri gerekiyor. Bu kısım biraz fazla mesai harcamanıza neden olabilir. Cunku problem cozmek tecrube ile doğru orantılıdır. Umarım aklınızdaki sorulara kısa ve yalın anlatımlarla cozumler sunabilmişimdir. Surcu lisan ettiysek affola. Bir sonraki yazı dizilerimizde goruşmek dileği ile iyi calışmalar.
__________________