Evde kaldığımız şu günlerde ihtiyaçlarımız ve önceliklerimiz de değişti. Daha önce nadiren kullandığımız görüntülü toplantı yapmak artık normal hale geldi. Tabi görüntülü görüşmelerede görüntü kalitesini önemli bir etken.

Görüntü kalitesini belirleyen bir kaç etken var. Bunlardan bir tanesi web kamerası. Birçok yönden mükemmele yakın çözümler sunan Mac Book Pro nedense web kamerası konusunda diğer dizüstü bilgisayarlar gibi beklentilerin altında kalıyor. İdare bile etmiyor. Hal böyle olunca bir çözüm arayışına girdim. Bu çözüm arayışında JSTurk’ün son Panel’indeki yorumlar da etkili oldu. İzlemeyenler için JSTurk Panel 2

Murat‘ın önerisiyle ilk olarak EpocCam uygulamasını kurdum. Ancak sonra Iriun uygulaması daha iyi görüntü verdi sanki.

Kurulum iki aşamadan oluşuyor.

İlk başta bilgisayarda programı çalıştırıp sonra telefonda uygulamayı açıp biraz bekleyince uygulamada görüntü geliyor. Artık bilgisayarda telefonunuzun kameralarını(ön/arka) web kamerası olarak kullanabiliyorsunuz.

Tabi her işte olduğu gibi bu konuda da ilk kurulumda çalışmadı. Toplantıları yaptığım uygulama Zoom‘un kamera seçim listesine telefonun kamerası seçenek olarak gelmedi.

Araştırmalarım sonucunda birşey de çıkmadı, derken bugün EpocCam’in youtube kurulum videosu altındaki ilk yorum bana çözümü gösterdi. Çözüm Zoom’un son versiyonu değil önceki versiyonu olan 4.6.7. kurmaktan geçiyor. Bu da Zoom Cloud Meetings 4.6.7 önceki versiyon kurulum bağlantısı.~

Mernuş‘un twitter’dan yazdığı çözüm daha mantıklı. Hem böylece son sürümüde de çalışıyor.

Sonra Zoom’un Sol alttaki Select Camera menüsünden Iriun Webcam seçneği seçmek yeterli.

enter image description here

Evet sonunda telefonumun kamerasını web kamerası olarak kullanbiliyorum.

Çok sık olmasa da ara sıra kullandığım editörden daha iyi bir editör arayışım olur. Uzun senelerdir Sublime Text kullanıyorum. Hızı ve bazı özellikleri beni etkilediği için Sublime Text ile devam ediyorum. Ancak belli aralıklarla diğer editör ve IDE’leri deniyorum.

Daha önceki denemelerimde yaşadığım sıkıntılar nedeniyle vazgeçtiğim Visual Studio Code editörüne geçişimi bu sefer

Bu twitteki Javascript otomatik tamamlamadaki sorunların yeni sürümde düzeldiği haberiyle tekrar denemeye karar verdim.

1. gün

Terminaldeki ilk izlenimlerin gayet güzel. Daha önce istediğim özellikleri bu sefer kolayca ekleyebildim. Böylelikle iTerm kullanımıma son verebilirim.

2. gün

  • İkinci günün başında bir sorun ile karşılaştım. Otomatik tamamlama çok yavaş çalışıyordu. Kodu belli kısmını gizleyen eklentiyi kaldırdım region folding for VS Code düzeldi.
  • Sublime Text’in araması çok hızlı diyordum. Bugün fark ettim ki Visual Studio Code çok daha hızlı.
  • Sublime’da alıştığım girintili yapıştırma kısayolu sorun çıkarıyor her seferinde. Çünkü Visual Studio Code normal yapıştırmaya da kendi otomatik girintiliyor kodu. (Uzun içeriklerde bazen sorun çıkarıyor)

3. gün

Daha önce vazgeçmeme sebep olan - Yavaş arama sonuçları çözülmüş - Terminal’de istediğim özellikler eklenmiş (tıkla kopyala, renk değiştirme, otomatik tamamlama) - Açılıştaki gecikme giderilmiş.

  • Terminalden istediğim dosyası Visual Studio Code açmak için Command Palette (⇧⌘P) shell ve çıkan sonuçlardan Shell Command: Install 'code' command in PATH enter a basmak yeterli. Artık terminalde code dosya_adi.css yazıp istediğim dosyayı açabiliyorum. Detaylı bilgi için tıklayınız.

4. Gün

  • Javascript otomatik tamamlamada sorun olduğu için projeyi aç/kapa yaptım düzeldi :(
  • Terminali tam ekran açmak için cmd+shift+T kısayolu atadım. Terminale de iyice alıştım :)
  • İkinci bir projeyi açtım. New Windows (Pencere demesi ilginç, gerçi Windows işte :)
  • İki proje arasında geçiş için ctrl + r (kntrl + r) sonra ilgili projeyi seçip enter

