シェアしたくなる最新のWebサービス・ITニュース情報をチェック!
  • follow us in feedly

アプギガトップ > Webサービス > ブログ感覚でWebアプリやサイトの更新履歴を作成&公開できる「Barelog」を使ってみた!
注目記事ピックアップ
匿名もOK!SkypeでWebコードエディタを共有できる「Interviews on Skype」が無償公開中!
share0
匿名もOK!SkypeでWebコードエディタを共有できる「Interviews on Skype」が無償公開中!
1枚の写真だけで超リアルな3D顔面をWeb上で高速生成できる「3D Face Reconstruction」を使ってみた!
share0
1枚の写真だけで超リアルな3D顔面をWeb上で高速生成できる「3D Face Reconstruction」を使ってみた!
開発が面倒なWebコンテンツを「ウィジェット化」して誰でも利用可能にする無料サービス「Widgetic」を使ってみた!
share0
開発が面倒なWebコンテンツを「ウィジェット化」して誰でも利用可能にする無料サービス「Widgetic」を使ってみた!
スクショ付きでブックマークを一元管理できるWebアプリ「Bookmark OS」を使ってみた!
share0
スクショ付きでブックマークを一元管理できるWebアプリ「Bookmark OS」を使ってみた!
スマホのタッチ操作に最適化されたWebアンケートが作れるサービス「Wyzerr」を使ってみた!
share0
スマホのタッチ操作に最適化されたWebアンケートが作れるサービス「Wyzerr」を使ってみた!
JavaScriptの学習にオススメなWebコードエディタ「Carbide」の万能すぎる可視化ウィジェットがヤバイ!
share0
JavaScriptの学習にオススメなWebコードエディタ「Carbide」の万能すぎる可視化ウィジェットがヤバイ!
「アプギガ!!」2016年の総まとめ!もう一度読みたくなる人気のバズ記事をまとめてみた!
share0
「アプギガ!!」2016年の総まとめ!もう一度読みたくなる人気のバズ記事をまとめてみた!
ブログ感覚でWebアプリやサイトの更新履歴を作成&公開できる「Barelog」を使ってみた!
share0
ブログ感覚でWebアプリやサイトの更新履歴を作成&公開できる「Barelog」を使ってみた!
データ可視化の最強ツール!Web上でスライド資料やインフォグラフィックを制作できる万能Webエディタ「Visme」を使ってみた!
share0
データ可視化の最強ツール!Web上でスライド資料やインフォグラフィックを制作できる万能Webエディタ「Visme」を使ってみた!
有名WebサービスのAPIをすべて同じ書き方でプログラミング可能な「RapidAPI」は、検索・テストもブラウザ上で実行可能!
share0
有名WebサービスのAPIをすべて同じ書き方でプログラミング可能な「RapidAPI」は、検索・テストもブラウザ上で実行可能!
登録不要!匿名で記事も公開できる究極にシンプルなWebエディタ「IO」が最高の使い心地だった!
share0
登録不要!匿名で記事も公開できる究極にシンプルなWebエディタ「IO」が最高の使い心地だった!
筆跡がリアルに変化する「自作Webフォント」を生成可能な「Calligraphr」で自分用フォントを手書きしてみた!
share0
筆跡がリアルに変化する「自作Webフォント」を生成可能な「Calligraphr」で自分用フォントを手書きしてみた!
編集ソフト不要!アップロードした画像のURLをいじるだけで多彩な加工編集を実現する「Scaley.io」が登録不要で無料公開中!
share0
編集ソフト不要!アップロードした画像のURLをいじるだけで多彩な加工編集を実現する「Scaley.io」が登録不要で無料公開中!
ブログ感覚でオンラインのプログラミング講座を作成・公開できる「educative」は課金機能も無料で利用可能!
share0
ブログ感覚でオンラインのプログラミング講座を作成・公開できる「educative」は課金機能も無料で利用可能!
Web上でプログラミングに特化したスクリーンキャストを無料で作れる「Scrimba」の革命的な機能がスゴイと話題に!
share0
Web上でプログラミングに特化したスクリーンキャストを無料で作れる「Scrimba」の革命的な機能がスゴイと話題に!
まだ進化を続けるGoogle検索の特殊機能12選をまとめてみた!
share0
まだ進化を続けるGoogle検索の特殊機能12選をまとめてみた!
今すぐブラウザ上に「ライブ配信」のスタジオ環境をタダで構築できる「Lightstream」を使ってみた!
share0
今すぐブラウザ上に「ライブ配信」のスタジオ環境をタダで構築できる「Lightstream」を使ってみた!
エアフォースワンの内部もVR空間に!Web上であらゆる場所を歩き回れる「Matterport 3D Gallery」の没入感がスゴイ!
share0
エアフォースワンの内部もVR空間に!Web上であらゆる場所を歩き回れる「Matterport 3D Gallery」の没入感がスゴイ!
こんなAR技術が欲しかった!スマホをかざすだけでプロ並みのスケッチを描ける「SketchAR」アプリを使ってみた!
share0
こんなAR技術が欲しかった!スマホをかざすだけでプロ並みのスケッチを描ける「SketchAR」アプリを使ってみた!
英語で「VR空間作って」と書くだけで、本当にWeb上でVR体験が実現する「GuriVR」を使ってみた!
share0
英語で「VR空間作って」と書くだけで、本当にWeb上でVR体験が実現する「GuriVR」を使ってみた!
Webサービス
ad 今の年収で満足ですか?
typeで転職した71%が年収アップ!
2017/07/18 18:40

