週刊とっしーぱんち

昭和生まれのブロガーが綴る、全力脱力系雑記帳

はてなブログにWebサイトを移植した話【趣味でつくるWebサイト】

おはよーございます。

以前こちらの記事で紹介したパスワードを作るWebサイトをはてなブログ内に移植できないかな?と思いたちまして実際にやってみた話です。

はてなブログ上で、簡単なWebサイトを作ってみたい!という方や、ブログ記事に少し動きをつけたい!といった方向けに多少は役立てるかな?と思いまして、移植作業の方法を紹介します。

ひとつ注意点として、はてなブログProの機能を利用していますので、無料版で動かない可能性があります。

まず、前提として今回の移植に使用したサイトの主な要素は以下の通りです。

  • Bootstrap
  • Vue.js
  • Webサイト本体はGitHubPagesにアップ済み。

これらの要素を踏まえつつ以下のような作業を行いました。

はてなブログに記事を作る

まず、はてなブログに記事を追加します。今回はTOPページの記事一覧に出てくるのが嫌だったので固定ページにしてみました。

ページを作る際の注意点としてHTMLモードで作成するのがポイントになります。

記事の内容は、元のサイトにあるHTMLからコピペしてきました。具体的にはこのページにある以下をまるごとコピペします。

<div class="container-fluid d-flex align-items-center justify-content-center" id="easy_pass">
中略
</div>

コピペした状態で一旦ページを保存します。このままだとまだ動かないので各種設定をしていきます。

BootStrapとVue.jsを設定する。

BootStrapとVue.jsを読み込めていない状態なので、はてなブログのダッシュボードメニューから、設定⇨詳細設定と進み、「head要素にメタデータを追加」の欄に以下を追加します。

<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>

これを保存してさきほど作成したページに戻ると、ボタンがBootStrapのボタンデザインに変わっていると思います。ここまでくればあともう一歩です。

JSファイルの読み込み追加

最後に独自に追加したJavaScriptファイルの読み込み設定を追加します。作成したページを再び開き、ページ末尾に以下を追加します。

<script src="https://pages.osio-tosimasa.com/js/easy_password_maker.js"></script>
<script src="https://pages.osio-tosimasa.com/js/vue_app.js"></script>

もともとのWebサイトにはこのように書かれているのですが

<script src="js/easy_password_maker.js"></script>
<script src="js/vue_app.js"></script>

はてなブログから参照することになるので、GitHubPagesですてに公開しているURLを先頭にくっつけました。

表示と動作を確認してみる

以上が移植作業になります。せっかくなので少しだけ見た目を変更しまして、できあがったページがこちらです。

osio-toshimasa.hatenablog.com

僕の環境は動いているのですが、うまく表示されていますでしょうか?

もしよければ、動いているよーとか感想いただければ嬉しいです😊

余談ですが、ここにきて無理矢理かえる君を登場させた感が溢れ出てしまいました。久々というかまだ1回しか登場してなかったので緊急登板です 笑

まとめ

今回は、はてなブログへの移植作業について解説してみました。今までやってきたことに少しプラスするだけで、比較的かんたんに移植することができたなあというところがあります。ひとつひとつは大したことないものばかりなんですけど、パーツを組み合わせていくと面白い発見や付加価値が生まれてくるのが楽しいです。

ここで紹介した個々のパーツ作りに関しては、以下の記事で紹介しています。こちらの記事もぜひ併せて読んでみてくださいー。

osio-toshimasa.hatenablog.com

osio-toshimasa.hatenablog.com

osio-toshimasa.hatenablog.com

【趣味でたのしむRuby】車輪の再発明と自作の悦びと

おはよーございます。

いままでは、Rails製自作APIサーバとの動作テストにcurlというコマンドを使っていたのですが。

osio-toshimasa.hatenablog.com

osio-toshimasa.hatenablog.com

今回、これの代わりになるものとしてRubyで実装してみました。ソースコードはGitHubにて公開しています。

github.com

標準添付ライブラリのみで作っているので、Rubyプログラム単体としても使えます。Railsの機能も使っていないのでコピペで持ってくることもできます。 もちろんRailsのなかでも使えると思いますが、試してないのでやや自信なしです。

ちなみにこの手のやつ既にあるんじゃないの?と思ってRubyGemsで探したら、そのまんまHttpClientというのがありました。

