Vuex Store - Mutations'da Sabitler ve Senkronize

Vuex Store - Mutations'da Sabitler ve Senkronize

  Nisan 25, 2021    Gökhan Krl

---

Mutasyonlar İçin Sabitleri Kullanmak Çeşitli Flux uygulamalarında mutasyon türleri için sabitlerin kullanılması yaygın olarak görülen bir durumdur. Bu, kodun linter gibi araçlardan yararlanmasını sağlar ve tüm sabitleri tek bir dosyaya koymak, beraber çalıştığınız geliştiricilerin tüm uygulamada hangi mutasyonların mümkün olduğunu bir bakışta görmelerini sağlar: // mutasyon-listesi.js export...

Yazıyı Oku...

Vuex Store - Mutations ve Vue.js Reaktivitesi

Vuex Store - Mutations ve Vue.js Reaktivitesi

  Nisan 19, 2021    Gökhan Krl

---

Mutasyonların Vue'nun Reaktivite Kurallarına Uyması Bir Vuex mağazasının state'i Vue tarafından reaktif hale getirildiğinden, state üzerinde değişiklik yaptığınızda durumu gözlemleyen Vue bileşenleri otomatik olarak güncellenecektir. Bu aynı zamanda Vuex mutasyonlarının düz Vue ile çalışırken aynı reaktivite uyarılarına tabi olduğu anlamına gelir. Yani CLI üzerinden değil de, web...

Yazıyı Oku...

Vuex Store - Mutations Kavramı ve Anlatımı

Vuex Store - Mutations Kavramı ve Anlatımı

  Nisan 19, 2021    Gökhan Krl

---

Bir Vuex mağazasında State üzerindeki veriyi değiştirmenin tek yolu bir mutasyon gerçekleştirmektir. Mutasyon içerisinde bir fonksiyon oluşturduğumuzda State'i ilk argüman olarak alır: const store = new Vuex.Store({ state: { miktar: 1 }, mutations: { artir (state) { // State üzerindeki "miktar"ı güncelle state.miktar++ } } }) Bir mutasyonu doğrudan...

Yazıyı Oku...

Vuex Store - Getters Kavramı ve Anlatımı

Vuex Store - Getters Kavramı ve Anlatımı

  Nisan 14, 2021    Gökhan Krl

---

Bazen, örneğin bir öğe listesini filtrelemek ve onları saymak gibi, duruma göre çıktısını istediğiniz bir veriyi ayrıca hesaplamamız gerekebilir. computed: { gorevListesi() { return this.$store.state.gorevler.filter( (gorev) => gorev.bitisDurumu === true ).length; }, } Birden fazla alanla bunu kullanmak istiyorsak, ya bu işlevi çoğaltmamız lazım ya da ayrı bir dosyaya...

Yazıyı Oku...

Vuex Store - State Kavramı ve Anlatımı

Vuex Store - State Kavramı ve Anlatımı

  Nisan 10, 2021    Gökhan Krl

---

Daha önce Vuex Store'a bir giriş yapmış ve bir Vuex Store örneğini incelemiştik. Oradaki dört bölümden kısaca bahsetmiştik. Bunlar State, Getters, Mutations ve Actions'tı. State Management Pattern Vuex bir State Management Pattern yani bunu çevirmeyeceğim ama şöyle söyleyeyim Veri yönetimi kütüphanesidir. Bir devlet düşünün çatısı altında her şey yönetilir, işte State burada devlet...

Yazıyı Oku...

Vuex Store - Giriş ve Konu Anlatımı

Vuex Store - Giriş ve Konu Anlatımı

  Nisan 07, 2021    Gökhan Krl

---

Vue.js ile beraber Vuex'e girmeye karar verdiyseniz yada ne olduğunu merak ediyorsanız, buradan itibaren temiz bir giriş yapacağız. Temelden derinlere doğru inerek Vuex içerisindeki tüm konulara ve alanlara değinmek istiyorum. Hazırsanız başlayalım. Vuex...

Yazıyı Oku...

Vue.js Lifecycle Hooks Anlatımı

