Micro Frontend Mimarisi

Mert DEMİR
Berkut Teknoloji
Published in
3 min readDec 13, 2021

Micro frontend teknolojisine dalmadan önce, micro frontend kavramı belli belirsiz bir şekilde microservices mimarisinden esinlendiği ve adını aldığı için microservices mimarisinin ne olduğunu bilmeliyiz.

Resmi belgelere göre microservices’in tanımına aşağıdaki linkten ulaşabilirsiniz.

Microservices architectural olarak da bilinen microservices, aşağıdaki özelliklere sahip olan bir mimari stildir:

  • Son derece sürdürülebilir ve test edilebilinir olması
  • Bağımsız deploy yapılabilinir olması
  • İş yapış yeteneklerine göre organize olması
  • Küçük bir ekip tarafından geliştirilebilir olması

Microservices mimarisi, büyük ve karmaşık uygulamaların hızlı ve güvenilir bir şekilde teslim edilmesini sağlar.

Şimdi micro frontend kısmına geri dönersek, micro frontend temel olarak işlevselliğin frontend’e genişletildiği microservices pattern’in bir uzantısıdır. Sonuç olarak, micro frontend, deployment bağımsızlığı(independence), özelliklerin daha kolay test edilmesi vb. dahil olmak üzere çok çeşitli avantajlar sağlar.

Micro Frontends’in arkasındaki fikir, bir web uygulamasını bağımsız ekipler tarafından yapılabilinir oldugunu düşünmekten gelir. Her ekibin önemsediği ve uzmanlaştığı ayrı bir iş alanı vardır. Bir ekip cross-function ve features’ı veritabanından kullanıcı arayüzüne kadar uçtan uca geliştirir.

Micro Frontends Arkasındaki Temel Kavramlar

Teknolojiden Bağımsız Olun

Her takım, diğer takımlarla koordinasyona girmeden bir stack seçmeli ve o stack’i upgrade etmelidir. Özel öğeler(elements), diğerlerine tarafsız bir arabirim sağlarken uygulama ayrıntılarını gizlemeye yardımcı olur.

Takımın Kodunu İzole Et

Ekipler aynı framework kullansa bile asla bir çalışma zamanını(runtime) paylaşmayın. Kendi kendine yeten bağımsız bir uygulama oluşturun. Paylaşılan state veya global değişkenlere(variables) güvenmeyin.

Takım İçin Prefixes Oluşturun

İzolasyonun henüz mümkün olmadığı durumlarda adlandırma kurallarını kullanın.

Özel API’ler yerine Yerel(Native) Tarayıcı Özelliklerini Tercih Edin

Global bir PubSub sistemi oluşturmak yerine, iletişim için tarayıcı events’lerini kullanın. Ekipler arası bir API oluşturmaya ihtiyaç varsa, bunu mümkün olduğunca basit tutmaya çalışın.

Esnek Web Tasarımı Oluşturun

JavaScript çalıştırılamasa bile featurelar faydalı olmalıdır. Performansı iyileştirmek için universal rendering ve progressive geliştirmeyi kullanın.

Ama neden micro frontend’e ihtiyacımız var? Hadi bunu cevaplayalım.

Modern çağda, yeni web uygulamalarıyla birlikte frontend giderek büyüyor ve backend daha az önemli hale geliyor. Monolith yaklaşımı daha büyük bir web uygulaması için çalışmaz. Bu durumdan kurtulmak için bağımsız olarak hareket eden küçük modüllere bölmek için bir araç olması gerekiyor. Sorunun çözümü micro front-end’dir.

Faydaları özetlemek gerekirse, aşağıda birkaç noktaya değinilmiştir:

  • Daha iyi ölçeklenebilirlik.
  • Ekipler bağımsız çalışabildiğinden daha hızlı geliştirme.
  • Uygulamanızda birden çok framework kullanabilirsiniz. Ancak, karışıklığı önlemek için dikkatli ve şeffaf bir şekilde yapılmalıdır.
  • Deploy bağımsızlığı.
  • Micro frontend de, front-end’in bölümlerini daha sorunsuz bir şekilde yükseltebilir, güncelleyebilir ve hatta yeniden yazabilirsiniz.
  • Bağımsız olduğu için uygulamanın geri kalanının sabit kalmasını sağlamak daha kolaydır. Micro frontend sayesinde artık tüm uygulamayı takip etmenize gerek yok.
  • Codebase daha küçük ve daha yönetilebilir.
  • Uzmanların daha kolay işe alınması. Micro frontends sayesinde belirli bir teknoloji ile geliştirilen uygulamanız için sadece o alanda uzman olan birini ararsınız, böylece diğer ekiplerin kullandığı teknolojileri bilmelerine gerek kalmaz.
  • Kolayca test edilebilinir

Sonuç

Micro frontend kullanıp kullanmamanız, büyük ölçüde iş durumunuza bağlıdır. Küçük bir projeniz ve ekibiniz varsa, micro frontend mimarisi o kadar gerekli değildir. Çok sayıda istek içeren büyük projeler ve dağıtılmış ekipler varsa o zaman micro frontend mimarisini kullanmak mantıklı olacaktır. Bu nedenle günümüzde micro frontend mimarisini birçok büyük şirket tarafından yaygın olarak kullanılmaktadır.

Kaynakça

--

--

Mert DEMİR
Berkut Teknoloji

Software Engineering => {#JavaScript #Vuejs #Nuxtjs #Jest}