2018-10-26に更新

Twitterを作る 第5回 フォロー

引き続き他のユーザーをフォローする部分を進める。

モデル

class Follow(models.Model):
    """フォロー"""
    user = models.ForeignKey(User, verbose_name='ユーザー', related_name='follows')
    target = models.ForeignKey(User, verbose_name='フォローユーザー', related_name='followers')
    created = models.DateTimeField(auto_now_add=True)

モデル定義はこれだけ。
view側ではこれの一覧をjsonで返したり、
あとは追加削除するだけで特筆することもない。

フォローボタン

ボタンはコンポーネント化し、画面のどこに配置しても同じように動作するようにする。
今回も実際に画面右のおすすめユーザーの一覧に表示したものと、
そこのユーザー名をクリックして他ユーザーのプロフィール画面に表示されるものは同じもの。

<MainFollowButton
    user={this.props.user}
    follows={this.props.follows}
    onFollowsUpdated={this.props.onFollowsUpdated}
    />

userでターゲットユーザーを指定。
followsは現在のフォロー一覧配列で、
ボタンを押して追加、削除するとこの配列から新たな配列を作り、
onFollowsUpdatedコールバックを呼び出して親にsetStateしてもらうことで適切に画面上が更新される。

自分のタイムラインの修正

フォロー機能ができたので、自分のタイムラインにはフォローしている人の投稿も表示する必要がある。
取得するPostのfilterをユーザー指定からin指定に変更するだけ。

今後

  • 検索(MeCabで解析したワードやハッシュタグで検索)
  • ユーザープロフィールの変更
  • 非ログイン状態でもアクセスできる箇所の調整
  • OAuth導入によるAPIの作成
  • 切りが良いので一旦休載

Dumitter

https://alphabrend.sakura.ne.jp/dumitter/

ツイッターでシェア
みんなに共有、忘れないようにメモ

view_list [連載] Twitterを作る
第1回 Twitterを作る 第1回 概要
第2回 Twitterを作る 第2回 認証
第3回 Twitterを作る 第3回 投稿
第4回 Twitterを作る 第4回 コンポーネント構成考察
第5回 Twitterを作る 第5回 フォロー

だら@Crieit開発者

Crieitの開発者です。 Webエンジニアです(在宅)。大体10年ちょい。 記事でわかりにくいところがあればDMで質問していただくか、案件発注してください。 業務依頼、同業種の方からのコンタクトなどお気軽にご連絡ください。 業務経験有:PHP, MySQL, Laravel, React, Flutter, Vue.js, Node, RoR 趣味:Elixir, Phoenix, Nuxt, Express, GCP, AWS等色々 PHPフレームワークちいたんの作者

Crieitは誰でも投稿できるサービスです。 是非記事の投稿をお願いします。どんな軽い内容でも投稿できます。

また、「こんな記事が読みたいけど見つからない!」という方は是非記事投稿リクエストボードへ!

有料記事を販売できるようになりました!

こじんまりと作業ログやメモ、進捗を書き残しておきたい方はボード機能をご利用ください。
ボードとは?

コメント