Vue.js Lifecycle Hooks Anlatımı

  Haziran 20, 2019    Gökhan Krl

---

Vue.js Lifecycle Hooks Türkçesi biraz değişik gelebilir ama aslında çok net ve anlaşılabilir bir çevirisi var. "Lifecycle Hooks" yani "Yaşamdöngüsü Kancaları" nedir bunu işleyeceğiz. Bir örnek ile anlamaya çalışalım, elinizde bir çark var. A, B, C, D noktaları var...

Yazıyı Oku...

Vue.js Bileşenler

Vue.js Bileşenler

  Haziran 19, 2019    Gökhan Krl

---

Vue.js Bileşenler Bu yazımda Vue Bileşenleri 'ni anlatacağım. Bileşenler sayfa içerisinde kullandığımız hazır şablonlardır. Bileşenler tıpkı bir Vue uygulaması gibi çalışır ancak amaçları farklıdır. Klasik bir bileşen yapısı aşağıdaki gibidir. Aslında düşündüğümüz...

Yazıyı Oku...

Vue.js Koşullar ve Döngüler

Vue.js Koşullar ve Döngüler

  Haziran 19, 2019    Gökhan Krl

---

Vue.js Koşullar ve Döngüler Vue içerisindeki Koşulları ve Döngüleri anlatmaya çalışacağım. Daha önce direktiflerden bahsetmiştim. Şimdi bu iki özellik de birer direktif olarak çalışmakta. Ancak bunlar Vue içerisinde tanımlanmış direktiflerdir. Koşullar İf direktifini...

Yazıyı Oku...

Vue.js Direktifler

Vue.js Direktifler

  Haziran 19, 2019    Gökhan Krl

---

Vue.js Direktifler Vue.js ile bir elemente özellik atamak veya kontrol sağlamak için direktifler kullanılır. Mesela önceki dersimizde method 'lardan bahsetmiştim. onclick ve onfocus gibi özellikleri direktif olarak kullanıyoruz. v-html Örneğin bir Vue uygulamasında...

Yazıyı Oku...

Vue.js data ve methods

Vue.js data ve methods

  Haziran 17, 2019    Gökhan Krl

---

Vue.js data ve method 'lar Klasik bir Vue uygulamasının nasıl oluşturulduğunu öğrenmiştik. Şimdi tekrar Vue örneğini bir hatırlayalım. var vm = new Vue({  // özellikler  }) Daha sonra verilerimizin tamamını içerisinde barındıracağımız data nesnesini...

Yazıyı Oku...

Vue.js Söz Dizimi

Vue.js Söz Dizimi

  Haziran 15, 2019    Gökhan Krl

---

Vue.js Sözdizimi Vue.js 'in sözdizimi(Syntax) ile devam edelim. Bir Vue uygulaması oluşturmak için "Vue()" sınıfını çağırmamız gerekir. new Vue() Sınıfı çağırdıktan sonra içerisine gerekli verileri tanımlamak için nesne parantezlerini açıyoruz. Daha sonra Vue...

Yazıyı Oku...

Vue.js Kurulumu/Kullanımı

Vue.js Kurulumu/Kullanımı

  Haziran 15, 2019    Gökhan Krl

---

Vue.js Kurulumu/Kullanımı Biz Vue.js 'i tarayıcı üzerinde dist olarak kullanacağız. Yani tarayıcıda direkt kütüphane ile çağıracağız. NPM üzerinden kullanmak isteyen varsa aşağıdaki linkten CLI 'yi yükleyebilir. https://vuejs.org/v2/guide/installation.html#CLI CDN...

Yazıyı Oku...

Vue.js 'e Giriş

Vue.js 'e Giriş

  Haziran 14, 2019    Gökhan Krl

---

Merhaba arkadaşlar, Vue.js Dersleri başlığı altında Vue ile ilgili tüm bilgileri sizlere elimden geldiğince aktarmaya çalışacağım. Burada bir giriş yazısı ile başlayıp küçük bir örnek ile de bitirmek istiyorum. Nedir ? Çok fazla detaya girmek istemiyorum çünkü React...

Yazıyı Oku...