かんたんなTODOアプリを作る(5回目)

自作webアプリ1 TODOアプリ

今回も今までと同じ仕様でTODOアプリを作成しました。
課題は「テストを書きながらコードを実装すること」
このくらいの簡単なアプリだとテストを書く部分がそもそも少ないと思いますが、とりあえずやってみました。

つまずいた部分

titleとdescription属性を持つTaskオブジェクトのeditをテストしたとき

 test "successful edit" do
  get edit_task_path(@task)
  assert_template 'tasks/edit'
  patch task_path(@task), params: { task: { title: "タスクタイトル変更",
                                            description: "変更しました" } }
                                        
  assert_equal @task.title, "タスクタイトル変更"
  assert_equal @task.description, "変更しました"
 end

これでテストを実行したところ、assert_equal @task.title, "タスクタイトル変更"が引っかかりました。

@task.reloadが抜けていましたね……
データベースから値を取得し直すメソッドで、Railsチュートリアルでも使いました。
　

気づいた点

  • コントローラーのテストはrails-controller-testingというgemをインストールしないと行えない
  • テスト駆動開発を行うには、アプリケーションにどのような機能を追加するのか（どんな動きをさせるのか）をしっかりと理解している必要がある
  • テストの書き方にはRSpecというものもあるらしい


今後の課題

  • 同じものをより早く作れるようになる
  • テストを書きながら作業を進める
  • git管理の方法のひとつ？であるgit-flow？を身につける
  • bootstrapを使ってみる
  • 機能の充実

かんたんなTODOアプリを作る(4回目)

自作webアプリ1 TODOアプリ

4回目はGitの基本操作の習得を課題としました。 今回もレイアウトと機能は発展させていません。

「最近はGitHub Flowを使うのが主流」というツイートを見かけたので、そのGitHub Flowの流れを実際にやってみました。もちろん1人で。


まずはアプリケーションの作成とリポジトリの作成

rails newでTodoAppというアプリケーションを作成したあと、アプリのディレクトリに移動
↓
git initでローカルリポジトリを作成
↓
git add . , git commit -m "first commit"でローカルリポジトリへコミット
↓
GitHubのサイト上でNew Repositoryをクリック
↓
git remote add origin ~~~~~~~~をコピーして、ターミナルに入力
↓
git push -u origin masterでリモートリポジトリへプッシュ

実際の開発業務でこの作業を行う機会があるのかどうかはわかりませんが、これで準備が整いました。

用途に合わせてたくさんのブランチを用意するGit Flowに比べて、GitHub Flowは完成版を置くmasterブランチと作業用ブランチの2つだけで運用するのでシンプルです。

では、ひとりGitHub Flowをやってみよう

リモートリポジトリにプッシュした時点ではmasterブランチにいるので、作業用ブランチを切る。（今回はTaskモデルを作成するので、"create-task-model"という名前にしました）
↓
作業用ブランチでTaskモデルの作成
↓
git statusで確認
↓
git add .
↓
git commit -m "create task model"でローカルリポジトリへコミット
↓
git push origin create-task-modelでリモートリポジトリへプッシュ
↓
GitHub上でプルリクエストを作成
↓
（本来は別の人にコードレビューしてもらってから行うところを）自分でプルリクエスト承認
↓
GitHub上でmasterブランチへmergeして、GitHub上の作業用ブランチを削除
↓
git chekout master
↓
★git pull --rebaseでリモートリポジトリの最新状態をローカルリポジトリに反映させる
↓
再び作業用ブランチを切って作業再開（以下くりかえし）


という流れです。

GitHub Flowのポイント

  • 作業用リポジトリを定期的にプッシュしてプルリクエストを作成
  • 他の開発者にコードレビューしてもらってプルリクエストを承認してもらう
  • 承認したらリモートリポジトリのmasterブランチへmerge

シンプルでわかりやすい……！


★のところですが、作業内容をmasterブランチへmerge済みなのはリモートリポジトリ上だけなので、ローカルリポジトリの方でもmasterブランチを最新の状態にする必要があります。
そのために★を実行してリモートリポジトリの最新状態をローカルリポジトリのmasterブランチに反映させる、ということです。
自分はここを理解するのに少し時間を使いました。
やはり実際に手を動かしてみるのが1番ですね！