5. Gün

Yeni bir dosyayı açtığımda anlık açıp başka bir dosyaya geçince onu kapatması sevimli değil. Sublime Text’te de vardı bu bi yerden kapatmıştım. Visual Studio Code’da bulamadım henüz ama can sıkıyor. Buldum. cmd+k+enter ile sabitleniyormuş.

  • Bir şey arayıp sonra ilgili sayfada onu sildiğimde arama sonucunun anlık güncellemesi hoş.
  • Otomatik tamamlama ile log yazıp console tamamlaması yavaş çalışıyordu. Bende çözümü daha gelişmiş bir consol.log ekleyici eklenti ile çözdüm.

İkinci haftaya geçtim ve hala Sublime Text’e geçmediğime göre işler iyi gidiyor demektir. Visual Studio Code hızlı güncellenmesi ve eklentilerinin Sublime Text’e göre daha çok ve hızlı güncelleniyor olması cezbedici. Terminal için iTerm kullanıyorum, Visual Studio Code kullanırken iTerm kullanımımı sıfıra indirdi. Şimdiye kadar eksikliğini hissettiğim tek şey iyi bir javascript ve react otomatik tamamlamasını henüz gerçekleştiremedim. (Airbbnb React Snippet ve Javascript ES6 code snippet yüklü)

Son bir şey daha arama yaptıktan sonra arama ekranı ve sonuçları Esc tıklayınca kapatan bir kısayol tanımı bulamadım. Bilen varsa yorum olarak yazarsa sevinirim.

Niye Sublime Text’i bıraktığımı düşündüm, en bariz aklımda kalan güncellemelerin çok seyrek olması. VSCode ile gelen başarılı bir terminalin olması da bir artı.

Visual Studio Code ile devam. Bundan sonra yaşadıklarımı paylaşmaya çalışacağım.

Kalın sağlıcakla.

Kaynaklar

Yaklaşık olarak 1 senedir ReactJS(Yazının devamında React olarak geçecek) ile geliştirme yapmaya çalışıyorum. Bu bir senelik süreçte yaşadıklarımdan çıkardığım genel fikrimi bu yazıda yazmaya çalışacağım.

React kullanıcı arayüzü (UI) geliştirmek için üretilmiş bir Javascript kütüphanesidir. Nedir bu kullanıcı arayüzü? Aslında düşündüğümde Önyüz (front-end) dediğimiz alanın tamamıdır diyebiliriz. CSS, HTML ve Javascript.

İlk React’ı duyduğumda CSS ve HTML’in Javascript yani React içinde yazılıyor olması benim hoşuma gitmemişti. Hala CSS’in react içinde yazılmasına alışamadım. (SASS kullanıp import ederek de bu sorun aşılabiliyor), HTML’in react içinde yazılıyor olması aslında uzun süredir hayatımızda olan template kodlarıyla(swig, pug, handlebars, vb.) zaten hayatımızdaydı. Tabi react ile bu biraz daha abartılı kullanılıyor.

Şimdi genel başlıklar altında react hakkında görüşlerimi yazmaya çalışacağım.

Topluluğunun Zengin olması

Bu çok önemli bir konu. Javascript kütüphanelerinin yeni ortaya çıktığı dönemlerde mootols diye bir kütüphane vardı animasyon kısmı çok güzel diye bir kaç projede kullanmıştım, jquery’ye olan ilgi daha fazla olunca mootols silindi gitti. Yeterli sayıda geliştiriciyi arkasına alamayınca zamanla kayboldu canım kütüphane.

Benzer bir durum React’ta da var. React topluluğu ve geliştirici desteği çok fazla bundan dolayı aradığınız bir çok eklentiyi ve yardımı bulmak çok kolay. Bu bir anaçatı için çok önemli. Bu sayede ayakta kalıp gelişimini devam ettiriyor.

Aşağıda Stackoverflow anketinde geliştiricilerin sevdikleri kütüphaneler ve yüzdeleri yer alıyor.

Stackoverflow react en sevilen

Burada facebook’un desteğini de unutmamak gerekiyor. Kendi kullanıp geliştirmesi çok büyük avantaj. Angular’ın bu konuda bir dezavantajı var. Google aktif bir şekilde tüm projelerinde angular’ı tercih etmemesi düşündürücü.

Aşağıdaki grafikte npm tends sitesinde 3 kütüphanenin grafiği görülüyor.

npm trends react

https://www.npmtrends.com/react-vs-vue-vs-@angular/core

