MarkDownエディタ SightEditを作りました(旧名NoteNinja)

未分類

小物ばっかり作ってきましたが、AI易占アプリ以来の中物アプリを作りました。AIで。

使用したAIはClaude 3.7 Sonnetです。他のAIと比べるとかなりマトモになりました。

でもね。JavaScriptコード文中で前に宣言したのと同じ変数を宣言していてエラーになっているのを見つけて、まだちょっと足りないなと。

やっぱりド素人がノーコードでアプリ作成するのは難しいです。私はある程度わかっているから直せましたが。

で、MarkDownでWYSIWYG(ウィジウィグ)編集がほしいなと思ったので、作らせました。外国にはあるんですが、日本語版が見当たらなかったので。

とりあえず、欲しい機能は搭載しました。改良してほしかったら、お問い合わせフォームにて要求するのだ、でないと子供の命はない(誘拐犯風)。

結構使い勝手良さそうな感じでできましたので使ってください。

たぶん、noteなどのサイトの下書きにいいと思います。note書きかけで時間が過ぎるとセッションが切れて書いた文章がパーになるんですよね。だからこっちで書いてコピペすると良いです。

仕様に追加しようとして断念したこと

・Google Driveに接続して編集する
→SSOとかそこらへんややこしすぎて断念。
・Wordのdocxファイルに対応する
→CDNがあることはあったが、バグっていて使えない。

→対策:Google Driveに手動でコピーし、Googleドキュメントで読み込む。ただし、docしか対応して無くて、docxはダメ。
CloudConvert: https://cloudconvert.com/md-to-docx
で、相互変換できるので利用する。

・gitでGUIでバージョン管理ができないかと思ったが、フロントエンドだけだとセキュリティ上ダメだとわかったので断念。

MarkDownエディタ NoteNinja

名前は「NoteNinja」と言います。

NoteNinja

デスクトップアプリ化しました

Electron は、GitHub 社が開発したソフトウェアフレームワークです。

HTML、CSS、JavaScript のような Web 技術を利用して、Windows、macOS、Linux で動作するデスクトップアプリケーションをつくることができます。

だそうで、全くElectronを知らなかった私にも二時間くらいでデスクトップアプリ(Windows、Linux対応)ができました。まあ、多少は修正しましたが。

Vectorにも登録し公開してます。
https://www.vector.co.jp/soft/winnt/writing/se527473.html

Macは持ってないので対応しません。嫌いなので予定もないです。

NoteNinja1.0.0は
C:\Users\ユーザ名\AppData\Local\Programs\noteninja
にインストールされていましたが、中のアンインストーラーを実行して削除してください。

ver.1.1版(2025/06/26)をベクターに上げてます。1週間から10日の審査の後に公開されます。自分で使ってていくつか不具合や不足分に気付いたものを対応しました。

NoteNinja1.1は以下にインストールされるので、上記アンインストーラーで古いのを削除し、.mdの関連付けを下記にしてください。
C:\Program Files (x86)\NoteNinja

なお、webアプリの方はやる気がしないので見送り。だって、ディスクトップアプリだとファイルダブルクリックで起動するから楽なので。

 2025/06/30

「NoteNinja」で検索したら同名のアプリやサイトが出てきたので「SightEdit」に変更しました。

Microsoftからメモ帳がMarkDown対応になると発表されたけど、最低限の機能しか無い。

ver.1.2.0 2025/07/08

バグフィックス

貼り付けが1回だけで無く2,3回も貼り付けられる。

機能変更

書式メニューが右クリックで出るようになっていたが、既存のアプリの同じように上部にメニューアイコンを並べる形に変更。
文章編集部分とアプリの間に大きい隙間があったのを削除。
右クリックで出るメニューをブラウザで表示されるもの準拠に(検索や日本語翻訳も追加)

改めて作り直す

とりあえず、作っていってほぼ機能を実装したところで、「書式解除」をつけることにしました。面倒なので後回しにしてました。

で、改めてClaudeに作らせると上手くいかない。私が推測するにWYSIWYG編集なので、書式を消すために範囲指定した場合、テキストだけが対象になり、書式の記号が対象外となってしまう。なので、結構大変な処理になることが分かりました。

そして、既存のMarkDownエディタがソースと表示画面の2画面になってる理由が理解できました。皆、書式解除で詰まってそういう仕様に変更したのでしょう。

さて、ClaudeをMAXプランにグレードアップしても使用制限が掛かったので、その間にGeminiにこの要件でシンプルに解決する方を教えてくださいとお願いしたところ、

TipTapProseMirrorといった高機能なWYSIWYGエディタライブラリを導入するのが、最も堅牢で拡張性の高い解決策です。

という回答が。そうなの? 最初からそれ使えば良かったじゃん。でも、ライブラリを使用するのはプログラマとしては当たり前ので、事前に調べて置くべきでした。AIに任せすぎでした。

はい、結局、また最初から作り直します。でも、旧SightEditのコードから要件定義書を生成して、それ使ってAIに作らせるのでまあ、いいかな?

はい、最新版(2025/07/15)のSightEdit Setup 2.0.0.exeが出来ました。このリンクダウンロードしてちょ。ベクターにも出すけど1,2週間遅れます。

それからwebアプリ版のSightEditは削除しました。利用者が増えるごとにサーバー負荷が大きくなって、使用量が増え料金が嵩んでしまい、有料化することになってしまうので。webアプリ、ちょっと使うのは便利なんですけどね。

2025/07/16

バグ修正
テーブルの表示で背景色がおかしかったので修正。
PDF出力が1ページだけだったのを全ページ出力で、ツールバーアイコンの出力除外。

2025/07/19

ファイル保存でバグがあったので修正。ソース画面でも検索・置換できるようにした。

SightEdit Setup 2.0.1.exe

コメント

タイトルとURLをコピーしました