AngularJS sadece tek sayfalık uygulamalar (SPA'lar) için mi?

Oluşturduğumuz bir uygulamanın ön ucunu oluşturma seçeneklerine bakıyoruz ve bizim için işe yarayacak ve bize ilerlemek için en iyi platformu sağlayacak bir aracı değerlendirmeye çalışıyoruz.

Bu bir Node.js projesidir. İlk planımız Express'i kullanmak ve o rotaya inmekti, ancak bu aşamayı başlatmadan önce orada olanları gözden geçirmenin en iyisi olabileceğine karar verdik. Uygulamamızın tek sayfalık modele uymadığına inandığımız birkaç alan vardır, çünkü bunlar bir uygulama perspektifinden ilişkilidir, ancak bir bakış açısından değil.

Backbone.js , Meteor , vs. ve ayrıca AngularJS gibi istemciyi oluşturmak için kullanabileceğimiz birkaç çerçeveyi gördük .

Bu oldukça açık bir soru olabilir, ancak AngularJS'nin yalnızca tek sayfalı uygulama için olup olmadığını veya örneğin Express gibi çok sayfalı uygulamalar için kullanılabileceğini çözemiyoruz.

GÜNCELLEŞTİRME 17 Temmuz 2013 İnsanları döngüde tutmak için, bu soruyu süreç boyunca ilerlerken güncelleyeceğim. Şimdilik her şeyi birlikte inşa edeceğiz ve bunun ne kadar iyi performans gösterdiğini göreceğiz. AngularJS ile bizden daha kalifiye olan birkaç kişiye ulaştık ve bağlamı paylaşan, ancak tek bir sayfada çalışmak çok büyük olabilecek daha büyük uygulamaları bölme konusunda soru sorduk.

Anlaşma, birden fazla statik sayfa sunabilmemiz ve yalnızca bu sayfalarla çalışan AngularJS uygulamaları oluşturabilmemiz, etkin bir SPA koleksiyonu oluşturabilmemiz ve bu uygulamaları standart bağlantı kullanarak birbirine bağlayabilmemizdi. Çözümümüzün birkaç uygulaması olduğu için kullanım durumumuz çok özeldir ve dediğim gibi, önce tek kod tabanını deneyip oradan optimize edeceğiz.

GÜNCELLEME 18 Haziran 2016 Proje bir uçurumdan düştü, bu yüzden çok fazla iş yapmak için hiçbir zaman yolumuz yoktu. Son zamanlarda tekrar aldık, ancak artık açısal kullanmıyoruz ve bunun yerine React kullanıyoruz. Hâlihazırda hızlı ve kendi kendine yeten uygulamaları kullandığımız önceki güncellemede özetlenen mimariyi kullanıyoruz, bu nedenle örneğin /chatReact sohbet uygulamamızı /projectssunan bir rotamız var, projeler uygulamasına hizmet eden başka bir rotamız var ve yakında. Biraz baktığımız gibi, her uygulama kendi özellik kümesi açısından toplam bir köktür, kendi başına bir uygulama olarak kabul edilebilmesi için bağımsız olması gerekir. Teknik olarak, tüm bilgiler orada, sadece temel ekspres ve kullanmak istediğiniz istemci tarafı app bina iyilik ne olursa olsun lezzet.

Bir şey değil. Angular'ı çeşitli uygulamalar oluşturmak için kullanabilirsiniz. İstemci tarafı yönlendirme bunun sadece küçük bir parçasıdır.

İstemci tarafı yönlendirme dışında size fayda sağlayacak çok sayıda özellik var:

• iki yönlü ciltleme
• çiftleşmiş
• para birimi biçimlendirme
• çoğullaştırma
• yeniden kullanılabilir kontroller
• RESTful API kullanımı
• AJAX kullanımı
• modularization
• bağımlılık enjeksiyonu

Tüm bunların "tek bir sayfa uygulamasında kullanılabileceğini" düşünmek çılgınca. Tabii ki değil .. Bu "Jquery sadece animasyonlu projeler için" demek gibidir.

Projenize uyuyorsa kullanın.

İlk başta Angular ile de "nasıl" ile mücadele ettim. Sonra bir gün üzerime geldi: "STILL javascript". Angular'ın ins-and-out'larında bir sürü örnek var (favorilerimden biri https://github.com/angular-app/angular-app kitabı ile birlikte ). Hatırlanması gereken en büyük şey, js dosyalarına başka bir projede olduğu gibi yüklemek. Tek yapmanız gereken, farklı sayfaların doğru Açısal nesneye (denetleyici, görünüm vb.) Başvurduğundan ve kapalı ve çalışır durumda olduğundan emin olmaktır. Umarım bu mantıklıdır, ancak cevap o kadar basitti ki gözden kaçırdım.

Belki tecrübelerim birisi için faydalı olacaktır. Projemizi mantıksal olarak ayırdık. Feed için kullandığımız bir SPA, harita ile çalışmak için bir SPA, bir kullanıcı profilini düzenlemek için başka bir SPA vb. Örneğin üç uygulamamız var: feed, kullanıcı ve harita. Ayrılmış URL'lerde şu şekilde kullanıyorum:

https://host/feed/#/top/
https://host/user/#/edit/1/
https://host/map/favorites/#/add/

Bu uygulamaların her biri, uygulamadaki durumlar arasında kendi yerel yönlendirme eşlemelerine sahiptir. Her uygulamanın sadece kendi bağlamı ve gerçekten ihtiyaç duyduğu yük bağımlılıkları ile çalıştığı için iyi bir uygulama olduğunu düşünüyorum. Ayrıca, hata ayıklama ve entegrasyon işlemleri için çok iyi bir uygulamadır.

Gerçekten de, SPA uygulamalarının bir karışımını kolayca yapabilirsiniz, örneğin feed, açısaljs uygulaması, tepki içeren kullanıcı uygulaması ve backbone.js uygulamasıyla URL olacaktır.

Sorunuza yanıt olarak:

Sadece SPA'lar için açısal değil, açısal SPA uygulamaları için iyi ve hızlı oynar, ancak hiç kimse çeşitli SPA uygulamalarının MPA uygulamasını oluşturmak için rahatsız etmez. Ancak url mimarinizi düşünmek, uygulamalarınızın SEO kullanılabilirliğini unutma.

Ben de bu fikri destekliyorum:

Proje ve uygulama arasındaki fark nedir? Uygulama, bir şey yapan bir Web uygulamasıdır - örneğin, bir Weblog sistemi, genel kayıtların bir veritabanı veya basit bir anket uygulaması. Proje, belirli bir web sitesi için bir yapılandırma ve uygulama koleksiyonudur. Bir proje birden fazla uygulama içerebilir. Bir uygulama birden fazla projede olabilir.

İhtiyacınız olan tek şey istemci veritabanına sahip birkaç sayfa ise, Nakavt ve Javascript Ad Alanı ile giderdim.

Nakavt, özellikle karmaşık olmayan geriye dönük uyumluluğa ihtiyacınız varsa ve oldukça düz sayfalara sahipseniz harika. 3. taraf bileşenler kullanıyorsanız, Knockout'un özel bağlantıları basit ve kullanımı kolaydır.

Javascript ad alanı kodunuzu ayrı ve yönetilebilir tutmanızı sağlar.

var myCo = myCo || {};
myCo.page = {
    init: function(){ ... },
    ...
}

Ve diğer komut dosyalarınız yüklendikten sonra komut dosyası etiketinde

<script>
    myCo.init();
</script>

Anahtar, ihtiyaç duyduğunuzda istediğiniz herhangi bir aracı kullanmanızdır. Veritabanına mı ihtiyacınız var? Nakavt (ya da ne istersen). Yönlendirmeye mi ihtiyacınız var? sammy.js (ya da ne istersen).

İstemci kodu istediğiniz kadar basit veya karmaşık olabilir. Angular'ı mevcut tescilli bir çerçeveyle çok karmaşık bir siteye entegre etmeye çalıştım ve bu bir kabustu. Açısal, yeni başlıyorsanız harikadır, ancak bir öğrenme eğrisi vardır ve sizi çok sıkı bir iş akışına kilitler. Eğer bunu takip etmezseniz, kodunuz gerçekten hızlı bir şekilde karışabilir.

Ben sadece bir SPA geliştirmek istiyorsanız Angular aşırı dolu olduğunu söyleyebilirim. Elbette, eğer onunla gelişmekte zaten rahatsanız, devam edin. Ancak çerçevede yeniyseniz ve sadece bir SPA geliştirmeniz gerekiyorsa, kendi avantajları ile daha basit bir şeyle giderdim. Vue.js veya Aurelia.io'ya bakmanızı tavsiye ederim .

Vue.js , iki yönlü veri bağlama, MVVM, yeniden kullanılabilir bileşenler, basit ve hızlı toplama, daha az kod yazma, vb. Kullanır.

Aurelia.io , dürüst olmak gerekirse, hakkında çok şey bilmiyorum. Ama etrafa baktım ve yukarıdakine benzer şekilde bakmaya değer bir alternatif gibi görünüyor.

Bağlantılar:
https://vuejs.org/
http://aurelia.io/