こういうのを「車輪の再発明」と呼びまして、わざわざ時間と労力をかけて同じような機能を作るなんて、とても効率が悪くて無駄なことだ!と否定的な意味合いで使われます。

たしかに!

けど、否!

既に作られているものを改めて作り直すことで得られるもの、あると思います!

たとえばこんな感じ。

  • 自作することでもともとの仕組みを理解できる。
  • 自作しているので、都合のいいように改良、拡張できる。
  • 中身を把握しているので、改造しやすい。
  • 自分のコード資産として残る。
  • 既に作ったものがあるので、見比べながら動作チェックできる。
  • なにより自分で作ったのものを動かすのが楽しい。

なんだかんだ最後が一番大事にしています。趣味でプログラミングしてるのが大きいので、楽しいがないと続かないですから。

なのでこれからも車輪の再発明しまくりです 笑

では、また!

【趣味でたのしむRuby】RailsアプリケーションをHerokuを使って動かしてみる。

こんにちはー。

以前作ったRails製のWebアプリケーションをサーバに置いて動かしてみた話です。

結論からいうと、今回はHerokuというサービスを使って稼働させてみました。

理由云々なんかはそれなりにあったりもしますが、それはまた別の機会に書くとしまして、やったことを簡単に振り返ってみたいと思います。

Herokuとは?

サーバ構築やメンテナンス不要で、作ったアプリケーションを置くだけで済んじゃう便利サービスです。キャンプで例えるならば、テントも食糧もあらかじめ用意してあるグランピングみたいなもんですね。ちなみにキャンプまともにしたことありません。

今回は無料で作れるFreeというので試しています。

というか、何もせずとも最初はFreeが選ばれるようです。いきなりお金取られるわけじゃないので安心ですね。


追記:2022年11月28日で無料プランが廃止されるとのことです。これから登録される方、すでに登録済みの方はご注意を。

どうやって作る?

実際の工程はこんな感じです。Railsアプリケーションはすでに作っていて、GitHubにソースコードをコミットしているのでHerokuにどうこうする作業だけに絞っています。

Herokuアカウントを作る。

公式サイトからアカウントを新規登録します。

jp.heroku.com

Heroku スターターガイドに沿って作業をすすめる。

Herokuサイト内にスタータガイドというのがあります。前に作ったRailsアプリがバージョン7系なので、こちらを参考にしました。

devcenter.heroku.com

基本的に手順どおり進めればうまくいくのですが、自分のPC環境によるものでうまくいかなかったり、アプリケーションの設定をHeroku用に少しだけいじったりする必要があるので、簡単にまとめておきました。同じくハマった人いたら参考になれば幸いです。

作業を行なったPC情報は以下の通りです。

MacBook Pro 2020 

%sw_vers
  ProductName:  macOS
  ProductVersion:   12.5
  BuildVersion: 21G72

%ruby -v
  ruby 3.0.0rc1 (2020-12-20 master 8680ae9cbd) [x86_64-darwin20]

Heroku CLIのインストールでつまづく

手順の最初の方で、HerokuCLIをインストールするのですが、

devcenter.heroku.com

% brew tap heroku/brew && brew install heroku

を実行したら、こんなエラーがでたので

Error: Your Command Line Tools are too outdated.
Update them from Software Update in System Preferences or run:
  softwareupdate --all --install --force

If that doesn't show you any updates, run:
  sudo rm -rf /Library/Developer/CommandLineTools
  sudo xcode-select --install
% softwareupdate --all --install --force

をしても最新版で何も更新されず。エラーは解消されませんでした。

 %sudo rm -rf /Library/Developer/CommandLineTools
 %sudo xcode-select --install

こちらを実行したら無事動きました。※インストール時間長い(数十分)ので、お茶しながら気長に待ちましょう。

pg gem の追加は無視してはいけない。

最初、データベース使ってないからと手順すっとばしたのですが、そのあとの以下のコマンドで華麗に失敗しました。

%git push heroku main

そのためにgem 'pg'を追加するのですが、自分のPCでbundle updateが失敗するという悲しみが発生。MacBookさんにpostgresqlをインストールして解消しました。

# これを、自分のPCにインストールしておきましょう。
% brew install postgresql
% psql --version
psql (PostgreSQL) 14.4

