Tayfun'un dediğine katılmakla beraber, soruyu yanlış yazma ihtimalini göz önünde bulunduruyorum. İstediğin şey DB'de bulunan son üyeyi almak ise kolay bir SQL cümlesi ile yapabilirsin.
SELECT id FROM uyeler ORDER BY id DESC LIMIT 1
İlk olarak danışmanlarınızı işten çıkartın. Kendileri tecrübeli olmadan akıl vermeye kalkışmışlar. Şimdi ilk olarak ben kendi deneyimimi anlatayım sana.
Vue ile Milyon Dolarlık bir proje yapıyorum. Şaka değil bu arada. Şu an için senin tabirinle yaklaşık 500 tane ekranımız var diyebilirim. Şu ana kadar Vue kısmında herhangi bir sorun yaşamadık. Eğer sen zaten tecrübeliysen yapıyı ve sürdürebilirliği ayarlayabilirsin rahatlıkla. Vue buna oldukça müsait bir framework.
Bizim sistemimizde adam kendi yazılımını kendi kodluyor. Nasıl yani? Mesela JavaScript biliyorsan kendi geliştirdiğim bir JavaScript benzeri dil ile sen kod yazıp uygulamanın süreçlerini değiştirebiliyorsun. He yok kod yazmak istemiyorum diyorsan yazma kardeşim :) FlowChart ile akışları değiştirebiliyorsun sürükle bırak yaparak ve node'lari birbirlerine bağlayarak.
Yapı yapı sana bir kaç özellik anlatayım.
Store
Store yapısında modüler yapımız var ve bunlari kendi yazdigim pluginler sayesinde bazılarında persistancy sağladım. Bazıları ise sadece alış veriş görevi görüyor.
View
Proje içerisinde en fazla View yapılarının inheritance olayına kafayı taktım ve Component yapısının güzelliği sayesinde oldukça kolay bir şekilde bu konuyu kolaylıkla geçtim.
Route
Genel olarak dinamik yetki sistemiyle Route değşimi ihtiyacımız var. Bunu da oldukça kolay bir şekilde yapabilirsin Vue ile.
Performans
Performans olarak herhangi bir sorun yaşamadım. Ne bir donma ne crash ne de Cache ile ilgili bir takılma. Sorunsuz bir şekilde şu ana kadar geldik.
Proje SASS ile calisiyor doğal olarak gelen isteklere Sunucu iyi bir şekilde cevap verdiği sürece Client tarafında hiç bir sorun yaşamazsın performans adına.
Genel olarak açıklamalarım bunlar :) Eğer merak ettiğin başka bilgiler varsa, yardımcı olabilirim. Fakat danışmanları iyi seçmek lazim :)
Selamlar Dostum,
Proje klasörünün hemen altında .babelrc dosyası oluşturduktan sonra aşağıdaki kodları içerisine yazman gerekiyor:
{
"presets": [
["env", { "modules": false }],
"stage-3"
]
}
Böylece hata giderilmiş olacaktır :)
Sayfa kaynağından daha ziyade Öğeyi inceledeki görüntüyü okuyor Google Ajanları :) O yüzden SSR yapmana ihtiyacın yok. Bu durumda sayfa başlığını ne yapacağım nasıl değiştireceğim gibi sorularla baş başa kalabilirsin. Bunun için sana bir de plugin önereyim.
https://vuejsexamples.com/manage-html-metadata-in-vue-js-components-with-ssr-support/
Bu link üzerinden ilerleyebilirsin :)
Kolay gelsin.
Selam dostum,
Teşekkür ederim düşüncelerin için. Laravel pek bilmiyorum. Fakat seni şu şekilde yönlendirebilirim. Laravel Vue'nun Sponsorlarından birisi. Bundan dolayı Laravel ile Vue Entegrasyonlarını sık sık görebiliyoruz. Neden PHP ya da Neden Codeigniter, Symphony vb teknolojiler ile yok da Laravel ile entegrasyonu var diye soruyorsan cevabı budur.
Laravel ile SSR mümkünatı tabiki de bulunuyor. Fakat ben nasıl olduğunu bilmiyorum. Dediğim gibi Laravel bilmiyorum. Senin için küçük bir araştırma yaptım. Linkleri aşağıda bulabilirsin.
https://medium.com/js-dojo/advanced-server-side-rendering-with-laravel-vue-multi-page-app-486b706e654
https://vuejsdevelopers.com/2017/11/06/vue-js-laravel-server-side-rendering/
https://github.com/spatie/laravel-server-side-rendering
Bunların dışında ck778'in de dediği gibi JavaScript Sunucusu üzerinden kendin de SSR yapabilirsin sadece Vue.js kullanarak. Fakat Vue bile kendi sitesinde direk Nuxt.js'i öneriyor. Bu konuda oldukça hızlı proje çıkartmanı sağlayan Nuxt'ı öneriririm.
Hepsi bir kenara Vue ile yapmış olduğun bir Single Page Application (SPA) zaten google ajanları tarafından sen nasıl görüyorsan o şekilde okuyor. Bundan dolayı aslında senin SSR yapmana gerek yok :)
Yine de senin bileceğin iş :)
İlk olarak Vue ile Angular arasında tercih yaparken kıyaslama kriterlerine ve senin ihtiyaçlarına göre bu kıyaslamayı yapman gerekir.
Vue, Angular ve React'dan oldukça performanslı bir Framework. Lakin senin sorun React Native ya da Flutter şeklinde.
Eğer React.js biliyorsan React Native daha hızlı uygulama çıkartmana yardımcı olacaktır. Fakat Flutter ise Google'in desteğiyle çok daha iyi yerlere geleceğini söyleyebilirim. BenchMark sonuçlarına göre Native performansını daha iyi yaşatan Flutter.
Merhaba, ilk olarak söylediğin sorunun tam olarak bir cevabı bulunmuyor. Senin projenin gereksinimlerine göre senin zaten mimari yapını belirlemen gerekiyor. Örnek vermek gerekirse. Veri Tabanı Modellemelerini bir yerde, HTML kodlarını bir yerde, Business Logic kodlamalarını belirli bir yerde kullanacaksan şayet. Bu durumda en yaygın Pattern MVC olarak göze çarpıyor. Yok sen Mesajlaşma uygulaması gibi bir uygulama yazacaksan Observer çok daha önem arzediyor. Bunun gibi ilk olarak yapının hangi mimariye daha uygun olduğunu belirleyip üzerinde çalışma yapman daha doğru olur. Mesela bir de şu da bir örnek teşkil etsin sana. Ben MVC kullanmak istiyorum ama bu modülleri birbirlerinden ayırmak o kadar kolay olsun ki dersen ve bir modülü ekleyip çıkarttığında kafam rahat olsun dersen HMVC (Hiyerarşik MVC) gibi bir mimari kullanmak gerekir. Yani sorunun özetle cevabı bu tamamen projeye bağlı :)
Merhaba,
ilk olarak burada Componentlerin ve JavaScript'in çalışma prensibini bilmek gerekiyor. İlk başta aslında cevabı vermişsin :) Sen DB üzerinden bir bilgiyi çekerken ister Axios kullan ister Vue-Resource farketmez orada bir asenkron iletişim yapıyorsun.Yani cevabın ne zaman geleceğini bilmiyorsun. Child Componentin ise bu cevabi beklemeden doğal olarak create oluyor.
Bu noktada bu Parent componentten gelen bilgileri sen eğer created metodunda alıp işliyorsan, sen bilgileri DB üzerinden önce child component üretildiği için veriler bazen gözüküyor bazen gözükmüyor.
Şöyle gösterme çalışayım bazı durumlarda;
DB üzerinden verilerin gelme süresi : 1ms
Child componentin create olma süresi : 0.001ms
iken bazı durumlarda;
DB üzerinden verilerin gelme süresi : 0.0001ms
Child componentin create olma süresi : 0.01ms
Üstteki senaryoda, DB üzerinden bilgiler 1ms de gelirken Component 0.001ms de üretilmiş. Yani DB den çok çok önce. Component create olurken props ile gönderdiğin Array boş olduğu için veri göstermiyor.
Alttaki senaryoda ise, DB üzerinden gelen bilgiler Component'in create olmadan çok önce hazır olduğundan dolayı, props ile göndermiş olduğun Array dolu dolayısıla Componentin bu bilgileri gösterebiliyor.
Bunu atlatmak için parent component içinde şunu yapabilirsin;
<template>
<div>
<comp v-if="loaded" :products="componenteGidecekOlanArray" />
</div>
</template>
<script>
export default {
data(){
return {
componenteGidecekOlanArray : [],
loaded : false
}
},
created(){
axios.post("url", {}).then(response => {
this.componenteGidecekOlanArray = response.data.products; // Diyelim...
this.loaded = true;
})
}
}
</script>
Buradaki en önemli nokta loaded isimli property. loaded ilk başta false olduğu için componentin gözükmeyecek. DOM üzerinde yer bile almayacaktır. Bu yüzden child üzerinde created metodu çalışmayacak ve bilgi göstermeye çalışmayacaktır child component.
Fakat sen parent içinde veriyi çektikten sonra this.loaded=true
ile beraber bu componentin üretilmesini söyleyerek ekranda gözükmesini sağlayacaksın.
Ekranda gözükürkende verilerin olduğu array çoktan hazır olduğu için doğal olarak verilerin gözükecektir
Umarım yardımcı olur :)