Nwht0xn1

2016-09-23 r7kamura 掲示板開発日誌Created on 2016-09-24 by r7kamura

昨日からつくっている掲示板の実装を進めた。

トップページ

下図はトップページ。UIは仮のもので、後から適当なものに差し替える予定。板やし木でできそうやし茶色やろ、という雑な発想でとりあえず茶色になった。コミュニティごとに何種類かにテーマを切り替えられるようにしようと思っている。今のところ、amakanとWikiHubの見た目をパクってきているが、CSSは全部手で書いている。動作確認はiPhoneでやってるので意外とiPhoneでまともに動く。

image

ユーザページ

これはユーザページ。

image

トピックページ

これはトピックページの下部。HTMLはすべてサーバサイドでReact.jsを使って描画しているので、いいねボタンとかコメントの投稿とかの実装が非常にやりやすい。画面下部を注視すると、トピック購読用のボタンと、スパム報告用のボタンと、ブックマーク用のボタンが付いてる。けど実装はしてない。

image

コミュニティ

2chで例えると、このmetaというコミュニティが板にあたる概念。つまりこれはmeta板。コミュニティごとにサブドメインが割り当てられる。アカウントはコミュニティごとに別々につくることになる。アカウントをコミュニティごとに分けたのは、コミュニティごとに別々の人格を使いたい場合が多いこと (普段はインターネットネームとアニメアイコンだけど会社は実名と顔写真アイコンを使うとか)、コミュニティごとに認証方法が違うこと (普段はTwitterで認証するけど会社ではLDAPで認証するとか)、コミュニティごとに貢献度を貯めて権限を獲得していく設計であることが理由。

トピックとコメント

トピックというのはスレッドのことで、コメントというのはレスのこと。トピックはブックマークできる。スレッドにはいいねを付けられる。上図の画面の左側には、r7kamuraがつくったトピック、r7kamuraの付けたコメント、r7kamuraがブックマークしたトピック、r7kamuraがいいねを付けたコメントなどへの導線がある。

上図の右側にはr7kamuraがつくったトピックが2件表示されている。5時間前と7時間前につくられたっぽい。それぞれコメントが1件と10件付いていることが分かる。緑色になってるのは、自分がこのトピックにコメントを付けましたよという印。ハートマークはいいねを表していて、このトピック内のコメント達に合計0件あるいは3件のいいねが付けられていることが分かる。赤くなっているのは、自分がいいねを付けましたよという印。この表示はわりと便利 (だけどSQL的には最適化しないと結構しんどいことになる)。

カテゴリ

上部に「トピック」「カテゴリ」「メンバー」みたいなボタンが付いてて、カテゴリという概念が存在していることが分かる。トピックは1つのカテゴリに属すことができる。サブカテゴリみたいなものは存在しない。カテゴリごとに閲覧権限と書込権限を設けるつもりである。ちなみにカテゴリに関する機能はまだ一切実装されておらず、上のカテゴリボタンは押しても何も起こらない。権限モデルを構築する必要があるので、これからカテゴリとグループとロールのモデルを作成して色々やる必要がある。