これで、無事git push heroku mainが成功して、APIサーバが起動しました!

動作確認はheroku openで作ったアプリのURLを確認したあとにcurlコマンドでチェックしました。

% curl -X POST -H "Content-Type: application/json" -d '{"id":1, "value": 3}' ${HerokuサーバのURL}/match
{"value":3,"id":1}

サーバ上のログでも確認してみます。

%heroku logs -n 100

とやると、ずらずらーっとログが出てくるのですが、

2022-08-12T12:54:09.095074+00:00 app[web.1]: {"value":3,"id":1}

ってな感じでログが出力されていることを確認しました。地味に気をつけたい点としては、時刻表示がUTCという世界標準時刻なので日本時間にする場合は+9時間してあげる感じですね。この辺も設定変えられるらしいのですが、今回はこのままにしています。

まとめ「いま楽しいこと」に集中!

というわけで、無事Railsアプリケーションをサーバで動作させるところまでができました。

これ試す前に、自前のサーバでもちょこっとやってみてから、Herokuに変えたのですが、かなり作業が簡略化できて感動しました。めんど臭さに根負けして、いきなりやる気無くなってしまうのも勿体無いので、楽にできるところはとことん楽しちゃってしまって、「今自分が楽しいと思うことに集中する」のを大切にしていきたいと改めて思いました。ちなみに自前でサーバ構築もそれはそれで楽しいですよ😀なんというか、自分の拠点を作ってる感じがして、それこそキャンプ感ありますね。なおキャンプは・・以下略。

では、また!

最近Swiftにも触れてみたい欲がでてきた話

こんにちはー。

突然ですが、プログラミング言語って何種類ぐらいあるかご存知でしょうか?

僕は知りません。知らんのかい!ということで調べてみるとざっくり200種類ぐらいあるそうです。すごい数!

そんな数あるプログラミング言語の中でも日本発祥のプログラミング言語「Ruby」を推している僕なのですが、最近「Swift」という言語も気になっています。

一体どんな言語なんですかということで早速やほーで調べてみましたのでご紹介したいと思います。話逸れますが、ナイツさん好きです。

Swiftとは?

「スウィフト」と発音するそうです。Appleさんが開発したプログラミング言語で2014年に誕生しました。

ちなみにRubyは1995年、JavaScriptも同じ1995年生まれともう30年近く経ちますが、Swiftはまだ10年も満たないので比較的新しめのプログラミング言語ですね。

www.apple.com

何が作れるの?

今回調べていて一番惹かれるところがこの点で、主にiPhone、iPad、Mac、AppleWatchといたApple製品用のアプリを開発することができます。

以前に、Rubyでもスマホアプリ作れるのか?と思って調べてみたのですが、あるにはあったけど有料であったり開発が止まっていたりと道が険しい印象だったので、それならばSwift覚えるのが素直かなっていうことで今に至ります。

アプリ開発だけではなく、Windowsアプリが作れたり、Linuxサーバ上でも動いたり、RubyOnRailsのようなフレームワークも登場していたりということで、アプリケーションを作れる幅がどんどん広がっていっているようです。とはいえ餅は餅屋という言葉にもある通り、Apple製のアプリ開発を作るのが鉄板のように思います。

特徴は?

比較的新しめのプログラミング言語ということで、歴代のプログラミング言語のいいところをいい感じに取り入れているのが特徴のようです。まだ実際にうごかしておらず、ドキュメントをざざーっと斜め読みしただけなんですけど、文法がどことなくRubyっぽいので、案外とっつきやすいのかもしれないです。

Rubyとの違いでいうと、Swiftは静的型付け言語なので、書いたコードがそのまま動くわけではなくて、コンパイルというアプリを作る作業をしてから動かす感じになります。つまり、コード書く。コンパイルする。動かす。といった感じで手数は増えてしまうのですが、その分プログラムの実行速度が早いので、複雑でたくさんの処理をするようなものはSwiftのが良いのかもしれません。逆にRubyは動かしながら、コードを素早く修正できる点がよいので、いい感じの棲み分けはできそうですね。

どうやって開発するの?

おもにMacを使うことを想定しているようで、XcodeというこれまたAppleさんが提供している無料ソフトを使って開発できるようです。Swift自体を学ぶのであれば、Swift PlayGroundsというアプリをインストールするとゲーム感覚で楽しくプログラミングを勉強できるようです。こちらはiPadでも利用できるのだとか。

