【Railsでアプリ制作】足し算アプリ作ってみた

どせぜん

どうも、どせぜんです。

マスクの配送始まったみたいですね。布マスクの感染予防への効果は薄いかもみたいなのを見たんですが、どうなんでしょう。家にずっといて手洗いうがいしてたら関係ないですけどね。

見てくださいよこれ。4月15日なんて僕65歩しか歩いてないですもん。

まあ、歩いていようとなかろうとプログラミングはできる。ということで、SkillHacks10日目、やってきました。

今日はRailsで足し算アプリを作ってみました。

足し算アプリの開発(土台を作る)


やることは今までの復習なので、開発の流れをおさらいしました。

  1. アプリの雛形を作成
  2. コントローラの作成
  3. ルーティングの設定
  4. ビューの作成
  1. フォームの作成
  2. ルーティングを再設定
  3. コントローラを再設定
  4. デザインを当てる

という感じです。

やることは本当に今までやってきたことだけでできました。超簡単。

そして1〜5のステップを経て、できた物がこちら!!


現時点では、まだ足し算はされていなくて、ただ空いた枠に文字を入力できるってだけの状態です。

これを、入力された値が足し算されて出力される、という状態にまで持っていきます!!

足し算アプリの開発(足し算機能の付加とデザイン)


はい、というわけで足し算の機能を付加するためにフォームから送信されたデータを足し算しました。日本語下手だな。

フォームから送信されたデータの処理については、前回の記事でやったよね。

そして、数字を入力してボタンを押すだけで!!!



どん!!!!

足し算できました。


しかしこのままではちょっと見た目ダサいので、ボタンとかいじくっちゃいました。Bootstrap で。Bootstrapの使い方とかも前回の記事の使い方で、class指定するだけで行けました。簡単すぎるだろ。



あと、Bootstrapを使うために、JavascriptとかjQueryとかの設定をhtmlファイルに入れないと行けないんですが、Ruby on Rails には既に jQuery が入ってるらしいです。お前どこまで便利なんだ。


と、そんなこんなでできた最終形がこちら!!

数字ぶち込んで、青いボタン押すだけで、

はいどん!!!!


という感じで、とても簡単に足し算アプリ(見た目もこだわれる)ができました。制作時間10分くらいじゃないかな。


ここまでは、おみくじアプリや、足し算アプリなどの、ルーティング、コントローラ、ビューだけで動く物を作っていたのですが、次からはモデルを使って、しっかりとしたWebアプリを作っていくみたいです。楽しみ。楽しみい。


みなさん、コロナに負けず頑張りましょう。

それでは、また。


〜Skill Hacksが気になった方〜

-Skill Hacks- 動画で学ぶWebアプリ開発講座


〜迫さんは他にも色々やられてるみたいです〜

-Design Hacks- 今日から使える実践デザイン講座

-FrontHacks- フロントエンドプログラミング

-PHP Hacks- PHPプログラミング学習講座

-DietHacks- 現役パーソナルトレーナーのオンラインダイエット講座

-Instagram Hacks- 現役法人コンサルが教えるインスタ運用術

-Blog Hacks- 完全サポート付きブログ講座

-Movie Hacks- YouTubeに特化した動画編集講座