2021’in En Popüler Front-End Framework’leri

2021’in En Popüler Front-End Framework’ leri sorusu sorulsa aklınıza ilk hangisi gelir? Aşağıda yüksek ihtimalle hepinizin aklına gelen Frameworkleri bende sıralıyor olacağım. Biliyorsunuz 2 önceki blog yazımda 2021’in En Popüler Front-End Framework’leri nelerdir ile ilgili bir yazı yazmıştım. Şimdi de bunun karşı hamlesi olarak 2021’in En Popüler Front-End Framework’leri sorusunu yöneltiyorum. 😊

Peki nedir bu front-end ya da back-end ? gibi sorular yöneltecek olan yazılıma aşina olmayan ya da meraktan okuyan okurlarım için kısa bir cevap vermek istiyorum.

Front-End Development Nedir?

Dahaçok web yazılımı geliştirme kısmında adını andığımız, ön-uç geliştirme olarak Türkçeleştirilmiş başta HTML+CSS+JS dillerini yalayıp yutmuş üstüne bir de Back-End ile iletişime geçirmek için JS kütüphanelerinden birkaçını cebine koymuş tasarımcıdan gelen PSD ya da Figma dosyalarını hem de full responsive yani mobil uyumlu olarak kodlamakla mükellef benimde bir zamanlar yaptığım ve ara sıra hala yaptığım geliştirme tarafı diyebiliriz.

Peki buna karşılık Back-End Development nedir?

Back-End Development Nedir?

Front-End Developer’ den gelen kodlanmış dosyaları baz alarak oluşturduğu altyapı ile bağlayan veritabanı kısmını halleden ve front-end cinin yaptığı sistemi çalışır dinamik hale getiren kısım yani Back-End Developerler.

Günümüzde açıklayacağım Frameworkler sayesinde işlerin çoğu client-side yani istemci tarafına dolayısıyla browser’a yüklendiği için Front-End cilerin önemi bir hayli yükseldi. Öncesinde server-side diyip işlerin çoğunluğunu arka tarafta hallederdik. Şimdi ise yukarıda söylediğim gibi durumlar değişti biraz. Hatta Back-End Front-End kavramları biraz karıştığı için bile bazen Full-stack diyip geçiyoruz. Ki bu dediğim title Türkiyemizde çok da işlevi olmayan bir kavram diyebilirim. Çünkü ikisini de oturup özür dilerim hayvan gibi yazanların sayısı çok az. Bu yüzden genel Full-Stack abilerimiz ; asıl yani çoğunlukla yaptığı kodlama ne ise diğeri ile de ilgili az buçuk hatta mid seviyede bilgi sahibi. Şimdi gelelim yukarıda bahsedeceğim dediğim Frameworkleri sıralamaya. Ha unutmadan Framework nedir? Sorusu ile de kısa yanıt vereyim.

Framework; Yazılım günümüzde biraz daha yapboz haline geldi diyebilirim. Şimdi parçaları birleştirip sistematik bir şekilde kurduğunuzda ortaya jenga gibi bir şey çıkıyor. Öncesinde yani 2008’ lerde lise zamanlarımda iken ADO.Net ile veri tabanı bağlantısı yapmak ölüm gibi birşeydi. Conn.open(); sonra close filan yani. Ama şimdi öyle değil. Neden mi? Çünkü Frameworkler ve programlama dilleri bir nebze olsun düşük seviye dillere dönüştü. Yani makine diline(Assembly) uzak insan diline yakın hale. İşte bu frameworkler içlerinde hazır fonksiyonlar ve kod yapıları barındırıyor. Bizde bunları efektif bir şekilde kullanmayı iyi biliyorsak yazılımcı oluyoruz. 😊 Yani efektiften ne anladığınıza bağlı. Frameworkleri de uzun tuttum. Hemen başlıyorum…

2021’in En Popüler Front-End Framework’leri

React

Uygulamaların hızını arttırmaya yardımcı olan etkileşimi UI’ler (User Interface / Kullanıcı Arayüzleri) oluşturmak için kullanılan bir ön uç geliştirme kitaplığıdır ve açık kaynaklıdır. Öğrenmesi en basit frameworklerden biridir ve sürekli iyileştirme yapıldığından dolayı kod sürdürülebilirliği sürekli vardır. E yani Facebook ve katkı sağlayan diğer yazılımcılar bu kütüphaneyi oluşturdu sonuçta olsun o kadar 😊