こういうグラフィカルで手軽に動かせるプログラミング環境が提供されているのって素晴らしいですね。プログラミング教材としても優秀なのかもしれません。

2020年から、Windowsでも開発することが可能になったようですが、餅は・・以下略。

まとめ いつの日かアプリを作りたくなったときのために

今現在で、こんなアプリを作りたい!という意欲があるわけではないので、Swiftを実際に学ぶのはもう少し先になるとは思いますが、iPhone使ってるし、MacBookさんも使っているというせっかくの機会なので、今進めているRubyまわりのお遊びがひと段落したらSwiftを使ってしょうもないものづくりをしていきたいなあなんて夢想しています。こうやって書くとRubyがおろそかになる印象あるんですけど、好きなものって変わるというより増えるものってのがモットーなので、うまく共存しながら作っていけたら最高ですよね。

それでは、また!

㊗️読者数25人達成してました!そしてはじめて販売実績つきました!

おはよーございます。

当ブログの読者数が25人達成です🎉

登録してくれた皆様、ありがとうございます😆

改めてこのブログを紹介すると、基本好き勝手書いていて話題が飛び飛びなんですが、基本的には

「趣味を中心にライフログ的な感覚でブログを書く」

ということを意識して書いています。

そんなわけで、時系列で書いているのが基本ではあるんですけど、Rubyの記事だったりは時系列的な影響をあまり受けなかったりするので、ある程度記事本数が揃ってきたら、まとめサイト的なページ作れたら見やすくなるかなあとか思っています。最初から目次とか考えて計画的に作るのも考えたんですが、「趣味でたのしむ」を燃料に動いたり書いたりしているので、まずはやりたいことを先にやって、まとめるのは後で、みたいな戦法でいきたいです。あまり真面目に考えるとすぐ脳みそがダウンしてしまうので、ほどほどの脱力感(?)を大切にしていきます😊

そして話変わりますが、

ついに

なんと!

Amazonアソシエイトの販売実績がはじめて1件つきました!!!!!

買ってくれた方、ありがとうございます😭

Amazonアソシエイトのサイトで確認したときに、リアルに「まじかよ」と呟いてしまいました。それぐらいの感動。文字では伝えきれない感動です。

残り77日以内にあと2件の実績が必要なので、引き続きよろしくお願いします。

osio-toshimasa.hatenablog.com

osio-toshimasa.hatenablog.com

osio-toshimasa.hatenablog.com

書籍に関しては、ただいまAmazonKindle本の夏のセール開催中(8/11まで)なので、記事で紹介している本以外でも気になるものが見つかるかもですね。いや、見つかってくれ(必死)

それでは、また!

【2022-2023シーズン】 サッカーを配信しているサービスを調べた話

おはよーございます。

昔からサッカー観戦を趣味にしていたのですが、コロナ禍に入ってスタジアムにしばらく足を運べてなかったり、仕事が忙しくて見る時間なかったりと、りいろんな要素が重なって、ここ数年はぱたりと見ることを辞めてしまっていました。今年はカタールW杯が開催されますし、サッカー観戦欲が湧いてきてもいるので、改めて今のサッカー配信サービスを調べてみることにしました。僕と同じく、サッカー関連のサブスク加入を検討してる方の参考になれば幸いです。

※2022年8月3日時点の情報なので、多少情報が変わっている場合もあると思います。実際加入する際は、各サービスの公式サイトで詳細を確認してみてください。

イングランド「プレミアリーグ」

今や世界最高峰のリーグとなったプレミアリーグは、豊富な資金力で豪華絢爛な選手と監督を揃えています。BIG6と言われる上位6チームはもちろん、中位、下位チームにも代表選手がごろごろいて、クラブチームの層の厚さがとてつもないです。

まずは、冨安選手が所属するアーセナル戦が無料で見れるABEMAは見ておきたいですね。プレミアム会員(月額960円)に入ると年間114試合が見れるとのこと。毎節で平均化するとアーセナル戦に加えて2、3試合が見れる感じでしょうか。

漏らすことなくプレミアリーグをしっかり堪能したいという方には全試合配信のSPOTV NOW(月額1,300円)に加入するのがよさそうです。

スペイン「ラ・リーガ」

