LoginSignup
1
3

More than 5 years have passed since last update.

sinatraでメモアプリ ( without DB )

Posted at

ruby初学者がsinatraを使ってのwebアプリを作るまでの経緯をメモ。
制作途中のコードが残しておかなかったので、(gitも使ってなかった)最終的な制作物のコードしかない。

制作課題

fjordbootcampでの学習課題としてはsinatraを使ったメモアプリをつくる。

-制作条件-
追加はPOSTメソッド、編集はPATCHメソッド、削除はDELETEメソッドで実装すること。
データはファイルに保存すること。(DBを使わないこと)

制作物

制作過程

Step1 sinatraの学習&雛形になるアプリの作成

sinatraについて、簡単に学びながら、メモアプリの雛形として、下記サイトの簡易BBSアプリを制作

sinatra入門
https://qiita.com/kimioka0/items/751e460cbb59c70379c6

step2 viewテンプレートとルーティングの作成

制作したBBSアプリからメモアプリに変えるために必要なルーティングの修正とテンプレートの作成

主なテンプレートファイル
layout.erb
index.erb --- toppage(メモの一覧)
create.erb --- 新規メモ作成ページ
memo_details.erb --- メモの詳細ページ
edit.erb --- メモ編集ページ

step3 編集の処理を追加

先のbbsアプリではテキストの追加と削除のみしかできなかったので、メモの編集ができるようにするための処理をかく。

ここまででできれば、cssさえ整えればメモアプリ自体は完成。
ここからは、DBからjsonファイルに変更する作業へ。

step4 データをファイル保存のためのコード修正

DBではなくデータの保存・読み取りをファイルで行わないといけないという条件
これは結構大変だった。
そもそも、ファイルへの書き込みを行うのをどうやって行うかコードのイメージがわかなかったし、どんなファイル形式にすればいいかでも悩んだ。

パッと考えて、.txt, .csv, .jsonが浮かんだ。
.txtはなんかすごく大変なことになることがわかったので、候補からまずはずし、
(配列とか、区切り等を識別させるコードを書くのがなんかめんどいことになりそうだったため。)csvはofficeソフトがなんか好きじゃないから避けて、プログラマーに一番なじまれていて、rubyでも読み取りも書き込みも簡単にできそうということでjsonファイルを選んだ。

下記サイト(他にも見たけどメモし忘れた)等を参考にしてjsonの扱い方を学習

Rubyでハッシュの要素を更新・追加・削除する
https://uxmilk.jp/43303
https://uxmilk.jp/21132
RubyでJSON形式のデータを取得し、パースした結果を表示する
https://qiita.com/nishina555/items/48cfc3eb80a78cbe51b9

jsonファイルを先に下記のように書いた。

{
    "memos":[
        {"id":"10","title":"memo1","body":"test memo"},
        {"id":"11","title":"memo2","body":"test memo2"},
        {"id":"12","title":"memo 3","body":"test memo3 yeah!"}
    ]
}

そののち、jsonファイルの読み込みから表示をまず実装し、その後、追加、変更、削除を実装(コードの書き換え)を行った。

step4 リファクタリング

メソッド化できるものはメソッド化、グローバル変数にできるものはグローバル変数に対応といったようにコードの可読性をあげられるようにした。

感想

今回はDBを使わないことが一番大変に感じられた。DBを使っていた際は一行ですんだ処理もファイルへの読み書きを行うのに調べて、書いて動作を確認するという作業がなんども出てきた。
今回の課題によってrubyでのjsonの扱いを一番に学べたと思う。

また、今回はクラスを使うことをしなかったが、次の課題からはクラスを積極的に使うようにしていきたいと思う。

1
3
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
3