今後の課題

  • 同じものをより早く作れるようになる
  • テストを書きながら作業を進める（今回もひとつも書いてない！）
  • git管理の方法のひとつ？であるgit-flow？を身につける
  • bootstrapを使ってみる
  • 機能の充実

アプリケーション（プロジェクト）の削除

Rails

rails newして作ったアプリケーションが多くなってきたので一度整理しよう！と思ったけど、各プロジェクトの削除って一番上のディレクトリを右クリック→deleteするだけでいいの……？と思ったので調べました。


削除するべきものは3つ！

①データベース

これはrails db:dropで削除できる。
ただ上記のコマンドで削除できるのはdevelopmentモードのデータベースのみなので、テスト環境や本番環境でもデータを作成している場合は

    rake db:drop RAILS_ENV=production 
    rake db:drop RAILS_ENV=test

というようにそれぞれの環境を指定する。


②bundle install した gem

これは、bundle installする際に

bundle install --path vendor/bundle

でパスを指定してプロジェクトのディレクトリ以下にインストールしておけば、プロジェクトの一番上のディレクトリを削除すると同時に削除できる。

ちなみにこのパス指定は一度行うとプロジェクト名/.bundle/configに設定が追記されるので、次からはbundle installのみで良い。


③アプリケーションのコード

これについてはrails newしたアプリケーションの名前がついたディレクトリ（要はプロジェクト）を削除すればOK


調べてよかった

開発環境そのものに関係してくるような操作はより注意が必要ですね。 おかしなことにならないように気をつけよう。

追記(2018.8.31)

②に関して

パスを指定してgemをインストールしているため、インストールしたgemの一覧を見たい場合は

$ bundle list

でvendor/bundleへ個別にインストールしたgemを確認することができる。

かんたんなTODOアプリを作る(2,3回目)

自作webアプリ1 TODOアプリ

前回作った最低限のTODOアプリを再度作成しました。簡素な機能とレイアウトはまったく同じです。