日本人選手の所属は少ないですが、今季からレアルマドリーからレアルソシエダに完全移籍した久保選手、二部リーグでは柴崎選手も所属しているスペインリーグ、プレミアリーグと比べても遜色ないほどのレベルの高いリーグです。

スペインリーグが観れるのはWOWOWDAZNの2択で、WOWOWだと2部リーグの試合も放送され、DAZNだとスペイン国内のカップ戦が放送されるという特徴があるようです。ううむ、迷う。

ドイツ「ブンデスリーガ」

長谷部選手、鎌田選手が所属するフランクフルト。吉田選手が加入したシャルケ。リーグのデュエル王、遠藤選手が所属するシュツットガルドなどなど、日本人選手が数多く在籍するブンデスリーガを見る場合は、スカパー!への加入が必要です。サッカーセットは月額2,480円で日本の天皇杯、ルヴァンカップも合わせて見れるのですが、ブンデスリーガだけ見たい場合はブンデスリーガLIVEに加入して月額980円ににしたほうがお財布に優しいですね。

イタリア「セリエA」

僕の世代だと世界最高峰のリーグといえばセリエAでしたが、今は欧州で4番目か5番目くらいの地位でしょうか。今季の日本人所属選手はいないので、少し追いかけづらいところもありますが、個人的にはモウリーニョ監督率いるローマに注目していて、今季からは、ライバルチームのユベントスからディバラ選手というエースを獲得したので優勝争いにも加わっていきそうな勢いを感じます。セリエAを見る場合はDAZNへの加入が必要です。

フランス「リーグ・アン」

今季のフランスリーグはアツいです。リバプールからモナコへ移籍した南野選手。ベルギーリーグからスタッドフランスに移籍した伊藤純也選手。昇格チームトゥールーズを牽引したオナイウ選手など日本人選手たちの活躍に期待しつつ、ムバッペ、ネイマール、メッシ擁するスーパーチームPSGをどこが止めるのか。個人的にはフランスリーグを年間通して追いかけたことがないということもあって、興味津々なリーグです。今季はDAZNで配信されます。

チャンピオンズリーグ・ヨーロッパリーグ

欧州最高峰の舞台、UEFAチャンピオンズリーグとヨーロッパリーグが観れるのは、今季独占契約をしているWOWOWだけでした。日本人選手の出場でいうと、チャンピオンズリーグではさきほど紹介したドイツのフランクフルトにいる長谷部選手と鎌田選手に加えて、ポルトガルリーグの強豪スポルティングリスボンに移籍した守田選手、セルティックの古橋選手、前田選手、旗手選手、井手口選手。予備予選からではありますが、フランスのモナコにいる南野選手と、久々に日本人選手が多く出場するシーズンではないでしょうか。ヨーロッパリーグだとアーセナルの冨安選手、レアルソシエダの久保選手は優勝も争える好チームなので期待大ですね。

日本「Jリーグ」

世界でJリーグを最も過小評価しているのが日本人なのではないかと言われるぐらい、年々着実にレベルアップをし続けているJリーグ。

上位、下位チームの大まかな括りはありますが、実力差は小さいので、どのチームも優勝する可能性があり、どのチームも降格することもありうるという面白いサッカーリーグです。J1,J2,J3のリーグ戦はDAZNが配信しています。すでにシーズンに入っていて中盤から終盤にかけての優勝争いや、降格・昇格争いも白熱した試合が楽しめそうです。

さて、どれにしよう??

ラ・リーガ、Jリーグ、フランスリーグ、ベルギーリーグなど種類豊富なDAZN プレミアリーグのSPOTV ブンデスリーガのスカパー! ラ・リーガとチャンピオンズリーグのWOWOW

悩んだ結果、こんな折衷案を考えてみました。

11月まではDAZN

今年はW杯の関係でJリーグのシーズン終了日が11月5日と早いので、11月まではJリーグを中心に観戦し、時間あればフランスリーグの日本人選手も追いかけたいですね。今までは推しチームの横浜FMばかり見ていたのですが、J2やJ3の試合もピックアップして見てみたいとか色々見たい欲が一番高いです。

12月からはWOWOW

