LoginSignup
81
56

More than 5 years have passed since last update.

Trello のクローンを PHP で作りました

Last updated at Posted at 2017-01-25

機能は「カンバン」のみ

Trello は有名なトヨタの「カンバン」方式を利用できるウェブアプリです。
タスク管理として、有名な「JIRA」に似た機能を無償プランで使えるという面もあり、利用されている方も多いと思います。

「カンバン」の他に、Slackなどの他サービスと連携できたり、アドオンで機能強化したり、期限を決めたり、ボードを他ユーザと共有することができます。

自分的には「カンバン」さえ使えればよかったので、このアプリで利用できるのは「カンバン」だけです。

必要があれば、個々に好きなものを入れられるよう、基本となるものを作ったつもりです。
そのため、ライセンスは MIT にしてあります。ご自由にお使い下さい。

GitHub https://github.com/mikiakira/php-simple-kanban

alt

使っているもの

  • PHP 5.6+ (PDO is required)
  • Idirom ...PDOラッパーライブラリ
  • SQLite
  • Bootstrap 3.x
  • jQuery 2.x
  • jQuery UI 1.x
  • jQuery.spectrum ... 文中のURLをリンクにする
  • linkify-jquery ... カラーピッカー
  • Remodal.js ... モーダル

エックスサーバーで、Apache2 + PHP5.6.22 と 7.0.7 で動作確認しています(PHP7今回初めて使いました。早くてびっくりです!)

使い方

  • app.template.db をコピーして、app.db にリネームします。
  • config/define.php を開いて、パスワード(デフォルト: admin)を変更します。
  • 英語/日本語を config/define.php で切り替えられます。

const LANG = en; // ja or en

デフォルトを英語にしていますので、日本語で使いたい人は ja に変更して下さい。

以上です。

基本機能

  • ボード > パネル > カード の順番に属しています

  • ボード、パネルの作成は無制限

  • パネルは7つまで。「1週間」が表現できれば充分かな、と。(JSで制限しているだけなので、簡単に無制限にもできます)

  • ボードは名前順にリストに出ます(Trelloと同じ)

  • パネルは並び替えができます

  • カードは、パネルの中で並び替えができます

    • パネル間で相互に行き来できます
    • コメントが書けます
    • カラーラベルがつけられます
    • カードを別のボードのパネルに移動・複製できます
  • カードを対象にキーワード検索ができます(結果は最大100件まで表示します)

  • バックアップ機能があります

  • 画面はSPAです(データのやりとりは jQuery の Ajax で行ってます)

  • おまけ…「簡易画像表示機能」カードの件名に、画像の拡張子で終わる外部のURLパスを保存すると、その画像をカードの中で表示することができます

わざわざ作った動機

ウェブサービスは突然停止したり、買収されて改悪されたり、無償プランがなくなって有料になることがあります。
Trello が、JIRAや、Confluence で有名なアトラシアンに買収されたというニュースが入ってきたのが、自作にふみきった動機です。

エンタープライズソフトのAtlassianがプロジェクト管理サービスのTrelloを4億2500万ドルで買収

改悪されるかも知れないし、有料になるかも知れない。
Trello の今の形を、本当に気に入って使い込んでいたので、今後改変にひやひやしながら開発するくらいなら、自サーバでしっかり管理できるものを作ろう、と考えた訳です。

作ってみた感想

実際、カードやパネルの入れ替えは、jQuery UI のおかげで 1、2時間くらいで出来ました。
データベースのロジックは Idirom を基本に、自己ライブラリで実装しており、仕事の合間を縫ってトータルで実質4~5日で完了。
結果的に(予想通りに)、とてもシンプルに作れて満足しています。

終わりに

「カンバン」の可能性はさまざまです。
タスクはもちろん、詳細なブックマークリストとしても使えます。私はレシピをまとめるのにも使っています。

基本機能ができたところなので、キャッシュや gzip など突き詰める余地があります。

また、個人的には、これをベースにして RSS リーダなども作れそうだと考えています。
ちなみに、GitHub にこうしたまとまったリポジトリをあげるのは初めてです。
厳しいご意見が飛んでくるかもしれないと、覚悟しております。。

ご指導ご鞭撻のほど、よろしくお願いいたします。

追記(2017/01/30)

現在、エックスサーバー(X10プラン)で利用しています。
シングルページ・アプリケーションなので、最初のロードこそ 600~800ms ほどかかりますが、後はデータベースとのデータの送受信が主な処理なので、ライブアリの読み直しや遷移がない分、早いです。 

PHPは5.6以上を推奨します。
PHP7 に切り替えたところ、これが自分の作ったアプリかと、びっくりするくらい早くなりました! バージョン5の2倍以上という噂は本当でした。

SQLite を使うので、PHPだけが動くような、安価なロリポップ!レンタルサーバのライトプラン(月額100円)でも使えるのが強みかと思います。

JS 面ではまだ改善したいところです。結合したり、レンダリングを Vue.js に乗せ変えたら、もっと早くなるのは確実です。
とりあえず、Trello のカードを手作業ではありますが、すべてこちらにのせかえました。

個人的には「カンバン」で充分なので、チームで使う必要が生じないかぎり、もう Trello を使うことはないと思います。
使いながら、今後も改善を続けていきます。

※ 1/30: ボード一覧のドロップダウンメニューやパネルリストの表示枠の動作を改善しました。

81
56
6

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
81
56