ブログ感覚でWebアプリやサイトの更新履歴を作成&公開できる「Barelog」を使ってみた!

barelog-01
どうも、まさとらん(@0310lan)です!

今回は、Webアプリやサイト/ブログなどにおいて、機能改善や内容の変更などを記録した「更新履歴」を超シンプルに作成できるサービスのご紹介です!

生成されたコードを貼り付けるだけで、ブログ感覚で書いた「更新履歴」が自動的にWebページに反映されるようになるので便利ですよ。

【 Barelog 】

barelog-02

「Barelog」の使い方!

それでは、実際に「Barelog」を使いながらどのようなサービスなのかを見ていきましょう!


まずは、サイトのトップページにあるボタンをクリックして無料の「ユーザー登録」をサクッと済ませておきます。
barelog-03 メルアドがあれば、誰でも簡単に登録を済ませることができます。


すると、自分の「管理画面」が表示されます。
barelog-04 この画面上で、更新履歴をブログのように記録していくことが出来るのが面白いところです。

デフォルトでは、英語の履歴が1つ用意されているので、コレを編集してみましょう!


画面右側にある「EDIT」ボタンをクリックします。
barelog-05

すると、更新履歴の中身を編集できるようになります!
barelog-06 編集できる項目は以下のとおり!


①履歴のタイトル
②履歴のカテゴリ(Bug Fix, New, Upcomingなど)
③更新内容
④公開・非公開の設定



上記内容を踏まえて、履歴を更新できたら「Update」ボタンをクリックしておきましょう!


しっかりと反映されたのが分かりますね。
barelog-07 このように、簡単な操作で初めての「更新履歴」を1つ作成することができました。

次に、作成した更新履歴を自分のWebアプリやサイトに組み込んでみましょう!


「更新履歴」をWebページ組み込もう!

今度は、自分のWebサイトに作成した更新履歴が表示されるようにしてみましょう。

画面上部のタブから「Setup」を選択しプレビューを表示します。
barelog-08 画面右側に、「更新履歴」がWebに表示された時のプレビューが表示されているのが分かります。

画面左側で、タイトルの変更やスタイルなどをカスタマイズできるので、好みのデザインにしてみましょう。


そして、さらに画面を下方向へ移動するとソースコードが表示されているのが分かります。
barelog-09 この2つのコードをコピーしておきましょう。


そして、自分のWebサイトのHTMLに、先ほどコピーしたコードを貼り付けます!
barelog-10 このコード例では、「aタグ」のリンクをクリックすると更新履歴が表示される仕組みになっています。


実際にブラウザで表示してみるとこうなります!
barelog-11 見事に、作成した履歴が表示できているのが分かりますね。


ポイントは、「aタグ」の「id属性名」とscript内のオプションにある「trigger名」を一致させることです。

これさえクリアしていればどのHTML要素でも利用できるので、例えばメニューに組み込んでクリックすると「更新履歴」が表示されるような使い方も出来ますね!
barelog-12

さらに、オプションも豊富に揃っており、タイムライン形式にして任意のカラースタイルで表示するとこんな感じになります!
barelog-13 JavaScriptのオプションに関しては、他にもポップアップ表示のアニメーションを変更したり、幅や高さの調整やオフセット位置なども細かく設定できるようになっているので便利です。


まとめ

今回ご紹介した「Barelog」は、まだベータ版なので今後さらに機能追加などが行われる予定です。

導入もコードをコピペするだけなので非常に簡単なうえ、履歴の更新作業もエディタ上で文章を書くだけで済むのは便利です。

今なら無料で利用できるので、気になった方はぜひ一度トライしてみてください!


<参考>
「Barelog」公式サイト


written by まさとらん(@0310lan

まさとらん

国内外問わず「良いモノ」だけひたすら集めて情報共有してます。
厳選ネタはアプギガ内で分かりやすく情報発信中!
その他の旬なネタは、twitterにて発信してますので、お気軽にどうぞ!

twitter:0310lan

この記事を読んでいる人は、他にこんな記事も読んでいます。
Related Posts Plugin for WordPress, Blogger...

ページトップへ戻る