Apakah AngularJS hanya untuk aplikasi satu halaman (SPA)?

Kami mencari opsi untuk membangun ujung depan aplikasi yang kami buat dan sedang mencoba untuk mengevaluasi alat yang akan bekerja untuk kami dan memberi kami platform terbaik untuk bergerak maju.

Ini adalah proyek Node.js. Rencana awal kami adalah menggunakan Express dan menempuh rute itu, tetapi kami memutuskan bahwa sebelum memulai tahap ini, mungkin yang terbaik adalah meninjau apa yang ada di luar sana. Aplikasi kami memiliki beberapa area yang kami yakini tidak cocok dengan model satu halaman karena terkait dari perspektif aplikasi, tetapi tidak dari tampilan.

Kami telah melihat beberapa kerangka kerja yang bisa kami gunakan untuk membangun klien seperti Backbone.js , Meteor , dll. Dan juga AngularJS.

Ini mungkin pertanyaan yang cukup jelas, tetapi kami sepertinya tidak dapat menguraikan jika AngularJS murni untuk aplikasi satu halaman atau dapat digunakan untuk aplikasi multi-halaman seperti Express misalnya.

PEMBARUAN 17 Juli 2013 Hanya untuk menjaga agar orang-orang tetap berada dalam lingkaran, saya akan memperbarui pertanyaan ini saat kami menjalani prosesnya. Kami akan membangun semuanya bersama untuk saat ini, dan kami akan melihat seberapa baik kinerjanya. Kami telah menjangkau beberapa orang yang lebih memenuhi syarat dengan AngularJS daripada kami dan mengajukan pertanyaan mengenai pemisahan aplikasi yang lebih besar yang berbagi konteks, tetapi mungkin terlalu besar bekerja pada satu halaman.

Konsensus adalah bahwa kami dapat melayani beberapa halaman statis dan membuat aplikasi AngularJS yang hanya bekerja dengan halaman-halaman itu, secara efektif membuat koleksi SPA dan menghubungkan aplikasi-aplikasi tersebut bersama-sama menggunakan tautan standar. Sekarang use case kami sangat spesifik karena solusi kami memiliki beberapa aplikasi, dan seperti yang saya katakan kita akan mencoba basis kode tunggal terlebih dahulu dan mengoptimalkan dari sana.

UPDATE 18 Juni 2016 Proyek jatuh dari tebing, jadi kami tidak pernah bisa menyelesaikan terlalu banyak. Kami telah mengambilnya lagi baru-baru ini, tetapi tidak lagi menggunakan sudut dan menggunakan Bereaksi sebagai gantinya. Kami masih menggunakan arsitektur yang diuraikan dalam pembaruan sebelumnya, di mana kami menggunakan aplikasi ekspres dan mandiri, jadi misalnya, kami memiliki /chatrute dalam ekspres yang menyajikan aplikasi chat Bereaksi kami, kami memiliki rute lain /projectsyang menyajikan aplikasi proyek dan begitu seterusnya. Cara kita memandangnya adalah bahwa setiap aplikasi adalah akar agregat dalam hal set fitur-fiturnya, ia harus dapat berdiri sendiri agar dapat dianggap sebagai aplikasi itu sendiri. Secara teknis, semua informasi ada di luar sana, hanya ekspres dasar dan rasa apa pun dari kebaikan aplikasi sisi klien yang ingin Anda gunakan.

Tidak semuanya. Anda dapat menggunakan Angular untuk membangun berbagai aplikasi. Perutean sisi klien hanyalah sebagian kecil dari itu.

Anda memiliki daftar besar fitur yang akan menguntungkan Anda di luar perutean sisi klien:

• mengikat dua arah
• templating
• pemformatan mata uang
• pluralisasi
• kontrol yang dapat digunakan kembali
• Penanganan api yang tenang
• Penanganan AJAX
• modularisasi
• injeksi ketergantungan

Sangat gila untuk berpikir bahwa semua itu "hanya dapat digunakan dalam aplikasi satu halaman". Tentu saja tidak .. itu seperti mengatakan "Jquery hanya untuk proyek dengan animasi".

Jika sesuai dengan proyek Anda, gunakan itu.

