Metode memisahkan depan dan belakang dengan javascript tumpukan penuh?

Misalkan saya memiliki front-end yang sebagian besar merupakan aplikasi satu halaman yang ditulis menggunakan angular, grunt, dan bower. Dan seandainya saya memiliki backend, yang sebagian besar hanya REST API yang duduk di atas ORM, yang menyimpan / mengambil objek dari database, menggunakan hal-hal seperti mendengus, mengekspresikan dan mengurutkan.

Aplikasi sudut melakukan semua hal visual yang dilihat pengguna, tetapi melakukannya dengan menjadi GUI atas layanan yang disediakan oleh back-end.

Akan diinginkan untuk memisahkan ini menjadi dua basis kode yang berbeda, untuk mengizinkan pengembangan independen, versi, integrasi berkelanjutan, dorongan untuk pengembangan, dll.

Pertanyaan saya adalah, metode apa yang ada di luar sana untuk melakukan ini dengan bersih? Adakah praktik terbaik yang disarankan untuk javascript tumpukan penuh?

Opsi # 1 tampaknya menjadi monolith, yaitu "jangan pisahkan mereka". Pro adalah bahwa rantai build sederhana, dan semuanya ada di satu tempat - tetapi tampaknya ada banyak kontra; lebih sulit untuk versi secara mandiri, bagian depan yang rusak berarti bagian belakang yang tidak dapat digunakan, dan sebagainya.

Opsi # 2 tampaknya menjadi quasi-monolith, di mana rantai front-end menghasilkan penulisan banyak file ke back-end. The distdirektori pada front-end akan merujuk ke beberapa direktori di back-end, jadi pada dasarnya ketika minifies ujung depan, uglifies, dll, itu berakhir penerbitan ke back-end, yang menjalankan segala sesuatu.

Opsi # 3 tampaknya pemisahan penuh: front-end dan back-end masing-masing menjalankan server mereka sendiri pada port yang berbeda, dan mereka adalah proyek yang sepenuhnya terpisah. Kelemahannya tampaknya mereka perlu dikonfigurasi untuk mengetahui tentang port masing-masing; back-end harus memungkinkan CORS dari front-end, dan front-end perlu tahu di mana semua titik akhir itu diharapkan.

Opsi # 4 mungkin menggunakan sesuatu seperti docker-compose untuk menggabungkan semuanya.

Saya yakin ada opsi lain. Apa praktik terbaik yang disarankan?

Ini adalah aplikasi front-end, back-end, dengan antarmuka REST di antaranya. Anda sudah memiliki pemisahan penuh.

Pilihan saya adalah untuk opsi # 3. Anda tampaknya khawatir tentang konfigurasi, tapi itulah intinya. Konfigurasi memungkinkan Anda untuk memiliki pemisahan penuh tanpa memerlukan binding kode yang dipasangkan dengan erat. Jika Anda khawatir tentang CORS, letakkan semuanya di satu domain. Jika Anda harus memiliki CORS, cara terbaik untuk mengelolanya adalah konfigurasi.

Tetapi tidak ada "praktik terbaik" di sini. Praktik terbaik adalah yang akan memenuhi kebutuhan spesifik Anda.

Ya, Anda harus memisahkan keduanya dan memperlakukan aplikasi ujung depan seperti aplikasi pihak ke-3 - Anda akhirnya dapat menambahkan klien lain, aplikasi seluler misalnya, dan jika klien pertama telah dibangun dengan cara ini hidup Anda akan lebih mudah.

Menggunakan wadah buruh pelabuhan atau sistem penempatan lain sebagian besar berkaitan dengan backend, karena ujung depan aplikasi Anda hanyalah aset statis yang perlu diselesaikan. Anda dapat meng-host aset itu secara statis di server Anda atau di tempat lain seperti CDN seperti cloudfront.

Menghindari kors akan menghemat sedikit konfigurasi Anda, tetapi seperti yang disebutkan di atas, itulah masalahnya. Menggunakan cors (dan token auth) akan lebih baik mempersiapkan backend Anda untuk klien lain juga.

Sunting: sejauh praktik penuh tumpukan js terbaik - Saya hanya akan mengatakan ini, konsisten. Jika Anda menggunakan janji (dan Anda harus), lakukan itu di kedua sisi. Pertahankan gaya dan format js yang sama, gunakan lib pengujian yang sama (jika mungkin), dll.