9割を自宅で完結？Jamstack を学んで開発環境をイチから作ってみた話 | IIJ Engineers Blog

2022/09/28 103 users 適材適所 イラストレーター イチ 完結 結論

イラストレーターの妻が「ポートフォリオサイト欲しい」と言い始めたので、面白そうだと思い開発を開始しました。 静的サイトなら Jamstack ってのがイイらしいと最近よく聞くものの、何かはわからないので勉強してみて、巷の Jamstack 構築環境をできる限り自分の家の中に作ってみます。 結論から言うと適材適所なので... 続きを読む

今話題の「ヘッドレスCMS」とは？ Jamstack、マルチデバイスにも対応したCMSの新潮流

2021/11/04 28 users ヘッドレスCMS マルチデバイス CMS 概念 従来

CMS（コンテンツ・マネジメント・システム）とは、ブログやWebサイトなどで活用されているコンテンツを管理するための仕組みです。代表的なものとしてWordPressやMovable Typeが挙げられ、主にWebサイト制作に使用されています。本記事では従来のCMSとは異なる概念であるヘッドレスCMSについて利用シーンとともに紹介し... 続きを読む

Jamstackで失敗した3つのこと - PWA Night Conference 2021 - Speaker Deck

2021/06/26 25 users Speaker Deck セッション コツ メリット 特徴

JamstackでWebサイトやWebアプリケーションが作られることも増えてきました。このセッションでは、まずJamstackとはなにか、特徴とそのメリットをあらためて確認します。その上で「自社メディアCodeGridをJamstackで作った際に、失敗した3つのこと」を紹介しながら、Jamstackを採用する際のコツを伝えます。 続きを読む

Jamstackを検討する - ゆーすけべー日記

2021/06/25 141 users 紆余 弱み ゆーすけべー日記 既存 結論

Jamstackを既存のシステムに導入するかを検討する機会があった。 紆余曲折したものの、未だに暫定的な結論しか出ていない。 とはいえ、わりと頑張った。 今回は Jamstackとはなんぞや？ Jamstackの特徴 Jamstackの技術 弱みを解決する策 実際に検討した話 を雑に紹介したい。 個人的なメモなので、間違っているところが... 続きを読む

Hotwireの感想 - laiso

2021/01/23 27 users laiso Hotwire ウェブアプリケーション 思想 基盤

Hotwire https://hotwire.dev/ Turboを中心としたウェブアプリケーションのアーキテクチャの要素技術やコンセプトをPRするための名称 役割としてはJamstackとかReactのlearn once, write anywhereなどに似ている アプリケーション実装言語非依存だけど現状Railsアプリケーションしか実用できる基盤がない Hotwireの思想 ... 続きを読む

Micro Frontends Architecture Patterns

2020/12/20 579 users アーキテクチャパターン 本書 リズ やりとり ソフトウェア

本書は、Micro Frontends Architecture Patternsというタイトルを付けていますが、モノリスからJAMstack、Micro Frontendsまで、Webフロントエンドを包括した様々なアーキテクチャパターンの詳細を体系的に紹介しています。 ソフトウェアとしてのアーキテクチャ全体を俯瞰し、他のシステムとのやりとりを設計するような... 続きを読む

Gatsby・Wordpress・Netlifyで開発したときの躓きと解決方法 - カミナシ開発者ブログ

2020/12/01 16 users カミナシ開発者ブログ 解決方法 反響 エンジニア リニューアル

こんにちは、株式会社カミナシのエンジニア @tomiです。 前回、「サービスサイトをGatsby×Wordpress×NetlifyでJamstackなサイトにリニューアル」という記事を書き、たくさんの反響をいただきました。ありがとうございます。 kaminashi-developer.hatenablog.jp 今回は、Gatsby・Wordpress・Netlifyで開発したときの躓き... 続きを読む

microCMS + Gatsby + GitHub Actions + S3 でJamStackのチュートリアル | Developers.IO

2020/11/06 160 users Markup GATSBY microCMS チュートリアル

What is Jamstack? ここ数年でよく聞くようになったワード。 Jamstackとはウェブサイトを構築および運用するための、技術の組み合わせです。 JavaScript・API・事前にレンダリングされたMarkupの組み合わせでJamStackとのこと。 (以前はJAMStacといってたけど、最近はJamstackだったりする) Jamstackは、 「ウェブをより... 続きを読む

Next.js の状態管理 2020

2020/10/30 184 users Next.js 状態管理 SSG 花形 SSR

