Frontend Kapsam

İnternet Uygulamaları için Altyapıların 2010–2020 Değişimi

5 yıl arayla yazdığım 3 blog yazısı ile Web App/Site geliştirmek için altyapıların, kütüphanelerin nasıl değiştiğini anlatmaya çalışıyorum.

Web Teknolojilerindeki Gelişim
  • 7 Eylül 2015 Tarihli Blog Yazısı
  • 5 Kasım 2020 Tarihli Blog Yazısı

A. 9 Nisan 2010 Tarihindeki Blog Yazısından Alıntı

2010 yılında Savunma Sanayi projelerinde 8 yıldır Java Swing ile UI geliştiriyordum. Geliştirdiğimiz yazılımlar hep kapalı sistem olduğu için bu sıralarda arkaplanda HTML, Internet ve Mobil teknolojileri nasıl geliştirildiğini merak ediyor ve bu konularda da araştırmalar yapıyordum.

Web Teknolojileri

2010 Yılında Web Uygulama Altyapıları (Tarayıcı Plugin)

  • Adobe Air
  • Google GWT
  • JavaFX
  • Microsoft Silverlight
  • HTML5
  • Arayüzler arası geçişlerin yumuşak/temiz bir şekilde gerçekleşmesi (Animasyon desteği)
  • Bileşenler üzerine efekt uygulayarak (Örneğin: yansıma) Bileşenlerin daha etkili gösterilmesi
  • Bileşenlerin dikdörtgen 2 boyutlu kalıplarından çıkarılarak 3 boyutu kullanan daha estetik görünüşe sahip bileşenler olması.
  • Video, Müzik ve Resim formatlarını desteklemesi
  • Dokunmatik Ekran ve Sensor sağladığı yetenekler (Örneğin iPhone resim uygulaması)
  • Uygulamalara internet olan her ortamdan erişebilme (PC, Laptop, Cep Telefonu, TV)
  • Oluşturduğun içeriği internette saklama ve istediğin zaman, herhangi bir yerden, oluşturduğun verilere ulaşabilme ve kullanma (Örneğin Google Uygulamaları)
  • Uygulamalara güncellemelerinin sorunsuz bir biçimde gerçekleşmesi
  • Uygulamaların virüs taşımadığından ve sisteminize zarar vermeyeceğinizden emin olmak
  • Uygulamaların üzerinde çalıştığı donanımı en iyi performans alacak şekilde çalıştırması.

B. 7 Eylül 2015 Tarihindeki Blog Yazısından Alıntı

KAZANAN → HTML5,JS,CSS3

HTML5 → Özetle zengin içerikli web uygulamalarında HTML5 bütün rakiplerini yenerek tek başına ayakta kaldı. Artık tarayıcılar üzerinde UI ve App kütüphaneleri Angular, React ve Ember.js gibi direk JS ortamında yazılan kütüphaneler.

KAYBEDEN → DİĞERLERİ

SunOracle satıldı. İsmi bile unutuluyor. Yeni nesil java dilini, bir çok işletim sistemi ve donanımı geliştiren SUN tanınmayacak bile..

C. 5 Kasım 2020 Tarihindeki Blog Yazısından Alıntı

Bu yazının başlığı ne oluyor diye düşünsem “JS TARAYICIDAN DIŞARIYA TAŞTI ve JS STACK HTML YUTUYOR” olurdu. Neden olduğuna gelirsek;

C.1 JS Tarayıcıdan Nasıl Dışarıya Taşıyor ?

JS önceden sadece Tarayıcılar üzerinde çalıştırılırken günümüzde , ilk önce NodeJS ile birlikte sunuculara, ordan , React Native ile mobil cihazlarda, Electron ile Masaüstünde ve iOT cihazları üzerinde çalıştırılmaya başlandı. Tabi JS tarayıcıların dışında da kullanılıyor olması inanılmaz büyük bir ekosistemin oluşmasını tetikledi. JS günümüzdeki en önemli dillerden birisi diğerde (Yapay zeka ve Makine Öğrenmesi alanındaki Python)

  • NodeJS → Chakra, SpiderNode, V8
  • Elektron → V8
  • IoT → Duktape, Jerryscript

C.2 JS HTML Nasıl Yutabilir ?

Önceden Popüler olan LAMP Stack: Zengin İçerikli uygulamalar dışında statik web sayfaları üzerinden geliştirilen bir çok web sayfası bulunuyordu , bu CMS sayfalarını ve Forumları oluşturmak için Drupal, Joomla, Wordpress, PhpBB, Moodle vb, hazır sistemler alt yapılarında genellikle LAMP Stack kullanıyordu.

LAMP Stack
L=LINUX (OS)
A=APACHE (Web Server)
M=MySQL (DataBase)
P=PHP (Language)
  • CI/CD sistemlerinin gelişmesi
  • Bulut Teknolojilerinin CDN artması, Serverless
  • JS bileşen kütüphanelerinin(React, Vue, Svelte) belli bir olgunluğa erişmesi,
  • Inline CSS kullanımının yaygınlaşması,
  • API, Webhook ve GraphQL gibi teknolojilerin yaygınlaşması
JAM Stack
J=JS
A=API
M=Markup

C.3 JS CSS Nasıl Yutabilir ?

Aynı JS yetinmeyenlerin Typescript, Reason, Elm gibi JS üst türev dillerini çıkardığı gibi CSS ile yetinmeyenler SCSS, PostCSS ve LESS gibi türevlerini çıkardılar . Bunu çıkarmakta tabiki haklılardı , artık geliştirme sırasında JS , CSS tek bir dosyada tutulmuyor modüler olarak geliştirilip Webpack bundle haline dönüştürülüyordu. Bunun yanında bir seviye daha ileri gidip madem bizim modül JS dosyalarımız var neden ayrıca CSS dosyalarını biz oluşturalım ki bir katman daha koyalım JS içerisinden Style tanımlayalım dediler ve ortaya aşağıdaki şekilde Inline CSS kütüphaneleri ortaya çıktı;

  • Style Components
  • CSS Modules
  • vb…

Okumaya Devam Et 😃

Bu yazının devamı veya yazı grubundaki diğer yazılara erişmek için bu linke tıklayabilirsiniz.

--

--

Frontend Lead at Thundra

Love podcasts or audiobooks? Learn on the go with our new app.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store