Yazılım felsefesinin olması

Fonksiyonel programlama paradigmasını ve kurallarını ilk olarak react kullanmaya başlayınca öğrendim. Evet aslında kullandığımız kurallar ancak bir kabul ile uygulamadığımız için eksik kalıyordu. Yazdığımız javascript’in nesne tabanlı kod olduğunu sanıyorduk ancak javascript’in aslında tam bir nesne tabanlı dil olmadığını öğrendik.

Bir programlama paradigmasına bağlı kalmak ve bu yolda ilerlemek ufuk açan kazanımlara neden oluyor. Eski alışkanlıklar mı dersiniz yoksa kolayımımazı geliyor dersiniz bilemiyorum ama bazen yine eskisi gibi kurallara uymadan yazdığımız yerlerde oluyor. Yeniden yazım(refactor) şart. :)

Hızlı yenilenme

Facebook geliştiricileri ve topluluğun geniş olmadığı birçok konuda yaşanan sorunları hızlıca çözme ve yeniliklere adapte olma imkanı sağlıyor.

Javascript topluluğuyla olan yakın ilişkisiyle bir çok yeni javascript özelliği react ile kullanılıyor. Kütüphane sizi buna yönlendiriyor. Diğer kütüphanelerde bu tamamen sizin insiyatifinizde. İsterseniz kullanıyorsunuz istemezseniz eski standartla devam edebiliyorsunuz.

Mesela ES6 yeni özellikleri ilk aşamasından itibaren react içinde kullanılıyor olması çok büyük avantaj. Bu nedenle birçok react kaynağında ilk dersleri ES6 üzerine oluyor.

Yaşam döngüsü metotları(React Lifecycle Methods) çok karışık bir yapıydı Hook ile bu soruna çözüm getirdiler. Artık basitçe buradaki ihtiyaçlarımızı giderebiliyoruz.

Öğrenme zamanı

jQuery ve Vuejs’e göre öğrenilmesi daha çok zaman alan bir kütüphane olduğunu kabul etmek lazım. Angular’a kıyasla daha az diye bilirim. Tabi burada ilk öğrendiğim SPA(Single Page Application / Tek sayfalık siteler) Angular olmasının etkisi olabilir.

Birçok kaynaktan yararlanılabiliyor olmak ve react blog sitesinin güzel içerik sunuyor olması avantaj. Yakın zamanda React blog sitesine Türkçe dil desteği de geldi.

Bu süreçte görsel ve yazılı birçok kaynaktan faydalandım ve faydalanıyorum, bunlardan aklımda kalan önemli iki tanesi:

İş imkanı

Son 2-3 senedir ciddi bir React geliştirici arayışı var. Yurtiçi ve yurtdışında bu konuda birçok şirket react ve react native geliştirici arayışında.

Aşağıdaki kaynakta Angularjs ve Reactjs iş imkanlarının artarak devam ettiğini gösteriyor. Benim piyasada gördüğüm Reactjs’in daha fazla iş arayışı olduğu.

İş olanakları

https://www.hiringlab.org/2019/12/12/big-picture-tech-skill-trends/

Esneklik

Angular gibi tüm ihtiyaçlarını beraberinde getiren bir kütüphane değil React. Bu bazı durumlarda dezavantaj bazı durumlarda avantaj olabilir. Şöyle açıklamaya çalışayım. Eğer topluluğunuz yeteri kadar büyük değilse tümleşik yapılar daha avatajlı ancak topluluğunuz genişse ve yeterli desteği veriyorsa ihtiyaçlar konusındaki çeşitlilik, esneklik tabiki avantaj. Bu konuda React avantajlı konumda.

Sonuç

Genel anlamda react önyüz geliştiricilerinin tüm ihtiyaçlarını karşılıyor. Yazımda bahsetmediğim react native kısmı da ayrı bir avantaj. Ben henüz react native ile bir geliştirme yapmadığım için bu konuya girmedim.

Hiç mi sorunu yok derseniz elbette bazı sorunları var.

  • CSS’in Javascript içinde yazılması. SASS ile çözüm var ancak birçok yerde ve örnekte javascript içinde CSS tercih ediliyor olması sorun bence.
  • State yönetmek için Redux yapısı güzel ancak çok fazla dosyada (constants, actions, saga, reducer, selector) işlem yapıyor olmak sorun.
  • Bileşenler ve alt bileşenlere prop’lar ile veri göndermek sorun. Bunun için Context API var çözüm olarak ancak onun içinde bazı çekinceler var diyorlar.

React hakkında zamanım oldukça ve daha çok kavradıkça birşeyler yazmayı düşünüyorum.

Kalın sağlıcakla.