チャンピオンズリーグやラ・リーガの状況次第で、12月からはWOWOWに切り替えるか。もしくは一旦サブスク全部やめるかって感じですかね。1ヶ月無料期間があるのでとりあえず入ってみてから決めるのでもいいかなあという気持ちでもあります。

こんな感じです。みなさんは見たいリーグ見つかりましたでしょうか?同じようにサッカー配信を探している方の参考になれば幸いです。

では、また!

【残り83日】Amazonアソシエイト祭り!おすすめ書籍「雑学・啓蒙本」編 〜Kindleセール中〜

こんにちはー。

ふたたび、Amazonアソシエイト祭開催中でございます。そうです、販売実績欲しがり男です。

今回は雑学・啓蒙本の紹介となります。引き続き自分が読んで良書だ!と呼べるものしか紹介してないですし、ただいまAmazonKindleセール開催中なので、気になるものありましたら是非読んでみてください。

Googleで必要なことはみんなソニーが教えてくれた

昔SONYが好きで買った本です。製品のかっこよさとか所有欲を満たしてくれる感覚を初めて体験できたのはソニーの製品群たちでした。 この本ではVAIOやスゴ録といった製品開発に携わった方が著書であり、その当時のソニーがどんな風であったか、そしてどう変わっていったのかが描かれています。Appleのスティーブ・ジョブスさんが心酔した、自由闊達にして愉快なる理想工場ソニーの一端を垣間見ることができます。

さおだけ屋はなぜ潰れないのか?

「たーけやー、さおだけー」という声とともに、ご近所をぐるぐる周回してまわる謎のトラック。今じゃすっかり見かけないのですが、僕が子供の頃に何度かみかけたあの車の秘密が暴かれるのか!と気になって買った本です。

さおだけやの秘密も解き明かされるのですが、さおだけ屋以外でも、なぜか潰れないレストランとか身近にある不思議を切り口にビジネスのからくりを教えてくれるので、面白く読み進めることができます。

今だとコミック版もあったり

Kindle Unlimitedにて無料で購読することもできます。

ユダヤ人富豪の教え

経済価値や喜びを与えた人間が豊かになる。お金を稼ぐという考え方、自由人と不自由人とは?お金を使うのは感謝と愛情の気持ち。ユダヤ人富豪家のゲラーさんが解く本当のお金持ちとはどういうものか。単なるお金稼ぎ本ではなく、人生においてお金とどう向き合っていくかを学ぶことができます。主人公はこのゲラーさんを通して多くを学び、やがて成功していくのですが、この二人の友情や、絆の物語にもなっていて、お金にまつわる本なのに泣けてくる本です。

夢をかなえるゾウ

さきほど紹介したユダヤ人富豪のはお金とその生き方についてですが、こちらの本は人生をどう生きるか?ということに対してにより重点を置いた物語です。インドの神様ガネーシャがこてこての関西弁で、平凡なサラリーマンの主人公に人生の生き方を面白おかしく説いていきます。こちらも最後はどこか切なく心温まるストーリーになっていて読み物としても最後まで楽しめる内容です。

この本もKindle Unlimitedで無料購読することもできます。

さらに、 Audibleというサービスで、聴く読書もできます。

まとめ

雑学・啓蒙編、いかがでしたでしょうか?

お金や仕事関連は生きていく上では欠かすことのできない要素で、20代後半ぐらいから、この手の本をちょこちょこ買い始めていたように思います。色々読んでみると洋の東西、時代の新旧かかわらず、書き手の想いとその共通点が見えてきたりして面白かったです。

というか、今回紹介がてら軽く読み直してみたりしたのですが、面白くていつの間にか読書に没頭していました。以前買った本を時間を置いて読み返してみる、という行為自体が楽しかったので、ぜひぜひ試してみてほしいですね。もちろん、気になる本あったら買っていただけたら嬉しいです!

では、また!

osio-toshimasa.hatenablog.com

osio-toshimasa.hatenablog.com

【趣味でたのしむRuby】RubMineさんとRailsで初歩的なAPIサーバを作った話 その3 HTTPPOST編

こんにちはー。

前回のGET編に続いてPOST編です。

Controllerにメソッドを追加する。

