markdown対応の簡易CMS 作成、無料ブログを公開する。 IndexedDB + Vue CLI 編集機能 #Vue.js #IndexedDB #Vue-cli #javascript

■ 概要:

前の IndexedDB + Vue等の、抵コスト構成機能の関係となり
簡易的なCMS作成で。編集機能となります。

・今回の構成は、CMS 編集機能と、
　公開サイトを 別ドメインに設置した場合となります

・ブラウザ内 IndexedDBデータの エクスポート、インポート機能で
jsonファイル経由で、 別ＰＣや、外出先ＰＣのブラウザにインポートできます。

・CMS表示機能の説明は、別の記事に記載しております

■ 参考のページ

CMS 表示機能の記事です

■ 環境

Chrome 83
Vue CLI
dexie : 3.0.1
vue: 2.6.1
vue-router
SinglePageApplication / SPA
Progressive Web Apps / PWA

■　デモURL
https://cms3edit-kuc.netlify.app/#/edit

■　画面

・詳細、プレビュー確認

・編集、MD形式で。入力可能です

・リスト
　右上に、エクスポート。公開サイトに jsonファイルをアップロードします
　(又はデプロイ等)
　インポートは、別ＰＣ等にデータを。コピーできます

■ デモのページ

　マガジン内の、デモ紹介ページで。URL記載しております

・Update : 2020/07/17
アップデートの関係で、CMS編集のURL変更となりました。

■ 続きの内容

Github のコードURL
画面のURLリンク、Vue components