Vue&Quasar Uygulama Geliştirme

Kadriye Aksakal
3 min readSep 3, 2021

Merhabalar, bu yazımda sizlere bir vue&quasar projesi nasıl geliştirilir, hangi adımlar izlenir, mobil ve masaüstü uygulamalar quasar ile geliştirilebilir mi ? Nasıl bir yol izlemeli. Tüm bu soruların cevabını yazımda sizlerle paylaşmak istedim. Umarım açıklayıcı ve yardımcı bir içerik olmuştur. Keyifli okumalar..

Öncelikle Vue nedir kısaca ona değinelim. Vue geliştirme yapılması kolay anlaşılır javascript ile geliştirilmiş bir web framework’tür. Progressive bir yapıya sahiptir. Yani web sitelerini kolaylıkla mobil uygulamalarla benzer hale getirilmesidir. Sıfırdan aşamalı olarak geliştirilmeye olanak sağlamaktadır.

Quasar nedir diye değinecek olursak. Quasar, Vue temellidir. Css ve sccc sayesinde kolayca özelleştirilebilir ve JS ile genişletilebilir. Yazdığımız tek kodu tüm platformlara dağıtarak kullanabiliriz. Websitesi, Masaüstü uygulaması ve Mobil uygulamalar quasar ile kolaylıkla geliştirilebilir.

Vue ve quasar’ı kısaca açıkladıktan sonra proje oluşturulması ile devam edelim. Quasar ile proje oluşturmak için öncelikle quasar cli’ı kurmamız gerekiyor. Ben projelerimde kurulum yaparken yarn ile yapıyorum isterseniz npm kullanarak da gerçekleştirebilirsiniz.

quasar/cli kurulumu

Quasar cli’ı sorunsuz bir şekilde kurduktan sonra;

quasar ile yeni proje oluşturma

komutu ile projemizi oluşturabiliriz. Daha sonra karşımıza sırasıyla aşağıdaki sorular gelecektir. Örnekte belirttiğim gibi sizlerde kendi projenize uygun olarak soruları cevaplayabilirsiniz.

quasar uygulamasını oluşturma adımları

Soruları doğru bir şekilde tamamladıktan sonra uygulamanız artık çalıştırmaya hazır hale gelecektir. Daha sonra quasar dev diyerek uygulamanızı lokalinizde ayağa kaldırabilirsiniz.

quasar uygulamasının ilk açıldığında varsayılan ara yüzü

Eğer web üzerinde bir geliştirme yapacaksanız bu adımlar sonrası projenizi geliştirmeye uygun hale getirmiş olacaksınız. Projenizde kullanmak istediğiniz plugin, boot, extras’lar için quasar.conf.js dosyanızı kendinize göre özelleştirebilirsiniz. Özelleştirme için https://quasar.dev/quasar-cli/quasar-conf-js kaynağından da yararlanabilirsiniz. Ayrıca quasar’ın kendine ait dökümanı da detaylı ve çok yararlı bir kaynak oraya da bir göz atmanızı tavsiye ederim.(https://quasar.dev/)

Gelelim quasar ile birlikte bir mobil uygulama geliştirmek istiyorsunuz nasıl bir yol izlemelisiniz. Quasar ile mobil uygulama geliştirdiğinizde yazdığınız kodu hem android hem de ios platformlarda kolaylıkla kullanabileceksiniz. Peki bu nasıl mümkün bu kısımda devreye quasar’ın capacitor modu giriyor. Projemize capacitor modunu ekliyoruz. Ve bu sayede mobil uygulama geliştirmeye başlamış bulunuyoruz. Capacitor ile uygulama nasıl oluşturulur, derlenir ve build alınır tamamiyle bir uygulama nasıl gerçekleştirilir ilgili yazımdan ulaşabilirsiniz.

Son olarak quasar ile Masaüstü uygulamaları da geliştirmek mümkün dedik ona da değinelim. Yapmanız gereken tek şey capacitor yerine quasar’ın electron modunu projemize ekliyoruz. Artık projemiz Masaüstü uygulaması geliştirmek için uygun hale geliyor. Masaüstü uygulamasının oluşturulması, derlenmesi konusundaki detaylı bilgilere ilgili yazımdan ulaşabilirsiniz.

Görüş, öneri ve sorularınız için mail atabilirsiniz..:)

--

--