Geliştiren :
Facebook Mühendisleri

Rakamlar / Metrikler / İstatistikler :
En iyi 10 bin web sitesinin %13'ü React kullanıyor.
Ocak 2021 itibariyle 3 milyon aktif kullanıcı
Geliştiricilerin %80'i olumlu deneyimler yaşadı 
(kaynaklar : 34k Github yıldızı (Kaynak: github.com )

Artıları:
Öğrenmesi, kullanması ve uygulaması kolaydır.
Yerleşik Bileşenler, uygulamanın diğer bölümlerinde yeniden kullanılabilir.
Sanal DOM'si (belge nesne modeli), olağanüstü işlevsellik sağlar ve tutarlı, kusursuz performans sağlar. Yüksek yüklü uygulamalar için hızlı işleme sağlar.
Değişiklikler kolayca yapılabildiğinden üretkenliği ve bakımı artırır.
React geliştirici araçları adlı gelişmiş bir tarayıcı uzantısına sahiptir ve bu, geliştiricinin bileşenleri geliştirmek ve geliştirmek için ayrıntılı gözlemler yapmasına olanak tanır.

Eksileri:
JSX kavramları geliştiriciler için biraz zor olabilir).
Sürekli ve çoklu güncellemeler, uygun belgelendirmeyi biraz zorlaştırır.
ReactJS yalnızca ön uç çözümleri sunar.

Kullanan Büyük Şirketler / Web Siteleri:
Facebook
AirBnB
Ubereats 
Netflix
Codeacademy
Zendesk
Skyscanner

Angular

Modern TypeScript tabanlı, açık kaynaklı bir framework özelliğinde ve en yüksek puan alan yazılım geliştirme araçlarından biridir. DOM eventlerini kontrol etmeyi bayağı bi mümkün kılan ve zengin HTML içerikler üretmek için kullanılan bir framework’ dür. Test edilebilirliği kolaydır ve hiyerarşik bir yapıya sahiptir.

Geliştiren:
2010 yılında Google

Rakamlar / Metrikler / İstatistikler:
Angular ile 600K'dan fazla web sitesi geliştirildi.
75 bin Github yıldızı (Kaynak: github.com )

Artıları:
Modelde yapılan değişiklikleri görünüme ve tam tersine güncellemek için yerleşik işlevsellik
Varsayılan olarak iki yönlü veri bağlama sağlandığı için kod miktarını azaltır
Bileşenleri harici öğeler tanımlayarak bağımlılıklardan ayırır
Bileşenler, bağımlılık enjeksiyonu kullanılarak yeniden kullanılabilir

Eksileri:
Yeni başlayanlar için zor ve daha küçük takımlar için bunaltıcı
Sınırlı SEO yetenekleri
Şişirilmiş kod ve büyük boy
Dinamik uygulamalar bazen gecikebilir ve işarete kadar performans göstermeyebilir.

Kullanan Büyük Şirketler / Web Siteleri:
Microsoft Office
BMW
Forbes
Gmail
Upwork

 Vue.JS

İyi hazırlanmış belgeler ve destekleyici bir toplulukla birlikte gelen, yeni başlayanlar için en kolay frameworklerden biridir. Vue, uçtan uca test araçları, eklenti yükleme sistemleri, tarayıcı hata ayıklama araçları, sunucu oluşturucu, durum yöneticisi ve diğerleri gibi çok çeşitli araçlara sahiptir.

Vue, yüksek hızlı performansının altında yatan sanal DOM, bileşen tabanlı mimari ve iki yönlü bağlama özelliklerine sahiptir: tüm bunlar, ilgili bileşenleri güncellemeyi ve veri değişikliklerini izlemeyi kolaylaştırır.

Geliştiren:
Evan You , 2014

Rakamlar / Metrikler / İstatistikler :
Vuejs ile 700 binden fazla web sitesi oluşturuldu.
186 bin Github yıldızı
En iyi 10 bin web sitesinin %20,28'i vuejs kullanıyor.
1.606.204 canlı web sitesi vuejs kullanır.
Ek olarak 893.787 site geçmişte Vuejs kullandı. (Kaynak: buildwith.com)

