Webの次世代アーキテクチャ - PESPA - Qiita
PESPAというアーキテクチャについて、みなさんご存じでしょうか？ これはWebにおける次世代のアーキテクチャを表しており、MPAやPEMPA、そしてSPAの欠点を解決し、シンプルかつプログレッシブエンハンスメントなアーキテクチャとなっている素晴らしいアーキテクチャのひとつとなっています。 そう、Remixフレームワークが採用しているアーキテクチャです。 このPESPAという概念について、Kent C.Doddsさんが、2022年の10月21日に投稿し話題を呼びました。 日本ではあまりまだ浸透していない概念ということもあり、本当に素晴らしいアーキテクチャと思想を兼ね備えていることから、今回その記事を翻訳しました。 みなさんがこれから開発していくアプリケーションに、ぜひこのアーキテクチャを採用していただきたいと願っております。 この記事は、あくまで翻訳であり、意訳の部分も含まれているため間違
フロントエンド・ SPA 研修
フロントエンド・ SPA 研修フロントエンド・ SPA 研修 このドキュメントは何か GMO ペパボ株式会社エンジニア・デザイナー向けフロントエンド・ SPA (Single Page Application) 講習のドキュメントです。エンジニア・デザイナーがモダンなフロントエンド開発について入門するための教材として書いてありますが、いかんせん著者がエンジニアなのでエンジニアリングについてある程度わかっていることを前提に書いてしまっています。（特にデザイナーで）ここわかりにくかったとかあったら Pull Request して改善してください。お願いします。 この研修プログラムを一巡することで、エンジニアはすでに作っているであろう Rails Tutorial の Micropost アプリから SPA (Single Page Application) バージョンを作り、モダンなフロントエ
AWS Amplify × Next.js で Server Side RenderingのデプロイおよびCI/CD環境を構築する
本記事では、AWS Amplify と Next.js を使って SSR 構成のデプロイ、および CI/CD の構築について考えていきたいと思います。 ※2021/05/19 更新 Amplify Console が SSR ホスティングをサポートしたので記事の内容を更新しました Amplify ConsoleがNext.jsで作成されたアプリのSSRに対応しました🎉 去年9月にAmplify LibrariesがNext.js/Nuxt.jsのSSR対応したので、SSRがAmplifyで完結できるようになります！https://t.co/igYF9Vz61a#AWSAmplifyJP — Jaga@AWS Amplify (@jagaimogmog) May 18, 2021 (参考) https://aws.amazon.com/jp/blogs/mobile/host-a-next
SPAってページ遷移するの？ - Qiita
概要 SPAにおけるルーティングについて簡単に紹介します SPAを作ったことがない人が対象読者です 知ってる人からすると、そんな当たり前なことを・・と思うかもしれません SPAとは？ Single Page Applicationの略です 対義語はMultiple Page Applicationです つまり単一ページで構成されるのがSPAで、複数ページで構成されるのがMPAです SPAは最初に画面(HTML)を取得した後は、JavaScriptによって画面の書き換えを行うことで単一ページでありながらアプリケーションを構築することができます これは言い換えるとSPAはページ遷移しないということ？本当にそうでしょうか？ SPAはページ遷移しない？ 2つのデモページを用意しました https://spa--mdc-2019.netlify.com/ https://mpa--mdc-2019.
SPAにおける状態管理:関数型のアプローチも取り入れるフロントエンド系アーキテクチャの変遷 - エンジニアHub｜Webエンジニアのキャリアを考える！
こんにちは、小林（@koba04）です。 本記事では、シングルページアプリケーション（以下、SPA）における状態管理について解説します。 GmailやTwitterは、SPAとして構築されている代表的なWebアプリケーションであり、スムーズなページ遷移をSPAによって実現しています。またElectronやPWA（Progressive Web Apps）の登場により、複雑なアプリケーションをWebの技術を使って構築する場面も増えてきました。 これらの複雑なアプリケーションにおいては、既存のページ単位での状態管理の考え方では対応が難しくなります。 そこで今回は、具体的なフレームワークも取り上げながら、Webフロントエンドにおける状態管理のアプローチについて紹介します。 フロントエンドでの状態管理の複雑化 ページの単位を超えた状態の保持 モデルとビューによる処理の分割 イベントの管理が複雑にな
JAMstackってなに？実践に学ぶ高速表示を実現するアーキテクチャの構成 - エンジニアHub｜Webエンジニアのキャリアを考える！
JAMstackってなに？実践に学ぶ高速表示を実現するアーキテクチャの構成 JAMstackは、「JavaScript」「APIs」「Markup」の3つの技術を組み合わせた、新しいWebアプリケーションアーキテクチャです。いち早くJAMstackを利用してWebサイトを作成した、寺川直宏さんと風間雅也さんにJAMstackについて聞きました。 JAMstackという言葉をご存知でしょうか。JAMstackは、「JavaScript」「APIs」「Markup」という3つの技術を組み合わせた、新しいWebアプリケーションアーキテクチャです。パフォーマンスの改善、セキュリティの担保、スケーラビリティの確保が見込めるため、フロントエンド界隈で、大きな注目を集めています。 しかしまだ登場したばかりの概念ゆえ、実例も少なく、理解しにくい面もあります。そこで、いち早くJAMstackでWebサイトを
SPA が、ウェブ開発のベストプラクティスになる時代 - mizchi's blog
最近のフロントエンドに関するお気持ち。正直まとまってはない。 最近、こんな感じのツイートや記事が増えた。 web 技術をキャリアの中心にしない シングルページアプリケーション (以下SPA) の台頭により、私の観測範囲ではモダンな Web サイトは SPA で作られるようになった。サーバーサイドは JSON を返す API サーバーとなり、DB やバックエンドシステムのプロキシのような存在になりつつある。 私はサーバーサイドエンジニアとしてキャリアを積んできた。SPA が流行りだした頃、いずれサーバーサイドエンジニアは不要になって自分のキャリアを考え直さなくてはいけない時期がくるのではないかと戦々恐々としていた。 自分も元々、SPA を他サイトとの「差別化技術」と定義していた。ブラウザのタブページのライフサイクルにおいて、初期化プロセスを一回にまとめてシームレスな遷移を実現する技術。たとえ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Vue.js を vue-cli を使ってシンプルにはじめてみる - Qiita
React製のSPAのパフォーマンスチューニング実例
Greative