はじめに
勉強した Elixir,Phoenixと、余ったRaspberry piで何か作ろうと、ブラウザでファイルにタグ付けできるファイルマネージャを作ってみました。（完璧とはいえないけど…
勉強用で、保守予定はないですが、いじってもらったりで、何かの参考になったらとです。
環境
Ubuntu (lsコマンドが使える)
Elixir,Phoenix環境
apache2 (xampp)
※apacheで公開した画像のurlで画像を表示してます。
※詳しい使い方はリポジトリのread me に書いています。
想定してる使用
Lan内でサーバーを公開し、個人利用。
紹介
サイトマップ
メイン機能
| 階層の移動 | 画像、動画の閲覧 |
|---|---|
 |
 |
| LiveViewによるspa |
| ファイル、フォルダの選択 | タグの付け替え |
|---|---|
 |
 |
| 一覧表示の切り替え | タグの検索（or検索のみ） |
|---|---|
 |
 |
| プロパティ、タグの追加、編集 | レスポンシブ対応 |
|---|---|
 |
 |
DB設計
・/AAA/AA/a.jpg を登録すると AAA -> AA -> a.jpg というリレーションの３つのデータになります。
その後、/AAA/AA/b.jpg を登録すると、AAのidをparent_idに持った b.jpg だけ生成されます
（フォルダ移動時にそれ以下のデータも移動させたり、検索を速くしたかった）
こだわりポイント
・プロパティごとにタグをまとめて表示すること
・サイドメニューを開いた状態で、階層を移動できること（状態管理）
・タグの機能をうまくUIに落とし込めたところ PC、モバイル
・ディレクトリトラバーサル対策（urlから直接ディレクトリに飛べるため）
実装できていない機能
・ファイル操作（ファイル移動時、DBのデータも一緒に移動させる）
・フォルダのサムネイル
・タグの and検索、not検索
・タグの並び替え機能
・空のDBデータを、自動で削除する機能
・縮小表示用サムネイル自動作成機能
・ログイン機能
・もっとリッチなデザインを
（多いな…）
感想
最初は、１カ月で技術を検証、設計して、２カ月で完成させようと思ってたのですが、揉みに揉まれて３カ月かかってしまった。
自分なりに結構頑張ったつもりだけど、改めて見るとちょっと地味かも…
でも、初めて一人で長丁場の開発で、翻訳しながら英語のドキュメントを漁ったり、他人のソースを読んだりしたのでそういう耐性がついた気がするし、結構思いつきでやったわりにはできて、課題も見えたけど自信にもなった。
windowsのエクスプローラーだと、フォルダにはタグ付けできなかったり、フォルダ内の一番最初の画像をサムネにできなかったり、不満があったのでブラウザで端末問わずできるものをと思ったのですが、作っていくうちに必要な機能がどんどん増えていって、本当はもっと機能を実装したかったけれど、さらに時間がかかってしまうので、いったん切り上げました。
（機能が増えてくと自分の箱庭がにぎやかになっていく感じで楽しいよね）
ちなみに、フォルダにタグ付けできるアプリで、dbを使ったTablacus Explorerと、jsonを使ったTagSpacesがあったりします。