7年間使ってきたWordPressを捨ててContentful+Gatsby+Netlifyにしたら爆速になったし経緯とか教訓とか語る - Qiita
7年間使ってきたWordPressを捨ててContentful+Gatsby+Netlifyにしたら爆速になったし経緯とか教訓とか語るWordPressReactNetlifygatsbycontentful こんにちは、古都ことと言います。普段はブログやらなんやらをやっているのですが、今回ブログのお引っ越しをしたのでその経緯などについてお話ししたいと思います。 先にまとめ ブログをVPSとWordPressで7年間運営してきた 速度面やメンテナンス面でそろそろガタがきていた Contentful+Gastby+Netlifyの構成に移行した Lighthouseで高スコア叩き出せた 技術選択って難しいね 運営しているブログ Subterranean Flower Blogというブログをやってます。 主にフロントエンド周りのことを取り扱っており、たまにマリオ64の記事や、転職の記事などでも
Headless CMSとは Headless CMSは、Wordpressなどとは違って本体のウェブサイトと管理画面が完全に分離されているのが特徴の CMS(コンテンツマネジメントシステム) です。 これを使うと、フロントエンドとCMS側が分かれるのでそれぞれを別の場所に配置することが可能です。 動的なコンテンツを表示することをサーバーを持たずに行うことが可能になるのが魅力です。 Micro CMSとは Micro CMSは国産のHeadless CMSです。 これまでのHeadless CMSというと「Contentful」が主流な気がします。 Contentfulは日本のサービスではないので英語が基本になりますが、Micro CMSはデフォルトで日本語に対応していたり、日本語でのチャットサポートがあるのが良いと思いました。 使い方 登録 上記画面の「無料ではじめる」または「新規登録」
旧サイト(はてなブログ)からのパフォーマンスの伸びが顕著ですね。 Performanceは言わずもがなですが、はてなブログでPWA対応がほとんどされていないのが気になりました。Service Workerのような標準化しつつある仕様に追従できていないのは痛いところ。 Nuxt + Contentfulでやっていき 今回の実装にあたってはフレームワークに依存せずSPAを作成することも検討しましたが、SEOなどを考えるとSSRの仕組みが必須です。またSSRもスクラッチで組もうとすると中々ハードルが高く(Storeのハイドレーション、Render hooksのAPI設計等)、今回は業務でも利用した事のあるNuxt.jsを利用しました。 Embedded content: https://nuxtjs.org/ 詳細は後述しますが、Nuxt communityの提供しているModule群がものすご
Discover how we're implementing AI to optimize content creation
Vue Fes Japan 2019 サイトのソースコードを公開した - おいちゃんと呼ばれています
この記事は Nuxt.js Advent Calendar 2019 - Qiita の最終日（25日）の記事です。 Vue Fes Japan 2019 の Web サイトのソースコードを公開したので、お知らせします。 https://github.com/vuejs-jp/vuefes-2019 概要 Vue Fes Japan 2019 は Nuxt.js の静的サイトジェネレート機能（nuxt generate）によって作成している。 生成した静的ファイルを Netlify でホスティングしている。 スポンサー情報などのコンテンツをヘッドレス CMS である Contentful で管理している。いわゆる JAMstack 構成。 ポイントをピックアップ Vue Fes Japan 2018 サイトのソースコードについては下記で解説しており、2019 のものと共通している点も多いの
こんにちは、@f_subal です。 pixivFACTORY というサービスで普段はフロントエンドをやっています。 今回は Rails のサービスに Headless CMS の Contentful を導入し、ワークフローを改善した話をします。 ランディングページ、あるいはマスターデータの詳細について pixivFACTORY はグッズおよび同人誌がブラウザ上で簡単に作れるサービスです。 取り扱っているグッズは 60 種類以上あり、各グッズごとに仕様が大きく異なります。 グッズにはそれぞれ、仕様や出来上がりの写真を載せたページ（以下、product 詳細とも呼びます）が存在します。 要するに、以下の状況を想定してください。 運営が管理する静的なドメインモデル（ここでいう「作れるグッズの仕様」）が存在する モデルの各内容について説明するページが存在する 各ページの内容は DB の内容から
この記事は ハンズラボ Advent Calendar 2017 2日目の記事です。 ハンズラボのアドベントカレンダーがみるみる埋まっていくのを見て、一人ニヤニヤしていた@daikiojmです。 7月にハンズラボに入社して以来、Angluarでフロントエンド開発をしています。 今回は、個人的に気になっていた、contentfulの概要と、ハンズオンの手順をまとめてみます。 概要 contentfulはAPIファーストなCMSで、ドイツのスタートアップによって開発されており、WordPressやDrupalなどの従来のCMSとは異なり、ディスクトップやモバイルだけでなく、デジタルサイネージや、スマートウォッチなどのプラットフォームへのコンテンツ配信が可能なAPIが用意されていることが特徴です。 WordPressなどと同様に、記事(コンテンツ)の投稿、管理画面のUIは用意されていますが、ユー
【入門】Nuxt.js + Contentful + Netlify で始める、JAMstack な CMS 構築 - Qiita
【入門】Nuxt.js + Contentful + Netlify で始める、JAMstack な CMS 構築JavaScriptVue.jsJAMstackNuxtcontentful 概要 こんにちは、アジアクエスト株式会社でフロントエンドエンジニアをやってます、かめぽんです。最近はエンジニアリングだけでなく Vue や Nuxt の導入支援などもしていたので、徐々に Vue を使ってくれる人が増えつつあり、組織的にもこれからどんどんフロントエンド技術を一層浸透させていきたいなと思っております。 最近、JAMstack やヘッドレス CMS という言葉を聞きますが、CMS と聞いて真っ先に思い浮かべるのは WordPress だと思います。人によっては好き嫌いあって僕もそんなに得意と言うか好きな技術ではありません。だけど、CMS の需要はかなりあるのでどうしたらもっと扱い回しやすい
なぜPWAなのか PWA(Progressive Web Apps)はひと言で説明するとWebがアプリのようになる技術です。 個人的にはとても魅力的な技術だと思うのですが、2015年に発表されてから今まであまり活用されていないような気がします。もちろんネイティブアプリには及ばないですが、情報がまとめてあるのが中心で少しの機能だけの場合はPWAで事足りるのではないかと思ったので作ってみました。 作ったサイトはこちら https://mdtakaoka.info まず結論から言うと、Webサイト的には成功したのではないかと僕は思います。下の画像GoogleAnalyticsの解析ですがPWAユーザ（ホーム画面に追加したユーザ）はページ/セッション、平均セッション時間、直帰率がすべてのユーザに比べて良くなりました。今回はWebサイト上にはホーム画面に追加できることを記載しなかったので、１割程度の
ブログサイトを作りながら学ぶGatsby入門
昨今のフロントエンドのトレンドとしては「React」や「Vue」などのSPAを構築できるライブラリが挙げられるかと思います。 React製のフレームワークであるGatsbyは手軽に高速なwebサイトを作れると注目されています。 本書ではGatsbyの基礎的知識はもちろん、実際にブログを作り公開するまでの実践的な使い方を学べる内容となっています。 作るブログサイトのDEMOが見れるURL https://musing-banach-f3a228.netlify.app/
これから注目されること間違いなしの CSS フレームワークです。 Tailwind CSS では、UI コンポーネントを提供するのではなく、CSS の class を提供するだけなので、用意された class を指定するだけなので簡単に複雑な UI を作成することができます。 公式ドキュメントを元に Flex の例を見てみましょう。 class を見るだけで大体なにをしているかわかると思います。 Tailwind CSS を採用した理由僕は、割とフロントエンドには自信があります。デザインもかじってる系です。 UI フレームワークだとちょっといじろうと思うと逆にコストがかかるケースが多く、コンポーネント作成や見た目はこっちでやるから class だけ提供してくれとずっと考えており、そんな中 Tailwind CSS と出会ったので採用しました。 英語もできないので正直 class 名を考える
【WordPress脱却】APIベースなCMS「Contentful」と Nuxt.jsでブログシステム爆速構築の巻【ちゃんとSSRでSEO】
【WordPress脱却】APIベースなCMS「Contentful」と Nuxt.jsでブログシステム爆速構築の巻【ちゃんとSSRでSEO】 まず、Contentfulとは何か？ Contentful公式(英語)にある、キャッチを訳してみると… CMSがソフトウェアを出荷する途中に入ってはいけません。 Contentfulは、チームがあらゆるデジタル製品のコンテンツにパワーを与えることを可能にするコンテンツインフラストラクチャを提供します。 コンテンツインフラ！ おお！これだ！(こういうの探してたw) WordPress(PHP)が好きじゃなくて、JavaScriptだけで構築できるWordPressみたいなCMSを探してたら、Qiitaの記事がヒットして発見〜♪ ↓その記事はこちら 次世代Headless CMS「contentful」事始め 上の記事見たら簡単に開始できました！ Co
これは Vue.js #3 Advent Calendar 2017 – Qiita 21日目の記事です。 デモ：https://hisako135.github.io/nuxt_blog/ リポジトリ：https://github.com/hisako135/nuxt_blog Nuxt.js 使ってみたいけど何をつくろうかな〜と思案していたらば、『SEO、OGP……Vue.js製SPAの「困った」を解決できる「Nuxt.js」が便利だ！』という記事でブログを作っていたので、なんだかちょうどよさそうと思い以下を追加してやってみることにしました。 Contentful から記事を取得する トップページに配置するコンポーネント（ components/PostPreview.vue ）をつくる 記事一覧ページと個別記事ページをつくる nuxt generate で静的ファイルを生成する Gi
Manage all your sites. Reuse code, content, and designs.
高速、セキュア、スケーラブルな次世代EC技術「ヘッドレスコマース」でShopifyサイトを作っての学び | non-standard world株式会社
こんにちは。代表兼CTOの高崎です。 この前、自社運営の出版レーベルのECを高速、セキュア、スケーラブルな次世代EC技術「ヘッドレスコマース」形式でリニューアルしました。 ヘッドレスコマースとは 海外のD2Cと呼ばれるテクノロジーを重視した製造小売で標準となっている次世代型のEC技術で、 データ（バックエンド）とデザイン（フロントエンド）の分離が特徴的なECサイトの作りです。 メリット 1.高速 以下は海外ECサイトがヘッドレス化する前と後で速度がどのように変わったかの例です。 左がShopifyを使ってヘッドレス化したサイトの映像で、右が旧来のECサイトです。 ご覧いただければスピードの差が一目瞭然かと思いますが、「サイト表示が0.1秒遅くなると、売り上げが1%減少し、1秒高速化すると10%の売上が向上する。」と言われる通り、高速であることはECサイトの売上に直結します。 また、高速なサ
GatsbyJSのIncremental Buildsで静的サイト制作が劇的に変わる - hiro08gh
こんにちはhiro08です。 先日GatsbyJSのブログで、Incremental Buildsのリリースがアナウンスされました。これはコンテンツに変更があった場合、変更部分のみを再ビルドする仕組みです。今後のJamstack/静的サイト制作を劇的に変える非常に強力な機能です。 補足 現時点ではGatsby CloudのProfessionalプランで使える機能です。まだまだ試用機能といった感じです。 www.gatsbyjs.org いままでの課題点 いままでのGatsbyJSには課題がありました。それは、変更があった場合すべてのページを再ビルドしてしまうことです。少ないページ数の場合あまり影響ないですが、数千から数万ページ以上の大規模な静的サイトでは、 一部の変更でもすべてのページが再ビルドされてしまうため、ビルド効率が悪い(CI/CDを使ってる場合消費量が多くなってしまう) ビルド
記事のデータやタグなどのコンテンツを管理するWebアプリです。マークダウンエディターを備えており、ここで記事を書きます。この記事データをGatsby.jsが読み込み、静的なファイルを作ってくれるわけです。 （記事を保存したときに、Netlifyに通知が飛ぶようにしておくと、Netlifyがページデータを再生成してくれます） 静的なサイトをビルド、デプロイ、ホスティングしてくれるサービスです。GitHub上のGatsby.jsのソースコードと、Contentfulの記事データを読み込み、静的なサイトデータを生成（ビルド）してくれます。そのため、ブログのカスタマイズがとっても楽になります。SSL化も無料。 高速な理由（Gatsby.js）WordPressと異なり、あらかじめ静的なページデータを生成しておく（Gatsby.js）ファーストビューに関わるCSSを自動でインラインで埋め込んでくれる
ノーコードでJAMstackなWebサイトを作成できる「Stackbit」を使ってみた！ - paiza times
どうも、まさとらん（@0310lan）です！ 今回は、JAMstack*1を構成できるさまざまなサービスと連携してサイトを手軽に作成できる無料のWebサービス「Stackbit」をご紹介します！ しかもプログラミング不要で、話題のノーコード（NoCode）サービスとしても人気が高いことで知られています。面倒な処理はすべて自動化されているので、誰でも手軽に最新のWebサイトを作ることができます。 Webサイト制作やJAMstackなどにご興味ある方は、ぜひ参考にしてみてください！ 【 Stackbit 】 ■「Stackbit」の使い方 それでは、基本的な「Stackbit」の使い方から見ていきましょう！ まず最初にトップページにある【TRY NOW】ボタンをクリックします。 JAMstackを構成する各サービスを選択する画面が表示されます。 2020年5月時点において、選択できるサービスは
2019-11-07 【Contentful】入門。Conentfulとは？導入方法・設定手順の解説 #contentful#cms#blog#webアプリ#api#headless cms Contentfulとは？ Contentfulは、「Headless CMS」と呼ばれるAPIベースのCMSです。 従来のCMSとの違いや、料金体制などについて簡単に説明します。 従来のCMSとHeadless CMSの違い まずCMSとは、「Contents Management System」の略で、直訳すると、コンテンツを管理するシステムです。 CMSを利用する最大のメリットは、Webサイトを作成するためのHTMLやCSSの知識がなくても、ブログなどのコンテンツを管理できることです。 具体的に言うと、コンテンツ(ブログ記事など)の作成・編集・削除などを行うためのサービスです。 従来のCMS(W
Contentfulの料金と使い方を整理しつつ、Nuxt.jsと組み合わせてブログを作る - Qiita
Contentfulを使ってみたくなったので、印象に残った邦画を書き残すブログを作りました。ブログを作って満足してしまったので、記事の中身は（仮）です。Contentfulの考え方に馴染むのに少し時間がかかったので、そこのところの整理がメインの記事です。 ヘッドレスCMSというもの CMSというと、WordPressとMovable Typeぐらいしか知らなかったのですが、最近ヘッドレスCMSという言葉を耳にするようになりました。ヘッドレスCMSは、WordPressのようにテンプレートを表示する部分を持たず、APIでデータを提供することに特化している点が特徴です。 ヘッドレスCMSの選択肢は、こちらのサイトにたくさんありましたが、そのなかで、ContentfulというCMSのサービスが気になったので、Nuxt.jsと組み合わせて簡素なブログを作りました。 headlessCMS | A
Gridsomeって何ぞや GridsomeはReact製の静的サイトジェネレータのGatsbyを参考に作られた、Vue.jsの静的サイトジェネレータ。今までだとNuxt.jsのgenerateを使うことが多かったけど、今後Gridsomeも台頭してくるかもなということで、書いてみました。ちなみに、ロゴがめっちゃGraphQLを意識してるよね。 概要 Gridsomeは2018/12/03現在ver0.3.4で絶賛ver1.0に向けて開発中。今のところこんな感じで、実用的なプロダクトを作るにはまだ機能が足りていない部分もあるので、ぶっちゃけまだNuxt.js使うしかないって感じ。 ビルドコマンドを走らせたタイミングでGraphQLでデータを取得して、静的サイトを書き出してくれる。運用するときには、CMSの更新に同期してbuildコマンドが走るようにすることになる。 Gridsomeの大きな
Contentful is not a CMS, Contentful is content infrastructure. Webサイトがシンプルで見やすい。 ものは言いような気もするけれど、CMSではなくContent Infrastructureらしい。 ドキュメントも見やすくて素敵。 https://www.contentful.com 無料で使える範囲と制限 https://www.contentful.com/pricing/ アカウントの作成時に、MICRO SPACEというものをひとつ割り当ててもらえます。個人で使う分にはMICRO SPACEで事足りそうなので、かなり気前がいい印象です。 24個のコンテンツタイプ 5000個のレコード 10人のユーザー 1つのロール（ユーザー権限） 2つの環境（master/stagingとか） 2つのロケール（多言語対応） ※ 2018
[初心者向け]Contentfulの全体像・記事投稿の流れ・便利な機能をまとめてみた | DevelopersIO
どうも、ベルリンオフィスの小西です。 ヘッドレス CMS の Contentful について、そういえば概要説明的な記事は書いたことがなかったなと思い、本記事を執筆してみました。 この記事で Contentful の全体像や使用する際の流れを把握できるようにしているつもりです。 こういう情報が欲しいなどあればお気軽にご連絡ください。 Contentfulについて Contentful はヘッドレス CMS の一つです。 Contentful では記事やアセット（画像など）の管理を行い、記事の取得や表示などを行う「ビュー（View）」は外部に委ねるため、ヘッドレスと言われます。 Contentful はドイツの会社で、弊社のヨーロッパオフィスと同じベルリンに本社があり、アメリカ・ヨーロッパを中心にグローバルにサービス展開しています。 Contentfulの全体像 Contentful の基本
![[初心者向け]Contentfulの全体像・記事投稿の流れ・便利な機能をまとめてみた | DevelopersIO](https://cdn-ak-scissors.b.st-hatena.com/image/square/ea57ff72b375f8110786fdfce004a8904911e6ea/height=288;version=1;width=512/https%3A%2F%2Fd1tlzifd8jdoy4.cloudfront.net%2Fwp-content%2Fuploads%2F2022%2F12%2FUntitled6-3.png)
JAMstack な静的サイトジェネレーター（Static Site Generator）を試してみたかったので、雑記を書くためのサイトを作ってみました。（JAMstackってなによ？ という方はこちら） その名も「R note」。このブログ「Rriver」のノートという意味です。 R note – @rriverの雑記ノートです いまのところ、主にGatsbyJSを使ったサイト制作についてメモを書き残しています。あと、このブログでは書かないような小ネタとか、その瞬間思ったことを、勢いにまかせてちょこちょこメモっていこうと思います。 今回使ったJAMstackの構成 静的サイトジェネレーターもいろいろあるし、Headless CMSやデプロイ用のプラットフォームもたくさんあるみたいなんですが、今回採用したのは以下の3つです。 GatsbyJS Airtable Netlify この3つを組
GitベースのCMSとAPIベースのCMSの比較
JAMstack Advent Calendar 2019の11日目の記事です。 また、本記事は Git-based CMS vs. API-first CMS: Which Headless CMS Should You Choose? を翻訳したものです。 （提供元には事前に許可を得て掲載しています） ========== 世界中がクラウドにシフトしている中、CMSはおよそ20年間、古い技術・アーキテクチャのままでした。 しかもそれらは今でも動作しており、WordPressは全Webサイト中で34%のシェアがあります。 イノベーションとより良いデジタル体験の需要の高まりにより、モダンなフロンエンドツールは、より軽くて速くてセキュアなサイトを構築できるようになりました。 でもあなたのウェブサイトのコンテンツは依然として前のままですよね？ 是非ヘッドレスCMSの世界に足を踏み入れてみましょ
ベルリンの「Contentful」が1300万ドルを調達、最先端のプラットフォーム向けCMSの拡大目指す - BRIDGE（ブリッジ）テクノロジー＆スタートアップ情報
上: Contentful Image Credit: Paul Sawers / VentureBeat ドイツのスタートアップContentfulは、APIに焦点を当てたコンテンツ管理システム（CMS）によってオンラインコンテンツの未来を成長させることを目指している。同社は今回1,300万ドルの資金を調達した（編集部注：原文掲載5月26日）。Benchmark CapitalがリードしたこのラウンドにはTrinity Venturesや、既存の投資家であるBalderton Capital、Point Nine Capitalなどが参加した。 2011年にベルリンで設立され、現代的なマルチスクリーンの世界に向けてCMSを提供しているContentfulは、デスクトップやモバイルだけではなく、デジタルサイネージ、時計、スマートカーといった最先端のプラットフォームのニーズも満たしている。
2019/02/13 11:00 当ブログを構築するにあたってReact用静的サイトジェネレータのGatsbyJsを採用したので、技術構成やブログの構築手順、またブログ公開までのフローについて説明します。 GatsbyJsとは GatsbyJsは、React用に作られたモダンで高速なサイトを作成できる静的サイトジェネレータです。 GatsbyJsのサイトのトップページには Build modern, beautiful, secure, blazing fast, apps and websites with React. とGatsbyJsのコンセプトが書かれておりますが、その謳い文句どおりGatsbyJsで構築されたサイトは驚くほど高速にページが表示されます(GatsbyJsが使用されたサイト達)。 GatsbyJsの特徴 GatsbyJsの特徴を大きくまとめると テンプレートをRea
APIベースのヘッドレスCMS contentful + nuxt.jsを試してみた（contentful設定編）｜蓮田 健一 / hacomono CEO
APIベースのヘッドレスCMS「contentful」を試してみたので、その概要や設定の流れ、API利用の準備についてノートします。 contentfulとは？ドイツのスタートアップが開発したAPIベースのCMS。WordPressなどの従来型CMSではバックエンドとフロントエンドの両方を提供していましたが、contentfulでは管理サイトとそこで設定したデータ、いわゆるコンテンツをCRUDするAPIだけを提供しています。 バックエンドとフロントエンドを分離したこのようなCMSを「ヘッドレスCMS」と呼び、このcontentful以外にも「CosmicJS」「prismic.io」「GraphCMS」（GraphQLというAPIの問い合わせ言語を開発している会社が提供するCMS）などがあるようです。 APIベースだと何が良いのか？Webサイトだけでなく、スマートフォンアプリやサイネージな
GWひまだったのでNuxt.js+Contentful+netlifyを利用してブログをつくってみました。その過程でやったこと、地味に詰まったことに関する覚書です。 最終的に、かなりあっさりやりたかったことが実現できて驚いています。 ブログが欲しいけど広告入るのは嫌、WordPressはサーバが必要だしなんとなく荷が重い、という方におすすめです。 Contentfulに記事を作成 Nuxt.jsでWebサイトを作成 netlifyでビルド＆デプロイ(Bitbucket連携) Contentfulに記事を作成 Contentfulは、APIベースのCMS（コンテンツ管理システム）です。個人の小規模ブログなのでfreeプランで十分でした。 アカウント作成＆設定 「The beginner's guide to Contentful」を参考にまずは下準備。 Contentfulアカウント作成 ス
If you gave our new interactive getting started CLI guide a try you probably saw that the result is a universal JavaScript application that is capable of running Vue.js on the server side and in the browser. This means that you generate a whole set of static sites during build time and then if the user wants to navigate somewhere else the site will be partially rerendered using Vue.js. Pretty cool
オウンドメディアでも立ち上げたいなと思いまして、今だとCMS何がイケてるのかなーと調べてたらContentfulがイケてるのではと思ったので試してみます。 Contentfulは最近トレンドのheadless CMSというカテゴリのCMSで、コンテンツ管理画面はあるけど、コンテンツを表示する部分は含まれていなくて、APIでコンテンツデータを公開するもの。 フロントの自由度が高く、アプリにも使えるし、WEBにも使えるし、スマートにコンテンツ配信出来るわけ。逆に言うとWordpressのような従来のCMSに比べると、自分で表示部分を作り込まなければならないので大変手間がかかるのがデメリット。 Contentfulは無料プランで5,000レコードまでコンテンツを保存出来る模様。下記エントリでのざっくりとした目安では800記事くらいは書けるみたい。ありがた過ぎるやろ。 Contentful 料金
Gatsby has been getting a lot of recognition and adoption lately, and for good reason. It’s so flexible and it works well with nearly everything. If you’re on a tight budget and don’t want to sacrifice developer experience or cutting-edge deployments, I’ve landed on a favorite set of tools (Gatsby included, of course) for developing static sites that solves multiple problems at once. The use case
ポートフォリオサイトを作ろう！【第１回 Nuxt+Netlify で環境構築編】｜Koushi Kagawa
※この記事について 現在Nuxt+Netlify+Contentfulでポートフォリオサイトを構築しており、その連載記事となります。 連載記事はマガジンにまとめています。こちらをご覧ください。ポートフォリオサイト作成チャレンジ中です。最近はVueに興味があったのですが、 『Nuxt.js利用すると便利だよ』 と教えてもらったのでそれならばやってみようかなと思いNuxt+Netlifyでチャレンジしてみることにしました。 プロジェクトの作成まずはプロジェクトのフォルダを作成します。今回は『port』というフォルダを作りました。 vue init nuxt-community/starter-template port※上記「port」の部分はご自分のフォルダ名に変更してください。 すると、下記3点を聞かれます。 *Project name* *Project description* *Au
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session.
趣味をアウトプットするためにブログをはじめようと思い立ちまして、 せっかくなので最近勉強中のNuxt.jsを使用してブログを作成してみました！ 記事表示までの手順をまとめてみたので、参考にしていただければと思います！ <前編>ではNuxtプロジェクトの作成からContentfulのセットアップまで、 <後編>では記事の作成、Nuxtでの表示、Netlifyへのデプロイまでの手順をまとめてあります。 なお、この記事はこちらの動画を大いに参考にしています。 併せて参考にしていただければと思います。 Nuxtプロジェクトの作成 前提条件として、nuxtはインストール済みとします。 $ npx create-nuxt-app <project-name> nuxtで新しくプロジェクトを作成します。 設定はすべて初期設定のままです。 次に必要な物をインストールします。 $ cd <project-n
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
国産Headless CMS 「Micro CMS」を試してみた - Qiita
阿部寛を超えるための技術: はてなブログからNuxtに移行した話
Where content drives business momentum | Contentful
Rails + Contentful で LP のコーディングをゼロにする - pixiv inside
次世代Headless CMS「contentful」事始め - Qiita
イベントの情報サイトをPWAで作ってみた【Nuxt.js】 - Qiita
Nuxt.js + Tailwind CSS で爆速コーポレートサイト作成
Nuxt.jsとContentfulでブログ作ってみた - Qiita
Stackbit: The Visual Editor for Composable Websites
Gatsby.js + Contentful + Netlifyで作った爆速ブログ | CatNose
【Contentful】入門。Conentfulとは？導入方法・設定手順の解説 | FromsBlog
Gridsomeを試してみる - Qiita
Contentfulの料金と使い方を整理しつつ、Nuxt.jsと組み合わせてブログを作る - Qiita
GatsbyJS + Airtable + NetlifyでJAMstackな雑記サイトはじめました
React用静的サイトジェネレータのGatsbyJsでブログを構築した | #TSUKAMON
Nuxt.js+Contentful+Netlifyでブログをつくる - Qiita
Integrate Contentful with Nuxt.js
モダンなheadless CMS Contentfulを試してみる - もふもふ技術部
Gatsby + Contentful + Netlify (and Algolia) | Gatsby
GitHub - contentful/blog-in-5-minutes
Nuxt + Contentful + Netlifyでブログ作成全手順<前編>
Headless CMS を導入する · Issue #3 · vuejs-jp/vuefes-2019