ÇALIŞMA NOTLARIM
Frontend ve Yazılım Mimarisi Çalışma Notlarım
Web sayfamı her geçen gün biraz daha etkileşimli hale getirip yazılım alanında ve frontend ekosisteminde çalışanların kullanabileceği bir uygulama alanına dönüştürme uğraşılarım devam ediyor. Bu yazıda bu çalışmalardan bahsedeceğim.
Not: Bu yazıyı web sayfamda(onurdayibasi.com) yaptığım değişikliler doğrultusunda güncelliyorum. (Son güncelleme tarihi: 2 Nisan 2023)
10 Eylül 2021 Güncelleme: Sitenin renk tonları, fontları güncellendi. Site içerisinde tüm etiketler arasında arama yeteneği ve okunan medium yazılarını işaretlenerek kullanıcıya hangi yazıların okuduğunu hatırlatma özelliği eklendi. Bir diğer özellik ise yazı gruplarındaki tüm yazıyı bitirince bir avatar çıkıp, bu avatarı sosyal medyada paylaşabiliyorsunuz.
2 Şubat 2022 Güncelleme: İstatistik kısmını tarihe göre, görüntülenmeye göre, alkışa göre bir sıralama yapabiliyordu ama bu sıralamaları bir bütün olarak basınca çok da anlaşılmıyordu. Bu kısımların daha iyi anlaşılması yönünde iyileştirmeler yaptım.
Medium platformunda bir süredir teknik yazılar yazıyorum. Fakat bu yazıları farklı zaman aralıklarında parça parça olarak yazdığımdan birbirleri ile ilişkisi tam olarak anlaşılmıyor. Bunun nedeni iş ile veya okuduklarım ile ilgili sürekli belli bir konuda odaklı çalışamıyor olmam.
Özetle bir konuya A zamanında başlarsam B zamanına kadar araya bir sürü konu giriyor ve B zamanındaki yazdığım bir yazı ile A zamanındaki yazıyı kronolojik olarak bağdaştırmak pek doğru bir yaklaşım olmuyor.
Peki bu yazılar hangi sırada ve hangi gruplar halinde okunmalılar ? Medium platformundaki sayfamı incelediğinizde bu bağlantıları göremediğinizi sizde farkedeceksiniz. Bu nedenle kendi Web Sayfam ve Medium yazıları arasında bağlantılar kurarak https://onurdayibasi.com/ sitesini oluşturdum.
2 Nisan 2023 Güncelleme: Uzun zamandan sonra aklımda olan bir geliştirmeyi daha siteye ekledim. Çalışma not gruplarından LearnReactUI.dev içerisindeki E-Kitaplara(EBooks) erişim linkleri eklendi. Aşağıda detaylara ulaşabilirsiniz.
Belli başlı özelliklerini sıralarsak;
Yazıları Belli Başlıklar Altında Gruplandırma
Öncelikle yazıları belli not gruplarına böldüm. Bu bölümleme benim kafamda belirlediğim yapıya ve sıraya göre gerçekleşiyor. Ana sayfada daha üst seviye bir bölümleme varken her bir grubun içerisinde o konu ile ilgili birçok yazı bulunuyor.
Okuduğunuz Yazıların İşaretlenmesi
Çalışma notları arasında okuduğunuz bir yazının okunduğunun anlaşılması için Medium’daki yazı içeriklerinin sonuna bu yazının okunduğuna ait bir düğme ekledim. Bu linklere bastığınızda okunan yazıların yanında ✔️ işaretini görebilirsiniz
- Linke tıklayarak ilgili yazıya gidin.
- Yazıyı okuyup en altına geldiğinizde yazının altında bulunan aşağıdaki resimdeki gibi bir kısım bulacaksınız. Buradaki linke tıklayın.
3. Bu link sizi doğruca ilgili yazı grubuna yönlendirecek, bu sayede kaldığınız noktadan okumalarınıza devam edebilirsiniz.
Yazılardaki Kavramların Etiketlenmesi
Daha yazıları okumadan bir konuyu veya kavramı merak ediyor olabilirsiniz. Bir yazı grubunun içerisinde gittiğinizde yazıların içerisinde geçen kavramların ne olduğunu sağ kısımdaki etiketlerde görebilirsiniz.
Bu etiketlere tıklayıp kavramların geçtiği yazıları direk açabilirsiniz.
Aynı zamanda sağ üst köşede bulunan arama arama düğmesine tıklayarak tüm yazı ve yazı grupları arasında arama yapıp, etiketlerin üzerinden ilgili yazıya gidebilirsiniz.
Blog Okunma İstatistikleri
Tüm yazıların veya yazı grupları içerisindeki yazıların ne kadar okunduğu ile ilgili istatistiklere aşağıdaki resimde bulunan Detay düğmesine tıkladığınızda yönlendirileceğiniz ekrandan ulaşabilirsiniz.
Açılan istatistik ekranında Tarihe Göre/ Görüntülemeye Göre/ Beğeniye Göre Sırala düğmesi ile en çok hangi yazıların dikkat çektiğini anlayabilirsiniz.
Paylaşım
Yazı grubu içerisindeki tüm yazıları okuduğunuzda yazıların yanında ✔️ var ise, sağ kısımda bunun ile ilgili bir paylaşım alanı ve avatar alanı açılır 😃 Burada bulunan Twitter/Linkedin düğmeleri ile paylaşım yapabilirsiniz.
Digital Garden
Oluşturduğumuz yazılar ile ilgili denemeleri , demoları kullanabileceğiniz yeni bir site oluşturdum. onurdayibasi.dev. Bu sayfa içerisinde yazılarda bulunan örneklerin çalışan versiyonlarına bu sayfa üzerinden erişebilirsiniz.
Örnek vermek gerekirse ;
Hesap Makinesi oluşturma örneğini aşağıdaki blog yazılarında anlattım.
Aynı hesap makinesini canlı olarak deneyebileceğiniz bir ortam bu digital garden dediğim kısım. Bu hesap makinesini https://onurdayibasi.dev/simple-calculator adresinden aşağıdaki resimdeki gibi deneyip kurcalayabilirsiniz.
Learn React UI
onurdayibasi.com sitesinde hazırladığım yazıların çok hızlı bir şekilde, boş bulduğum aaralarda yazdığım için ara ara aşağıdaki yönde şikayetler geliyordu;
- Yazılar içerisinde anlam karmaşası ve imla hataları çok çıkıyor.
- Yazı grupları var ama bir yazı grubunu okumak için Medium ve benim sitem arasında sürekli linklere basarak gidip gelme durumu oluşuyor.
- Bazı yazılar yazı gruplarının dışında kalabiliyor.
- Yazı gruplarının İngilizce versiyonları yok.
Ve benzer sorunlar ara ara kulağıma geliyordu. Bende her seferinde blog yazılarını çok hızlı yazdığımı ve bunları düzenlemek ve kaliteleştirmek için parça parça zaman harcamak yerine E-Kitaplar üzerinden bu düzeltmeleri ve diğer istekleri çözeyim istedim.
Daha detaylı bilgi için (Neden LearnReactUI.dev Geliştirdik ?) blog yazısını okuyun.
Artık yazı gruplarının yan kısımlarında E-Kitap kısımları bulunacak. Siz okurlar ister Medium blogları üzerinden ister E-Kitap üzerinden yazıları okuyabileceksiniz. Yanlız tek problem E-Kitaplar bloglar kadar hızlı çıkmıyor olması.
Aşağıdaki şekilde E-Kitapları linklerini sağ kısımda görebilirsiniz. LearnReactUI.dev yeni kitaplar eklendikçe bu kısımlarda güncelleme yapacağım.
Örnek bir kaç sayfaya bakalım.
- https://onurdayibasi.com/react/
- https://onurdayibasi.com/frontend-ideas/
- https://onurdayibasi.com/javascript-ile-fonksiyonel-programlama/
Bu sayfalardan yönlendirdiğiniz https://learnreactui.dev/ sitesini bu ve benzeri bir çok E-Kitabı bulabilirsiniz.
Özetle paylaşımlarımı;
- Blog ve Not olarak onurdayibasi.com adresinden
- Etkileşimli Demo olarak https://onurdayibasi.dev/ adresi üzerinden yapıyorum.
- E-Kitapları https://learnreactui.dev/ adresi üzerinden erişebilirsiniz.
