Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
Help us understand the problem. What is going on with this article?

Railsで基本情報技術者試験の過去問題サイトを作る(5:API編)

More than 1 year has passed since last update.

はじめに

ゆる〜く学ぶ。みんなのWeb勉強コミュニティー。 「にゅ〜ぶる会」を運用中です。
https://newburu.github.io/

そこで、何か教育用のコンテンツが欲しいなぁ〜と思い立ち、今回の企画をスタートしました!

Railsで基本情報技術者試験の過去問題サイトを作ります!

最終目標

  • 問題・回答の登録は、Scaffoldで簡易でOK
  • APIを用意して、ランダムに問題を抽出する機能を追加する
  • TwitterBOT、LINEBOT、SlackBOTが出来たら良いな

履歴

1:構築編
  https://qiita.com/newburu/items/ed59f47ac645b19620f6
2:日本語化(i18n)編
  https://qiita.com/newburu/items/4f12fdb61bf6cd601545
3:親子関係、登録編
  https://qiita.com/newburu/items/f2a20289be5ec1fc1b77
4:親子関係、参照編
  https://qiita.com/newburu/items/51b11bd02691efc2cc0d
5:API編
  本ページ
6:SlackBOT編
  https://qiita.com/newburu/items/aeeb9acb453da786bd59
7:Herokuデプロイ〜自動化編
  https://qiita.com/newburu/items/0a8bb02e1e8c8fe737c7

今回やる事

  • 登録された問題を返すAPIを作ります

APIを作ります

1. gem 'jbuilder'を追加します。

JSONを戻すAPIにするため、JSON用のGEMを追加します。

./Gemfile
gem 'jbuilder', '~> 2.5'

2. APIの口を作ります

routes.rbに、以下を追加します。

config/routes.rb
  # API用(JSONを返すため、formatを指定する)
  namespace :api, { format: 'json' } do
    namespace :v1 do # APIのため、バージョンを意識して作る
      get 'questions/:id', to: 'questions#show'
    end
  end

3. API用のコントローラーを追加します。

API用、V1用と分けているため、ディレクトリもそれに合わせて階層を作成します。

app/controllers/api/v1/questions_controller.rb
class Api::V1::QuestionsController < ApplicationController

  def show
    @question = Question.find(params[:id])
  end

end

4. ViewでJSONを返す様に設定します。

app/views/api/v1/questions/show.json.jbuilder
json.data do
  json.question @question, :category1, :category2, :category3, :msg
  json.answers do
    json.array! @question.answers, :msg, :correct
  end
end

jbuilderの使い方は、こちらあたりを参照にしたら良いかと思います。
https://qiita.com/ryouzi/items/06cb0d4aa7b6527b3645

5. 確認します。

まずは、画面から確認します。

http://localhost:3000/questions/1」にアクセスします。

問題参照画面

API用のURLにアクセスします。

http://localhost:3000/api/v1/questions/1」にアクセスします。
※最後の1は、idです。

こんな感じの文字列が表示されればOKです!

レスポンス結果
{"data":{"question":{"category1":"あ","category2":"い","category3":"う","msg":"え"},"answers":[{"msg":"お","correct":true},{"msg":"か","correct":false}]}}

今回はここまで

ありがとうございました!
次回は、ランダム取得用のAPIを追加して、問題集APIっぽくするよ!

newburu
座右の銘は「晴笑雨笑」🔸駆け出しエンジニアさんの力になりたい。無料で楽しく!勉強/質問コミュニティを運用中(http://newburu.github.io)🔸自分のペースでゆっくりでも勉強したい方、ご連絡ください。ご協力します!
https://newburu.com
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away