Artıları:
Kapsamlı ve ayrıntılı belgeler
Basit sözdizimi — javascript arka planına sahip programcılar Vuejs ile kolayca başlayabilir
Uygulama yapısını tasarlama esnekliği
Daktilo desteği

Eksileri:
Bileşenlerde kararlılık eksikliği
Nispeten küçük topluluk
Eklentiler ve bileşenlerle dil engeli

Kullanan Büyük Şirketler / Web Siteleri:
Alibaba
Zerodha
9gag
Reuters
Xiaomi

JQuery

En eski frameworklerinden biridir. jQuery, basitlik ve kullanım kolaylığı sunar ve kapsamlı JavaScript kodları yazma ihtiyacını en aza indirir. jQuery, CSS ve DOM’yi değiştirmek ve bir web sitesinin işlevselliğini ve etkileşimini optimize etmek için kullanılır. Geliştiricilerin HTML5 tabanlı UI sistemi jQuery Mobile ile yerel mobil uygulamalar oluşturmasını sağlar. jQuery tarayıcı dostudur ve kullanmayı düşündüğünüz tüm tarayıcıları destekler. Eski bir front-end ci der ki; Jquery çıktı mertlik bozuldu. 😊 anlayan anladı.

Geliştiren:
John Resig , 2006

Rakamlar / Metrikler / İstatistikler:
55k Github yıldızları (Kaynak: github.com )
En iyi 10 bin web sitesinin %3.18'i Jquery kullanıyor.
222.200 canlı web sitesi jQuery kullanıyor
Ek olarak 437.243 site geçmişte jQuery kullandı. (Kaynak: buildwith.com)

Artıları:

DOM, öğeleri eklemek veya çıkarmak için esnektir
HTTP istekleri göndermek basitleştirildi
Dinamik içeriği kolaylaştırır
En iyi UI çerçevelerinden biri, çapraz platformlarla iyi uyumluluk sağlar

Eksileri:
jQuery dışında birçok gelişmiş alternatif mevcuttur
Belge nesne modelinin API'leri eskidir.
Değişikliklere karşı oldukça hassastır
Uygun bir JS temeli ile kullanılmazsa gelecekte büyük hatalara yol açabilir.
jQuery, CSS'ye kıyasla daha yavaştır.

Kullanan Büyük Şirketler / Web Siteleri:
upwork
Linkedin
Github
Fiverr
Udemy

Emberjs

Bileşen tabanlıdır ve Angular’a benzer iki yönlü veri bağlama sunar. Günümüz teknolojilerinin artan taleplerini sorunsuz bir şekilde karşılamak için tasarlanmıştır. Emberjs ile karmaşık mobil ve web uygulamaları geliştirmek için kullanılır ve verimli mimarisinin sorunları gidermesi beklenir.

Geliştiren:
2016 yılında Yehuda Katz

Rakamlar / Metrikler / İstatistikler :
21k Github yıldızı (Kaynak: github.com )
34.015 canlı web sitesi Ember kullanıyor
Ember'i tarihsel olarak kullanan ek 94.463 site
En iyi 10 bin web sitesinin %1,34'ü Emberjs kullanıyor. (Kaynak: buildwith.com)

Artıları:
Piyasadaki en hızlı frameworklerden biridir.
İki yönlü veri bağlama sağlar.
Tüm ihtiyaçlarınız için iyi geliştirilmiş ve eksiksiz bir Paket ekosistemi sunar.
Geriye dönük uyumludur, bu nedenle uygulamaların eski sürümleri, yeni güncellemelere rağmen kusursuz çalışmaya devam eder.

Eksileri :
Küçük bir topluluk, daha az popüler
Karmaşık sözdizimi ve yavaş güncellemeler
Öğrenmesi zor
Küçük uygulamalar için ağır çerçeve

En İyi Şirketler / Web Siteleri:
Netflix
Microsoft
Linkedin
Square
TED
Bustle

Tabi Fron-End için bu verileri getirdik diye Back-End ile ilgili yapmadık sanmayın. Onun içinde 2021’in En Popüler Back-End Framework’leri yazımı okuyabilirsiniz. Bununla birlikte yukarıda ki frameworklerden Jquery kullanarak yaptığım full mobil uyumlu menüyü de yapmak isteyebilirsin. Blog yazısını okuyarak ya da youtube videosunu seyrederek. İyi bloglar!