Vue.JS şu anda Front End dünyasında yükselen bir yıldız. Bunun herkes için birçok farklı sebebi olabilir. Şu anda en bilindik 3 Javascript Framework’ü olarak şunları sıralayabiliriz: Vue.js, React.js ve de Angula.js. Bunlar haricinde elbette birçok Framework sayabiliriz; Ember.js, Meteor, Mithril, Polymer, Aurelia, Backbone.js… Bunların hepsi de birer ihtiyaç sonucunda ortaya çıktı ve bunun sonucunda da bunları kullananların olması çok normal. Öncelikle bir projeye başlarken “ihtiyaçlarımız nedir?” sorusuna yanıt vermeniz gerekiyor. Sonrasında da bu ihtiyaçlarınıza hangi Pluginler, Framework ya da Frameworkler karşılık veriyor bunu bulmalısınız. Çünkü, sadece popüler diye bir yapıya yönelirseniz, sonrasında çok pişman olabilirsiniz.

Angular 1'den Angular 2'ye geçerken köklü bir değişiklik olması sonrasında birçok kullanıcı Angular’dan uzaklaştı ve sonrasında farklı şeyler aramaya başladı. Bu Angular’ın popülerliğine önemli oranda zarar verdi ve düşüşünü hızlandırdı. Şu anda yeni bir projeye başlarken artık en fazla Vue.js ve React.js seçiliyor diyebilirim.

Peki Github ne diyor? Yaklaşık aynı zamanlarda ortaya çıkmalarına rağmen Vue.JS, React’tan daha fazla yıldıza (stars) sahip. Bu da gösteriyor ki Vue.Js’i kullanan ve beğenen Github kullanıcısı daha fazla. Bence bu güzel bir istatistik ve dikkat edilmesi gerekiyor. Facebook’un React’in arkasında durmasına karşılık, bağımsız ya da bireysel yazılım geliştiricilerin takdirini kazanmış bir Vue.Js var.

React’in ardında Facebook gibi bir dev var, peki ya Vue’nun? Evan You adlı bir geliştiricinin ortaya attığı bir proje ancak Vue topluluğu çok hızlı büyüyor. Mesela Çin’de çok fazla kullanılıyor. Çünkü bunun sebebi Evan You bir Çinli ve Asya’da Vue’nın hızla yayılmasını kolaylaştırdı. Vue topluluğu ve bir gün Evan ölürse ne olacak? 

Vue.js ile ilgili nasıl başladı ve nerede gibi bir belgesel çekilmişi. Aşağıdaki videoyu izledikten sonra Vue’yu daha da fazla seveceğinizden şüphem yok.

https://www.youtube.com/watch?v=OrxmtDw4pVI

Evan You Kimdir?

Google’ın keşfettiği ve kreatif işler yapan ekibine dahil ettiği bir yazılım geliştirici olan Evan You, Google’da Angular.js üzerine de geliştirmeler yapıyordu ve birçok projesinde AngularJs kullandı. Bu nedenle de Angular’ın neredeyse tüm dezavantajlarını biliyordu. Bunun sonucu olarak Angular’a kıyasla daha iyi, daha hızlı ve az boyuta sahip bir ürün çıkartmaya karar verdi. (Farkındaysanız React’e karşı değil, Angular’a karşı bu fikirde çünkü React ile neredeyse aynı zamanlarda piyasaya çıktılar. Bu sürede henüz React piyasada yok.) Aklında “Eğer Angular’ın sevdiğim kısmını çıkarabilir ve gerçekten hafif bir şey inşa edebilirsem…” fikri vardı ve 2014'ün Şubat ayında Vue.JS yayınlandı.

Vue.Js Nedir?

Vue.js (genellikle Vue olarak kullanılır) kullanıcı arayüzleri ve tek sayfa uygulamalar (single-page applications) inşa etmek için kullanılan açık kaynak Javascript iskeleti. (Wikipedia)

Node.js Kurulumu

Vue.Js kurulumu öncesinde bilgisayarınıza Node.js kurmanız gerekiyor. Daha sonradan sıkça karşılacağınız npm … ifadesi de Node.js’ten geliyor olacak.

Node.js’in son stabil sürümünü https://nodejs.org/ adresinden indirebilirsiniz. Solda yer alan LTS versiyonunu indirmeniz tavsiye edilmektedir çünkü Current (current / şu anki stabil değildir ve geliştirmelere devam edilmektedir.)

Kurulumun başarıyla tamamlandığından emin olmak isterseniz, command line’ı açarak (Başlat > Çalıştır > cmd)

npm -v

node -v

kodlarını yazabilirsiniz.

Vue.JS Nasıl Kurulur?

Sıra geldi Vue.JS kurulumuna. Alt kısımdaki kodu yazarak kuruluma başlayabilirsiniz.

npm install -g @vue/cli

Yükleme işlemini başlatalım.

Vue.Js Proje Oluşturmak

Vue.js’te proje oluşturmak için 2 farklı alternetifi kullanabilirsiniz. Ben neredeyse her zaman ilk alternatifi kullanıyorum.

1-) Projenizi oluşturmak istediğiniz klasöre giderek adres satırına cmd yazıp entera basabilirsiniz.

2-) Direkt cmd ya da Terminal İle Vue.Js Proje Oluşturmak

Bilgisayarınızdan Başlat > Çalıştır > cmd yazıp komut satırını başlatabilirsiniz. Ayrıca, Visual Studio Code veya benzeri bir Text Editor kullanıyorsanız da Terminal kısmından da komut ekranını açabilirsiniz. Bundan sonrası iki alternatif için de aynı olarak devam edecek. Sadece 2. alternatifi kullanıyorsanız, cd klasör veya cd.. ile hareket ederek projeyi oluşturmak istediğiniz klasöre ulaşıp projenizi oluşturmaya başlayabilirsiniz. Bu ekrandaki komutları kullanmayı bilmiyorsanız, ilk alternatif sizin için daha kolay olacaktır.

vue create projeadi

yazdığınızda karşınıza şöyle bir ekran gelecek. (Proje adınızda büyük harf kullanırsanız uyarı alırsınız. Projenin tüm harfleri küçük olmalıdır.)

Yeni bir proje adı oluşturup adını ve proje adını yazıyoruz.

Sonra zaten bize yapmamız gerekenleri bir nevi anlatıyor.

Ve yapacağımız il iş kurduğumuz projenin içine girip  npm install demek

Artık projemizin dosya yapısı kurulmuştur. ve şimdi npm run dev diyip projemizi çalıştıralım.

Artık localhost 8080 portuna gidip praojemizi açalım.

İşte bu kadar. Muhtemelen yaklaşık 30 dakikada bir Vue.Js projesini oluşturabileceğinizi görmüş oldunuz :) Vue.js ile birlikte hızlı ve kolay bir şekilde front end geliştiricisi olabilirsiniz. Sonraki yazılarda da bunu daha iyi anlayacaksınız.

Bu yazıda basit bir şekilde Vue.JS nasıl kurulur ve proje nasıl oluşturulur konularına değinmiş olduk. Bir sonraki derslerde bu sayfanın nasıl ve nelerden oluştuğuna değineceğiz. Görüşmek üzere.