今回学んだこと

  • form_forヘルパーの仕組み（記事作成済み）
  • User.new(params[:task])でForbiddenAttributesErrorが出るのは、mass assignmentの脆弱性（チュートリアルで出たやつ）を防ぐ意図でそういう設計になってる
  • redirect_to 'tasks_path'という記述をすると504エラーになる
  • indexビューで使った <% @tasks.each do |task| %>を間違えて<%=にするとページが大変なことになる
  • DELETEリクエストを送信したいときはmethod: :deleteをオプションで指定する

  • ルーティングのas:は名前付きルーティングを可能にする。as: :taskと記述すると赤くハイライトされるのでわかりやすい

  • get '/tasks/:id/edit', to: 'tasks/edit', as: :edit
    というルーティングがある場合、コントローラの該当アクションで
    @task = Task.find(params[:id])
    という設定がされていれば、 (@task内にid情報が含まれているので）
    link_to '編集' edit_path(@task)
    でIDを指定することで呼び出せる

最初は3,4時間かかって作成してたんですけど、3回目は1時間で作成完了しました。
この'何度も同じTODOアプリを作る'という課題の目的にはプログラミング自体に慣れるのも含まれてはいますが、
1回ごとに自分で課題を設定し、細かく着実にステップアップしていくことです。


今後の課題

  • 同じものをより早く作れるようになる
  • テストを書きながら作業を進める（今回もひとつも書いてない！）
  • git管理の方法のひとつ？であるgit-flow？を身につける
  • bootstrapを使ってみる
  • 機能の充実

form_for(@user) のカッコの中身って一体なに？

自作webアプリ1 TODOアプリ Rails

form_forの使い方がいまいち分かってない。
form_for(@user)　の(@user)ってそもそも何を意味するんだ……と思ったので調べました。

結論 モデルオブジェクトである

form_forの引数にとるのは「モデルのオブジェクト」だということが分かりました。

Userコントローラのnewアクション内で

@user = User.new

と定義しているので、Users#newが描写された時点でUserモデルのオブジェクトが新規作成され、
「新規作成したUsersモデルのオブジェクトに、フォームで入力した内容を渡しますよ」という働きになるんですね。

form_forの送信先

ちなみに検索した記事に
「submitボタンをクリックした時の動作は、新規作成ならcreateアクションが、編集ならupdateアクションが呼び出される」
という記述があって混乱したんですが、これは

resourcesで供給されるRESTfulなルーティングでは、「～/users（リソース名）」にPOSTリクエストを送るとusers#createを参照する、という事になっているのでそういう書き方になるんだということが分かりました。

form_forという組み込み関数は

  • RESTfulなルーティングに則り、例えば「Userモデルのオブジェクト」が渡されたらURL「/users」にリクエストを渡す。
  • そのリクエストは、渡されたオブジェクトが「新規作成されたものだったらPOST、既存のものの編集だったらPATCH」になる

という動きをするように作られているんだな、ということで理解をしました。

～Railsチュートリアルの復習～

Railsチュートリアルでは未送信のユーザー登録フォームと送信直後のURLが異なっているという問題に

ルーティングを

get  '/signup',  to: 'users#new'
post '/signup',  to: 'users#create'

form_forのオプションに

form_for(@user, url: signup_path)

と記述することでURLを統一しました。このように

url: ○○_path

と記述することで送信先を意図的に変更することもできるんですね。ちなみに

method: patch

でHTTPリクエストの種類も変更することができます。

かんたんなTODOアプリを作る(1回目)

自作webアプリ1 TODOアプリ

Railsチュートリアルを終えてからはや5日、やっと最初の自作が完成しました。
はじめはUserモデルを作ってTaskと結びつけて……とか考えていたんですが、復習する箇所が多すぎてどうにも進まなかったです。
なので

とりあえずハードルを極限まで下げました

できたものはこんな感じです。

f:id:naito-coding0322:20180819142131p:plain

びっくりするほど最小限の機能です。
しかしこれで「ゼロからwebアプリケーションを作る」という目標は達成です。

今後はこのとても簡素なTODOアプリを繰り返し作ったり改良を加えながら、少しずつ技術と知識を身につけて行こうと思います。

今回できたこと

  • 実際に動くプログラムをゼロから作成できた
  • resources を使わずにひとつずつルーティングした

今後の課題

  • 同じものをより早く作れるようになる
  • テストを書きながら作業を進める（今回ひとつも書いてない！）
  • git管理の方法のひとつ？であるgit-flow？を身につける
  • bootstrapを使ってみる
  • 機能の充実

このブログの使い方

初学者こそ自分が勉強したことを記録していく「技術ブログ」を持っておくと良いと聞いたのでさっそく開設しました。

使い方

人に見てもらうものというよりは、自分のための学習記録という感じで使っていきます。学習中につまづいた部分なんかを自分の言葉で記録して理解を深めるのが狙いです。

Railsチュートリアルをやっているときに個人のブログがヒットして助かったことが何度かあったので、ゆくゆくは同じ状況の人を助けられればとも思います。さすがにQiitaに投稿はまだ気が引ける……。

なので、自己紹介はしません

自己紹介はしませんが、ここまでの学習記録を簡単に

2018年5月6日
まったくの未経験からprogateを開始。約1ヶ月かけてHTML&CSS、JavaScript、jQuery初級編、RubyとRails2周

6月7日
Railsチュートリアル開始。

7月
ログイン機構の部分で心が折れ、7月はプログラミングから遠ざかる

8月1日
1章からやり直す

8月14日
平均1日5時間ほどかけて1章ずつ丁寧に進め、チュートリアル完走

次はRuby/Railsを使ってwebアプリケーションを自作していきます。

時間がもったいない！

この記事を書き始めてもう1時間くらい立ってしまいました。
ブログを開設するとついはりきってしまいますが、目的はもちろんブログではなくプログラミングです。 ブログタイトルとかは10記事くらい書いたらまた考えようと思います。