/realworld_docker

Primary LanguageShell

構築手順

$ bin/setup
$ docker-compose build
$ docker-compose run --rm backend bin/setup
$ docker-compose up -d
$ open http://localhost:4100

課題

1. Topにお知らせ追加する

  • backend
    • GET /api/notifications を受け付けるようにする
    • レスポンスのフォーマットは {"notifications":[{"id":1,"notification":"XXXXX"},{"id":2,"notification":"YYYYY"}]}
    • ログインしなくてもアクセス可能
  • frontend
    • トップページのメインビジュアルっぽい緑の領域の下部(.bannerの下部)にbackendで追加したAPIのお知らせ情報を表示する
<!-- タグ構造のサンプル -->
<ul>
  <li>お知らせ1</li>
  <li>お知らせ2</li>
</ul>

2. 関心のあるタグのFeed一覧を追加する

やりたいことは次の２つ

  • ユーザーは関心のあるタグを登録/削除できる
  • ユーザーは関心のあるタグのArticleの一覧を見れる

画面イメージ もう少し詳しい仕様や挙動。

  • /@usernameのページにNewsArticlesタブを追加する

  • NewsArticlesタブをクリックすると/@username/newsを表示する

  • /@username/newsの内容

    • NewsArticlesタブを選択状態にする
    • 左側にタグの一覧を表示する
    • 右側に選択したタグのArticleの一覧を表示する

  • 未選択のタグを選択する

    • user_tagsにレコードを登録するリクエストを発行する
    • タグを選択状態に色を変更する
    • 選択したタグの一覧を含んだArticleの一覧を表示する

  • 選択済みのタグを選択する

    • user_tagsにレコードを削除するリクエストを発行する
    • タグを未選択状態に色を変更する
    • 選択したタグの一覧を含んだArticleの一覧を表示する

  • backend

    • POST /api/user_tags
      • ユーザーの関心のあるタグを追加する
    • DELETE /api/user_tags/:id
      • ユーザーの関心のあるタグを削除する
    • GET /api/articles/news
      • 関心のあるタグのニュースの一覧を取得する

3. RailsでScaffoldするアプリをAPI + SPAで作る

  • ログイン機能つきの日記アプリを作る
    • 基本的な機能は日記のCRUD
    • アカウント登録、ログイン、ログアウト機能
    • ユーザーの画像アップロード機能
  • APIはRailsの最新版
  • SPAは好きなものを使う