表示部分がないヘッドレスCMS「microCMS」でサイトを作ってみた | ブログ | ウェビングスタジオ
2019-09-30追記 デモサイトの公開を終了しました。 microCMSで「画像のリサイズ」が可能になりました。また、boolean（チェックボック）フィールドが追加されました。 ASP型のヘッドレスCMS「microCMS」のベータテストが始まっています。 通常は月額8,500円が必要ですが、試用期間は無償で使い放題ということで、事前予約をしていました。 https://microcms.io/ 「ヘッドレスCMS」については後述しますが、これまでのCMSと概念が異なるため、使いどころが難しいです。実際にサイトを構築してみるしかないだろうと、コンセプトから考えてきっちり作ったので、体験レポートをします。 サンプルサイト 「動画投稿サイトから人気が出たブレイク直前の男性アーティスト」という、どこかで聞いたような人物のオフィシャルサイトです。 試用期間が終了する、2019年9月30日まで
【超初心者向け】「Micro CMS」のはじめ方。｜Koushi Kagawa
このnoteの対象者： - Headless CMSというのを聞いたことがある（あるいは勉強したい） - エンジニアではないので、専門用語難しい - 簡単にHeadless CMSの使い方を知りたい。 【注意】 このnoteの情報は古い可能性があります。正確なMicro CMSの情報は、Micro CMSの公式ドキュメントをご確認ください。 『Headless CMSとは？』『Micro CMSとは？』『Micro CMSの利用方法』- Headless CMSとは Headless CMSとは何か、Micro CMSの方が書いているこちらのブログがわかりやすかったです。 Micro CMSは日本語であることと、ある程度マニュアルがまとまっているので、ドキュメント確認していただければ基本的には理解できると思います。 ここからは、使っていて気になったり、私自身が止まってしまった箇所を細く入れ
microCMS + Gatsby + GitHub Actions + S3 でJamStackのチュートリアル | DevelopersIO
What is Jamstack? ここ数年でよく聞くようになったワード。 Jamstackとはウェブサイトを構築および運用するための、技術の組み合わせです。 JavaScript・API・事前にレンダリングされたMarkupの組み合わせでJamStackとのこと。 (以前はJAMStackといってたけど、最近はJamstackだったりする) Jamstackは、 「ウェブをより速く・より安全に・より簡単に拡張できるように設計されたアーキテクチャ」であり、 生産性を最大化するツールやフレームワーク、ライブラリやワークフローなどを 組み合わせて構築されるもの、とのことです。 ※jamstack.orgより 従来のCMSではアクセスがあったとき動的にページを生成しますが、 Jamstackではデプロイ以前に必要なページを生成します。 具体的には、下記。 Webサイトのフロントエンド全体(HTM
React + Netlify + microCMSを使ってイケてるポートフォリオを作った - Qiita
本記事でやること Reactを使ったフロントエンド開発を、今時のサービスを使って簡単に効率よくできる方法を紹介します。 また、ポートフォリオの設計に関してや実装から得られたナレッジ、知っておいたほうがいい実装方法を紹介します。 私のポートフォリオはNetlifyのサーバーに上げているので、実際の挙動などは https://ykonishi.tokyo から確認できます。 ちなみにポートフォリオのソースコードはGitHubにも上げているので、こちらも見ていただけたらと思います。 Yuichi Konishiポートフォリオサイトのソースコード Reactとは 最近はよくSPA（Single Page Application）という言葉をよく耳にしますが、そのSPAの一つがReactです。 特徴としては、データバインディング、仮想DOM、Componentの3つがあります。 詳細については各リン
microCMS + NuxtでJamstackブログを作ってみよう
以前、チャリティーカンファレンス沖縄 2020 vol.1 フロントエンド編で行なったmicroCMSワークショップの内容を記事にしました。 【ワークショップ情報】 「microCMS + NuxtでJamstackブログを作ってみよう」 チャリティーカンファレンス沖縄（オンライン）にて、ワークショップをやります。 Jamstack興味あるけどまだ試してみたことないという方、ぜひご参加ください💡https://t.co/GWtVClDQ3q — microCMS｜編集者も使いやすいヘッドレスCMS (@micro_cms) June 16, 2020 このワークショップでは、microCMSとNuxt.jsを組み合わせJamstackなブログを作成することができます。 当時の内容はNuxt v2.13に沿ったものでしたが、本記事では内容をアップデートし、v2.14にて説明を進めます。 1
国産Headless CMS 「Micro CMS」を試してみた - Qiita
Headless CMSとは Headless CMSは、Wordpressなどとは違って本体のウェブサイトと管理画面が完全に分離されているのが特徴の CMS(コンテンツマネジメントシステム) です。 これを使うと、フロントエンドとCMS側が分かれるのでそれぞれを別の場所に配置することが可能です。 動的なコンテンツを表示することをサーバーを持たずに行うことが可能になるのが魅力です。 Micro CMSとは Micro CMSは国産のHeadless CMSです。 これまでのHeadless CMSというと「Contentful」が主流な気がします。 Contentfulは日本のサービスではないので英語が基本になりますが、Micro CMSはデフォルトで日本語に対応していたり、日本語でのチャットサポートがあるのが良いと思いました。 使い方 登録 上記画面の「無料ではじめる」または「新規登録」
【CMS比較】NetlifyCMSからmicroCMSへ乗り換えたら幸せになった話
いきなりですが。 運営して間もないJAMstack構成な当ブログですが CMSをmicroCMSに乗り換えました！👏 （正確に言うとNetlifyCMSも併用していますが。笑） そこで今回、NetlifyCMSで感じた課題、microCMSの便利な点、microCMSでの課題など 観点ごとに思った事をまとめてみました。 HeadlessCMSを導入する際の参考になれば良いかなと思います！ まず、それぞれのCMSに関して簡単にまとめます。 NetlifyCMSとはNetlifyCMS（https://www.netlifycms.org/） アメリカのNetlify社が運営する静的ホスティングサービス、「Netlify」のひとつの機能として搭載されたCMSです。 設定ファイル(ymlファイル)一つで管理画面をカスタマイズする事ができ、非常に簡単に管理画面を構築できます。入稿した記事はGit
【JAMstack】Gatsby.js + microCMS + Netlifyで読んだ本のメモを記録するアプリを作った | Qrunch（クランチ）
先日、自分が読んだ本のメモを記録するためのアプリを作りました。 https://flamboyant-varahamihira-2505ee.netlify.app/ 今まで読んだ本のメモを Evernote、keepに残したりしてたんだけど、なんかしっくりこなかった。 なので、超簡易的だけど自分で作ってみた。 メモは徐々に追加していく。https://t.co/OYt0BxkM8p pic.twitter.com/Expm75QOIn — 大里匠@琉球インタラクティブ (@dolphinrokujiro) June 1, 2020 技術構成 Gatsby.js https://www.gatsbyjs.org/ Reactベースのフレームワークです。 これで、マークアップ、API連携、取得データの表示、静的ビルドなど、フロントエンドの実装をしています。 microCMS https://
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
初心者がJamstackなブログを作ってみる【Gatsby.js+microCMS+Bootstrap】（開発環境構築編）