こんにちは。ファガイです。
4/24にオンラインマークダウンエディタ「Markdown-F Editor」をリリース致しました！
この記事では、そのMarkdown-F Editorに関して紹介しようと思います。
Markdown-F Editorについて
Markdown-F Editorは、Markdownを書くために作られたWebアプリケーションです。(実際、コピー機能以外はオフラインで動きます。)
Markdownに関してはここでは割愛させていただきます。
詳しい形式は、Markdown – wikipediaを見ると良いです。
機能
基本的な入力、出力
ファイルの作成や、ローカルに存在するmdファイルの読み込み、Markdown-F Editorで作ったmdファイルのダウンロードが出来ます。
コードブロックに対応
Github等で使用されている`(バックスラッシュ)3つでのコードブロックの記述に対応しています。
一時保存に対応
HTML5のlocalStorageに対応しており、１文字でも入力すれば、その文字列はlocalStorageにtempとして保存されます。
そのため、万が一、ブラウザを閉じた場合も心配なく使用することが出来ます。
HTMLタグのクリップボードコピー機能
zClipというライブラリを使用しており、生成されるHTMLタグをクリップボードにコピーすることが出来ます。(なお、オフラインでは使用できない模様)
対応ブラウザ
対応ブラウザは以下となります。(自分が確認したもの)
- Google Chrome
- FireFox
- IE11 以上(localStorageは対応しておりません)
制作にかかった期間とか、使用技術等
構想自体は２週間ほど前に有りましたが、開発にかかった日数は１週間程度です。(HTML5 Japan Cupの自由課題として出したい所)
使用技術
今回作る上で使用した技術は以下です。
こんな所ですね。Compassは今回初めて使用しましたが、最初の設定で躓かなければ悪くないなと思いました。
使用したライブラリ等など
jQueryもライブラリと言ってしまえばそうなのですが。。。内部的に使用しているのは以下です。
最後に
このアプリを作ったものの、まだまだシステム的に改善すべき所が幾つかあるかと思います。
個人的には、マークダウンだけ見えるようにするとか、幅の比率を切り替えられるようにするとか。
あとはスクロールの追尾機能付けたいですね。あれはどうやって作るんでしょう。
ではではー。(要望等も待ってます)
コメント