今回はcreateメソッドを追加しました。こんな感じ。

  def create
    entry = OpenStruct.new({ :value => params[:value], :id => params[:id] })

    # MemoryStoreにSaveされていれば取り出す。
    entry_json = Rails.cache.fetch("/match/#{params[:id]}", expired_in: 1.hour) do
      # 一度もSaveされていない場合は、ここの値がSaveされる
      JSON.generate(entry.to_h)
    end

    puts entry_json

    # Json文字列をOpenStructに変換する。
    result = JSON.parse(entry_json, object_class: OpenStruct)

    # OpenStructそのまま渡すと{"table":{"value":1,"id":1}}というで返却される。
    # tableの部分が余計に感じたのでto_hでハッシュにして返却すると{"value":1,"id":1}のようになる。
    render json: result.to_h

  end

いろいろごちゃごちゃやってますけど、前回のGET編と同じくなんやかんやでJSONで返しています。

POSTを送る

今回はブラウザ開くだけではテストできないので、POSTを送るものを別で用意しました。

ターミナルから以下を実行しました。今回はcurlというコマンドを使って試してみました。RubyMineからもHTTPPOSTできたのかも。

curl -X POST -H "Content-Type: application/json" -d '{"id":1, "value": 3}'  http://127.0.0.1:3000/match/

そうすると、こんな感じでデータが表示されました。

{"value":3,"id":1}

Rails使うとAPIサーバが簡単に作れる

最初の段取り覚えると、あとはかなり簡単に作ることができてしまいますね。むしろRailsの流儀を覚えることの時間が長かったかもしれません。

ひとまず最低限のAPIサーバを作ったので、今度はサーバに置いて動かしてみます。これで一通りの流れだけは抑えられそうです。

では、また!

osio-toshimasa.hatenablog.com

osio-toshimasa.hatenablog.com

osio-toshimasa.hatenablog.com

【残り88日】Amazonアソシエイト祭り 文庫本編

おはよーございます。

こちら、Amazonの販売実績に取り憑かれた男のブログとなります。

本日現在の販売実績、0件でございます。

モノを売るとはなんと難しいことでしょうか。。いや正確には紹介しているだけですけども。 3件の販売実績を得るのがいかに大変か、身に染みております。それでも残り88日がんばっていきたいということで、今回は文庫本編でございます。

いくら売りたいからといって、自分的におすすめできないものまでなんでもかんでも売りつけるというのは流石に気がひけるので、前回もそうですけどこれを買った。これなら買いたいってものだけ紹介していきたいスタイルです。それでは本日もよろしくお願いします。

神々の山嶺

この本を読んだとき、ゆるキャンが流行る前というかまだゆるキャン出てなかった頃だと思いますが、思わずキャンプ行きたくなる本です。といっても内容はゆるくないゆるキャンで(?)、エベレスト単独登頂に挑む男と、それを追うジャーナリストの物語です。読んでみると雪溶かしてお湯沸かしたくなります。それと「山をなめるんじゃねえ!」って気持ちになります。ちなみに登山経験はありません。それほど物語に引き込まれていっちゃうんですよね。登山への興味全くなくても一度読んでみる価値めちゃくちゃあると思います。おすすめ。

国盗り物語

「道三なくして信長語れないんすよ!」と思わず言いたくなってしまうほどに斎藤道三という人物の魅力を存分に引き出してくれていた作品です。正直これ読むまであまり斉藤道三のことをよく知らなかったのですが、これ読んだ後信長よりもある魅力的な人物に見えてしまうほどでした。この本に限らずですが司馬遼太郎さんの歴史モノはどれもキャラがめっちゃ立ってるし、読みやすいんですよね。燃えよ剣とか坂の上の雲とか龍馬が行くとか。司馬遼太郎さんシリーズ未読の方はぜひ手に取って読んでみて欲しいですね。

ガダラの豚

中嶋らもさんの作品で、アフリカ呪術を専攻する大学教授がとある目的でアフリカ大陸に再び旅に出る本です。あまり書いてしまうとネタバレになってしまうので伏せますが、序盤の話から最後までたどりついたときの急展開な感じで面白いです。

この本も例に漏れず、アフリカ呪術と呪いについてついつい語りたくなってしまいます。もちろん僕に呪術経験はありませんが。。呪術とか出てきてなんだか重苦しそうですが内容はとてもカジュアルで読みやすいので3巻構成ですがスラスラと読み進めることができると思います。

ハゲタカ

最後はこちらハゲタカです。一時期ドラマや映画にもなって知名度高いのではないでしょうか。

