Yapay zekadan makale özeti
- Kısa
- Ayrıntılı
- Bu video, GitLab'da sinir frontent engineer olarak çalışan ve Google Developer Expert on Web Technology olan Fatih Acet tarafından sunulan bir eğitim içeriğidir. Ayrıca Software Classmanship Turkey'de yaptığı sunumun tekrarını da içermektedir.
- Video, GitLab'ın ne olduğu, şirketin yapısı ve Fatih'in GitLab'da yaklaşık iki buçuk yıl içinde yaşadığı front-end sürecini anlatmaktadır. İçerikte Vue.js framework'ünün Mergic uygulamasında sağladığı avantajlar, legacy codebase'den Vue.js'e geçiş süreci ve GitLab'ın geliştirme süreci detaylı olarak ele alınmaktadır.
- Sunumda ayrıca GitLab'ın code review sistemi, düzenli toplantılar (her hafta salı günü front-end takım toplantısı, her ayın belirli günlerinde front-end ve UI-UX takımı toplantıları), sürüm yönetimi ve retrospektif değerlendirmeler hakkında bilgiler de sunulmaktadır. Mergic uygulamasında kullanılan view komponentleri, Vx store yapısı ve mimari yapısı hakkında da detaylı açıklamalar yapılmaktadır.
- 00:01Giriş ve Kanal Bilgileri
- Konuşmacı, GitLab ve GitLab Front-End hakkında yaklaşık iki buçuk yıllık deneyimini paylaşacağını belirtiyor.
- Kanal 7000 abone geçti ve Udemy'de hazırladığı video eğitimi Eylül ayında yayınlanacak.
- YouTube videoları, Udemy kursu ve podcast fikrinden haberdar olmak için bir e-posta bülteni başlatılmış.
- 02:03GitLab Hakkında
- GitLab, sadece kod yönetimi ve depolama aracı değil, kodla ilgili tüm süreçleri yönetebileceğiniz bir araç haline geldi.
- GitLab'in tanımı "plan, oluştur, doğrula, paketle, release et, konfigüre et ve monitör et" şeklinde değişti.
- Açık kaynak kodlu, iş takip sistemi, kod gözden geçirme araçları, sürekli entegrasyon desteği ve ücretsiz versiyonu olan bir proje.
- 03:16GitLab'in Özellikleri
- GitLab'de iş takibi, Trello benzeri boardlar ve merge testleri bulunuyor.
- Pipeline (continuous integration) kısmında her commit için testler çalıştırılıyor.
- GitLab 37 ülkeden 265 çalışanı bulunan remote only bir şirket.
- 05:05GitLab Team Handbook
- GitLab Team Handbook, şirketle ilgili tüm detayları içeren açık kaynak bir kaynak.
- Handbook'da şirketin değerleri, iletişim kuralları, araçlar, çalışanların hakları ve onboarding/ayrılış süreçleri yer alıyor.
- Front-end, backend ve CI takımlarının kim olduğu gibi mühendislik detayları da bu kaynakta bulunuyor.
- 05:55GitLab'in Front-End Süreci
- Mayıs 2016'da GitLab'de çalışmaya başladığında legacy bir codebase vardı, webpack, npm, React gibi araçlar kullanılmıyordu.
- Haziran 2016'da CoffeeScript'ten ES6'ya geçiş yapıldı ve bu işlem yaklaşık bir yıl sürdü.
- Kasım 2016'da Babel ve Webpack eklendi, Şubat 2017'de Yarn kullanıldı.
- 08:26Vue.js Kullanımı
- Ağustos 2016'da Vue.js eklendi ve kısa süre sonra Vue.js versiyon 20 duyuruldu.
- Vue.js, React veya Angular gibi araçlara göre daha küçük boyutlu, basit, kolay ve anlaşılabilir bir kütüphane.
- Vue.js'in Angular ve React'e göre öğrenmesi daha kolay olduğu belirtiliyor.
- 09:32Vue.js ile Kod Kalitesi ve Tekrar Kullanılabilirlik
- Vue.js ile daha az kod yazmaya başlandığı için bug sayısı azaldı ve bu bugların düzeltilmesi daha kolay hale geldi.
- Vue.js, veriyi değiştirdiğinizde view'ın kendi kendine render etmesiyle en doğru formu göstermesini sağlıyor.
- Tekrar kullanılabilir komponentler oluşmaya başladı, örneğin discorsionlar (sohbetler) komponenti bir URL verilerek istek yapıp tüm disk kaşını çiziyor.
- 10:23Vue.js'in Avantajları
- Vue.js'te kocaman tek başına iş yapan komponentler oluşturulabiliyor ve bunların altında birçok sub komponent bulunuyor.
- Gerçek zamanlı güncellemeler sayesinde sayfa açıkken gelen yeni sohbetlerin ekranda direkt gözükmesi kolaylaştı.
- Array'e yeni discussionlar push edildiğinde view bunları direkt sayfada göstermeye devam ediyor.
- 11:06Vue.js Kullanımı
- Vue.js'te her mavi kutu bir view komponenti olarak kullanılıyor.
- Boş bir div koyup id'sini belirleyerek view komponenti ekleniyor ve server'a istek yapılarak JSON alınıyor.
- Komponentler kendi datalarını biliyor, kendi yönetimini yapıyor ve kendi kendine tekrar istek yapıp kendini güncelliyor.
- 12:38Vue.js Mimarisi
- Sayfadaki tüm komponentler akıllı (smart) komponentler olarak adlandırılıyor.
- Özellikle üç komponent birbiriyle aynı dataları kullanması gerekiyor, örneğin merges id'si.
- Bu datalar için bir VueX modülü kullanılıyor ve içinde üç modül bulunuyor.
- 13:24Vue.js ile Veri Güncelleme
- Yapılan değişiklikler satır satır gösteriliyor ve her satır bir büyük komponenti oluşturuyor.
- Unresolved edilen bir discussion'ın sayısı otomatik olarak değişiyor ve array'deki discash'ı bulup resolve false yapılıyor.
- Tüm komponentler aynı VueX store'a baktığı için bir şey değiştiğinde kendilerini render'a döndürüyor ve doğru halini gösteriyor.
- 14:24Vue.js Proje Yapısı
- Proje yapısında "difs" adında bir klasör bulunuyor ve içinde "view" ve "komponentler" klasörleri var.
- VueX modülü içinde action'lar, gate'lar, mutation'lar için ayrı dosyalar bulunuyor.
- View single page componentleri kullanılıyor ancak stilleri view komponentin içine yazılmıyor, sadece bir yerde tutuluyor.
- 15:48Açık Kaynak ve Katkı
- Proje açık kaynak olduğu için herkes katkıda bulunabilir.
- Katkıda bulunmak için bir yerden girip, bir satır değiştirmek bile yeterli olabilir.
- Bug fix etmek zorunda değilsiniz, bir tekstil bile değiştirmek veya dökümanda bir değişiklik yapmak da katkıda bulunmak demektir.
- 16:55GitLab'te Code Review
- GitLab'te herkes code review yapabilir, dışarıdan gelen kişiler bile kodlara yorum yapabilir.
- Açık kaynak olduğu için kimse kodlara müdahale etmeye karşı çıkamaz, junior çalışanlar bile kodlara yorum yapabilir.
- Code review yaparken sadece belli kişiler karar mercii olabilir.
- 17:38Toplantılar ve Toplantı Düzeni
- Her gün yarım saatlik "team c" (şimdi "company cola" olarak değiştirildi) toplantısı yapılıyor.
- Her hafta salı günü front-end takım toplantısı yapılıyor, 18-20 kişi katılıyor ve dışarıdan da katılmak isteyenler katılabiliyor.
- Front-end ve UI-UX takımı her ayın belli bir günü toplantı yapıyor çünkü UI-UX front-end ile iç içe.
- 18:25Kişisel Toplantılar ve Sürüm Yönetimi
- Kişisel olarak her hafta bir toplantı yapılıyor, herkesin belli bir günü var ve durum, çalışma konuları ve sorunlar konuşuluyor.
- Her ayın 22'sinde yeni versiyon release ediliyor, bu ayın 22'sinde yaklaşık 4 gün sonra GitLab 11.1 versiyonu yayınlanacak.
- Her ayın 7'sinden 20'sine kadar geçen 15 gün boyunca sadece o release'in içine bug fixler ekleniyor, yeni sürüm için hiçbir şey dahil edilmiyor.
- 19:11Değerlendirme ve Yeni Başlangıç Toplantıları
- Her release'den sonra durum değerlendirme toplantısı yapılıyor, ne güzel oldu, neyi doğru yaptık, neyi yanlış yaptık ve neyi iyileştirebiliriz sorularına cevap veriliyor.
- Yeni yıl başlamadan önce ve retrospektif toplantısı hemen sonra yeni başlama toplantısı yapılıyor.
- Yeni geliştirecek özellikler için domain sahibiyle toplantı yapılıyor, nasıl yapılacağı kararlaştırılıyor.