Saya berjuang dengan "bagaimana" pada awalnya dengan Angular juga. Kemudian suatu hari saya sadar: "Ini MASIH javascript". Ada banyak contoh tentang seluk beluk Angular (salah satu favorit saya bersama buku https://github.com/angular-app/angular-app ). Hal terbesar yang harus diingat adalah memuat dalam file js sama seperti yang Anda lakukan di proyek lain. Yang harus Anda lakukan adalah memastikan halaman yang berbeda referensi objek Angular yang benar (controller, view, dll.) Dan Anda mati dan berjalan. Saya harap ini masuk akal, tetapi jawabannya sangat sederhana sehingga saya mengabaikannya.

Mungkin pengalaman saya akan bermanfaat bagi seseorang. Kami membagi proyek kami secara logis. Satu SPA yang kami gunakan untuk umpan, satu lagi untuk bekerja dengan peta, satu lagi untuk mengedit profil pengguna dan lain-lain. Misalnya kami memiliki tiga aplikasi: umpan, pengguna dan peta. Saya menggunakannya di url yang terpisah, seperti ini:

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

Masing-masing aplikasi ini memiliki pemetaan rute lokal sendiri antar negara bagian dalam aplikasi. Saya pikir ini adalah praktik yang baik karena setiap aplikasi hanya bekerja dengan konteksnya sendiri dan memuat dependensi yang benar-benar dibutuhkan. Selain itu, praktiknya sangat baik untuk proses debug dan integrasi.

Memang, Anda dapat dengan mudah membuat campuran aplikasi SPA, misalnya umpan akan url dengan aplikasi angularjs, aplikasi pengguna dengan reactjs dan memetakan ke aplikasi backbone.js.

Menanggapi pertanyaan Anda:

Angular tidak hanya untuk SPA, Angular bermain bagus dan cepat untuk aplikasi SPA, tetapi tidak ada yang mengganggu untuk membangun aplikasi MPA dari berbagai aplikasi SPA. Tapi pikirkan arsitektur url Anda jangan lupa tentang ketersediaan SEO aplikasi Anda.

Saya juga mendukung gagasan itu:

Apa perbedaan antara proyek dan aplikasi? Aplikasi adalah aplikasi Web yang melakukan sesuatu - misalnya, sistem Weblog, database catatan publik, atau aplikasi jajak pendapat sederhana. Proyek adalah kumpulan konfigurasi dan aplikasi untuk situs web tertentu. Sebuah proyek dapat berisi beberapa aplikasi. Aplikasi dapat berada di beberapa proyek.

Jika yang Anda butuhkan adalah beberapa halaman dengan penyatuan data klien, saya akan menggunakan Knockout dan Javascript Namespacing.

Knockout sangat bagus, terutama jika Anda membutuhkan kompatibilitas ke belakang tanpa komplikasi dan memiliki halaman yang cukup lurus ke depan. Jika Anda menggunakan komponen pihak ke-3, binding custom Knockout mudah dan mudah digunakan.

Javascript namespacing memungkinkan Anda menjaga kode Anda terpisah dan mudah dikelola.

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

Dan dalam tag skrip setelah skrip Anda yang lain dimuat

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

Kuncinya adalah, Anda menggunakan alat apa pun yang Anda inginkan ketika Anda membutuhkannya. Perlu penyatuan data? Knockout (atau apa pun yang Anda suka). Perlu routing? sammy.js (atau apa pun yang Anda suka).

Kode klien dapat sesederhana atau serumit yang Anda inginkan. Saya mencoba mengintegrasikan Angular ke situs yang sangat rumit dengan kerangka kerja yang sudah ada, dan itu adalah mimpi buruk. Angular bagus jika Anda baru memulai, tetapi memiliki kurva belajar dan mengunci Anda ke dalam alur kerja yang sangat ketat. Jika Anda tidak mengikutinya, kode Anda dapat menjadi sangat kusut dengan sangat cepat.

Saya akan mengatakan Angular berlebihan jika Anda hanya ingin mengembangkan SPA. Tentu, jika Anda sudah nyaman mengembangkannya, silakan. Tetapi jika Anda baru dalam kerangka kerja dan hanya perlu mengembangkan SPA, saya akan pergi dengan sesuatu yang lebih sederhana dengan sejumlah fasilitasnya sendiri. Saya sarankan melihat ke Vue.js atau Aurelia.io .

Vue.js menggunakan pengikatan data dua arah, MVVM, komponen yang dapat digunakan kembali, sederhana dan cepat untuk diambil, lebih sedikit kode untuk ditulis, dll. Ini menggabungkan beberapa fitur terbaik dari Angular dan React.

Aurelia.io , sejujurnya, aku tidak tahu banyak tentang. Tapi saya sudah mengintip dan sepertinya layak dicari, mirip dengan yang di atas.

Tautan:
https://vuejs.org/
http://aurelia.io/