Next.js といえば、SSG（JAMstack）が最近は特に花形ですね。1年前まではgetInitialPropsを用いて、どう SSR するのかという事が関心ごとの中心でした。Next.js 9.3 以降、SSR をする際にはgetInitialPropsではなく、getServerSidePropsを使用することが推奨されています。getStaticPropsやgetServerSidePropsを利用する... 続きを読む

Jamstackとは？ | 株式会社ピクセルグリッド

2020/09/30 18 users セキュリ CDN アーキテクチャ HTML Webサーバー

事前にデータを埋め込んだ静的なHTMLをベースに、JavaScriptを使いAPIを通じて動的なコンテンツを扱うWebアプリ・WebサイトのアーキテクチャをJamstackといいます。 静的なHTMLとJavaScriptをベースにすることで、CDNで配信でき、Webサーバーの管理や運用をなくせます。 大量のアクセスに強く、高速に配信でき、セキュリ... 続きを読む

数日前に大幅リニューアルされた Next.js のチュートリアルをやれば、２０２０年のフロントエンドを体感できる - Qiita

2020/04/23 389 users Qiita チュートリアル 関数 アプリケーション HTML

この記事について 数日前（4/21頃）に Next.js のチュートリアルが一新されました。 Next.js は 3 月頭に ver 9.3 がリリースされ、ビルド時に静的に HTML を生成する関数などが追加されるなど、今までよりもかなりパワフルになり、いわゆる JAMstack と呼ばれるようなアプリケーションを作りやすくなりました。 そのバ... 続きを読む

Nuxt + Contentful + Firebase Hosting のJAMstackを使ったサービス開発 | GiFT（ギフト）株式会社

2019/12/16 14 users Gift Nuxt Contentful コーポレートサイト

Nuxt + Contentful + Firebase Hosting のJAMstackを使ったサービス開発 今年はContentful芸のブログばかり書いていたら、JAMstackおじさん（通称JAMおじさん）になってしまいました。 今回は実際にリリースしたサービスでどのように実装したかを書いてみたいと思います。 今年はコーポレートサイトやオウンドメディアの... 続きを読む

JAMstackってなに？実践に学ぶ高速表示を実現するアーキテクチャの構成 - エンジニアHub｜若手Webエンジニアのキャリアを考える！

2019/12/10 13 users アーキテクチャ APIs エンジニアHub Markup 構成

JAMstackという言葉をご存知でしょうか。JAMstackは、「JavaScript」「APIs」「Markup」という3つの技術を組み合わせた、新しいWebアプリケーションアーキテクチャです。パフォーマンスの改善、セキュリティの担保、スケーラビリティの確保が見込めるため、フロントエンド界隈で、大きな注目を集めています。 しかしまだ... 続きを読む

クライアントサイドに基づいたWeb開発アーキテクチャ「JAMstack」がなぜ人気になっているのか | コリス

2019/11/05 60 users クライアントサイド コリス 静的サイトジェネレーター 元ザ

静的サイトジェネレーターが最近、非常に普及してきました。 それに合わせて注目されているのが「JAMstack」です。JAMstackとは何なのか、なぜJAMstackが人気になっているのかを紹介します。 Why JAMstack is Becoming so Popular by Luca Spezzano 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サ... 続きを読む

Netlify と PWA で JAMstack を目指す - kondoumh のブログ

2019/05/27 13 users Netlify CDN Pwa Git ホスティング

静的サイトをホスティングできる Netlify 流行ってます。Git リポジトリを指定するだけでビルド・デプロイでき、CDN でリソースをキャッシュしてくれるので、PWA のホスティングにも向いています。 PWA を作る方法は色々とありますが Vue CLI で簡単にプロジェクト生成できるのでちょっと試してみました。 プロジェクト... 続きを読む

JAMstack | JavaScript, APIs, and Markup

2017/02/02 68 users APIs JavaScript of JavaScript

JAMstack : noun \’jam-stak’\ The ideal way of building websites and apps that are fast, secure and simple to work with through the utilization of JavaScript, APIs, and Markup. With servers abstracted ... 続きを読む

エレキギターに装着するiPhone連携アンプ「JamStack」--内蔵スピーカで路上ライブに - CNET Japan

2016/11/30 10 users エレキギター エレキベース アコースティックギター 一苦労

ロックなどの音楽に欠かせないエレキギターだが、演奏するには手間がかかる。アコースティックギターよりはるかに重くて持ち運びが面倒なうえ、音を出すのにアンプや各種エフェクタ、シールドケーブル、もちろん電源などが必要になり、路上ライブをしようとすると一苦労だ。 そこで、エレキギターやエレキベースに取り付け可能な、スマートフォンと連携して多彩な音の出せるモバイルアンプ「 JamStack 」を紹介しよう。... 続きを読む