![[PukiWiki]](image/pukiwiki.png "[PukiWiki]")
#author("2023-02-02T07:33:32+00:00","default:admin","admin") #author("2023-02-02T07:41:18+00:00","default:admin","admin") -[[SPAを用いたWeb開発が業務アプリに最適な理由:https://qiita.com/goofmint/items/54645af6ffbfc1414b3b]] -[[SPA(Single Page Application)で業務アプリケーションを構築する:https://techceed-inc.com/engineer_blog/8918/]] -[[SPA, SSR, SSGって結局なんなんだっけ？:https://zenn.dev/rinda_1994/articles/e6d8e3150b312d]] -[[SPA, SSR, SSGの違いについて図解でまとめてみた:https://shimablogs.com/spa-ssr-ssg-difference]] -[[SPA化するMPAとMPA化するSPA:https://gihyo.jp/article/2022/11/tfen001-mpa_spa]] -[[SPA, SSG, SSRはどんなアプリケーションに向いている？ （前編）:https://note.com/funteractive_inc/n/n3c7275b11b8d]] -[[SPA, SSG, SSRはどんなアプリケーションに向いている？ （後編）:https://note.com/funteractive_inc/n/n4d1543906f4d]] -[[SPA(Single Page Application)ってなに？:https://digitalidentity.co.jp/blog/creative/about-single-page-application.html]] -[[シングルページアプリケーション（SPA）の導入メリット＆デメリット:https://www.oro.com/ja/technology/001/]] -[[SPAはじめてガイドブック:https://greative.jp/page/guidebook-spa/]] -[[シングルページアプリケーション（SPA）を徹底解説！導入メリットやUXとの関係は？:https://www.geekly.co.jp/column/cat-technology/1908_009/]] -[[SPAの保守開発を効率化――画面遷移理解を支援する:https://codezine.jp/article/detail/11360]] -[[今さら聞けない！シングルページアプリケーションとは:https://qiita.com/RinGoku/items/e44185d6103746b213c3]] -[[SPA(Single Page Application)の基本:https://qiita.com/takanorip/items/82f0c70ebc81e9246c7a]] *基本 [#b45be082] **メリット [#lc6521a3] -MPAでは、同じ機能分類でもブラウザとサーバーにまたがって実装されるものがあったのに対し、SPAでは役割分担が明確になる。このため、同じ機能をどちらに実装すべきかという混乱がなくなり、生産性、品質が向上する。 -ブラウザ側とサーバー側の開発を別の担当者が並行して進めることが可能になり、工期が短縮できる。 -画面生成をサーバー側のテンプレートエンジンに依存しないため、デザインと機能の結合がブラウザ上で完結する。 **デメリット [#h36af499] -ブラウザ側の開発者は、JavaScriptやTypeScriptのスキルが必要になる。 -ブラウザ側の資源は、難読化するとはいえユーザーによる解析が可能なため、非公開のデータやアルゴリズムが含まれないよう、配慮が必要になる。 *開発フレームワーク [#ud7cc497] -[[SPAの基本と3大JavaScriptフレームワーク（Angular、React、Vue.js）の最新動向 ～2020年版～:https://devlog.grapecity.co.jp/entry/spa-javascript-framework-in-2020]] -[[Vue.jsを効果的に使ってWebサイトをリッチに作る！Nuxt.jsとは:https://digitalidentity.co.jp/blog/creative/javascript-nuxtjs.html]] *HIstory API [#ee75a1aa] -[[履歴 API:https://developer.mozilla.org/ja/docs/Web/API/History_API]] -[[SPAってページ遷移するの？:https://qiita.com/ozaki25/items/41e3af4679c81a204284]] *クラウド [#y80bdde7] **AWS [#u5b70ca9] -[[AWS上でサーバレスSPAサイト（React）を作ってみた:https://blog.usize-tech.com/serverless-spa-by-react-on-aws/]] -[[Shopify アプリを AWS に SPA + Serverless 構成でデプロイする – React + Amplify / Node.js + Serverless Framework –:https://www.nri-digital.jp/tech/20200526-2059/]] -[[CDN+WAF+SPAの基本をAWSで簡単に構築する無料日本語ハンズオンを受講しました:https://dev.classmethod.jp/articles/handson-for-beginners-cloudfront-waf/]] **Azure [#dcd9f4ba] -[[AzureではじめるServerlessアーキテクチャ事例と4つのキーテクノロジーを解説 Part1:https://logmi.jp/tech/articles/322016]] -[[AzureではじめるServerlessアーキテクチャ事例と4つのキーテクノロジーを解説 Part2:https://logmi.jp/tech/articles/322021]] -[[SPA を Blob Storage にあげて、Azure Functions をバックエンドにしてみる。:https://qiita.com/TsuyoshiUshio@github/items/e6df17eaf2324841e331]] -[[Azure Functions SPA:https://blog.stephencleary.com/2017/08/azure-functions-spa.html]] -[[Azure Function App 『だけ』でWebサービスをホスティングする:https://koudenpa.hatenablog.com/entry/2018/06/10/213105]]