これもですね。読んだ後に「金融なめるな」になるわけですよ。はいもちろん金融業で働いことありません。

映画やドラマも面白いのですが、映像コンテンツだと時間の制約で描ききれない事細かい描写が入っているので、じっくり楽しむには小説版が一番面白いように思います。企業買収や株式買付なんかの知識をこの本を通じてなんとなく知れた気がして、勝手に大人になった気分です。全く活用できていませんが。

まとめ

今回は物語として読める本を紹介してみましたが、面白そうな本みつかりましたでしょうか?どの作品も通勤電車やベッドで寝転がりながら読みふけっていたおすすめ作品たちばかりなので、ぜひぜひ読んでみて欲しいです。紹介しといてなんですが、僕も読み返してみたくなってしまいました 笑

では、また!

osio-toshimasa.hatenablog.com

【趣味でたのしむRuby】RubMineさんとRailsで初歩的なAPIサーバを作った話 その2 HTTPGET編

おはよーございます。

前回、Amazonさんからの突然の通告により狼狽してしまいました。

気を取り直してAPIサーバのつづき、その2です。

その1では、プロジェクト作成とコントローラの追加まで行ったので、今回は実際にメソッドを実装して、動作チェックです。

コントローラにメソッドを追加する。GET編

作ったコントローラにメソッドを追加していきます。routes.rbに自動でAPIルーティングが付与される記述をしたので以下のようなAPIを呼び出すことができるのですが、今回はindexとcreateだけ作ってみることにしました。

GET       /match            match#index  
GET       /match/new        match#new   
POST      /match            match#create    
GET       /match/:id        match#show  
GET       /match/:id/edit   match#edit  
PATCH/PUT /match/:id        match#update    
DELETE    /match/:id        match#destroy

やりかたは、作ったコントローラのクラスに以下のようにメソッドを定義するだけでした。

class MatchController < ApplicationController

  #  /matchで呼び出せる
  def index

  end

  # /matchで呼び出せる
  def create
  
  end
end

どっちも/matchで呼び出せるとは何事か?

すこし話それるんですが、indexはHTTP GETで、createはHTTP POSTで呼び出すことができます。ってなんだそりゃという話ですが、HTTP GETの方は、ブラウザでURL叩くとそのまま呼び出せます。対してHTTP POSTは、URL叩いただけでは呼び出すことはできません。一般的なWEBサイトだと入力フォームになんか書いて、送信とか登録ボタンを押した時に画面が切り替わりがちですがそういうときにHTTP POST呼び出しが行われていたりいなかったりします。きっとそう。

細かい話はさておき、APIサーバを作るというのが目的なので、それっぽくJSONというデータ形式で返すように処理を追加します。とりあえずindexメソッドにだけ追記します。

class MatchController < ApplicationController

  #  /matchで呼び出せる
  def index
    render json: {
      message: 'Hello World'
    }
  end

end

なんかこれだけでJSONデータに変換してくれるみたいです。簡単か。というわけで起動して確認してみたいと思います。

起動してブラウザから動作をチェックする。

RubyMineさんでRailsを起動するときは、緑色のボタン押すだけでした。ちなみに虫のアイコン押すとエラーが出て動きませんでした。。なぜだ。

起動すると下の画面に以下のような記述が出るのでhttpのところのリンクをクリックするブラウザが起動してRailsの起動画面に移動することができます。

こんなブラウザにこんな画面がでてきます。

で、URLの最後尾に作ったAPIメソッドを追記してジャンプします。

http://0.0.0.0:3000/match/

そうするとブラウザに以下のような文字が出てきます。

{"message":"Hello World"}

さきほどindexメソッドに書いたものが返ってきました。render json:とか書くだけでいい感じにJSON形式の文字列に変換してくれるんですね。というわけでHTTP GETメソッドにてAPI呼び出しをおこなってみました。

今回のまとめ

今回はここまでで一区切りです。文字数に換算すると結構なボリュームですが、実際やってみるとかなりお手軽にさっくり作れました。コードを書く時間よりも調べる時間のが長いのでこうしてまとめてみるとコード量は全然どころかほとんど書いていませんね😅逆に言えばこれがRailsの凄さなんでしょうけども。

次回はもう一個メソッドcreateの実装でHTTP POST編を書きたいと思います。では、また!