プログラミング– category –
-
JavaScript
【Rails7】ransackとStimulusでインスタント検索機能を実装する方法
Railsで検索機能を実装するならransackというgemが有名どころですね。 ransackを導入すれば簡単に検索機能を実装することができます。 ただ、今回は普通の検索機能ではなく、以下のように入力したらすぐに検索結果を返してくれるインスタント検索機能を実... -
Ruby on Rails
【Rails】任意のURLをQRコード化する方法(rqrcode)
アプリ内のURLをQRコード化する方法についての忘備録です。 今回の実装では、QRコード化してくれるgem「rqrcode」を導入してみました。 開発環境 Ruby 3.1.2 Ruby on Rails 7.0.3 Bootstrap 5.1.3 M1 Macbook Air 2020 mac OS Monterey (ver. 12.4) ターミ... -
Ruby on Rails
QRコードリーダーで「宝探しゲーム」ができるアプリを開発してみた
最近、プログラミング(Ruby on Rails)の学習にハマっているヒロキと申します。 Railsを学習する中で、何か形に残るような、そして面白いアプリを作れないか考えていたところ、 スマホのQRコードリーダーを使った宝探しゲームなんか作ったら面白いのでは... -
Ruby on Rails
【Rails】ゲストユーザーのログイン機能(アカウント独立型)を実装する方法(Deviseなし)
ゲストユーザーとしてログインできる機能があれば、わざわざユーザー登録をしなくてもログインできるので便利ですよね。 気軽にお試しできるよう、ゲストログイン機能は是非とも実装しておきたいものです。 そこで今回はそのゲストログイン機能(Deviseな... -
Ruby on Rails
【Rails】ネストしたルーティングのURLのidが入れ替わる問題への対処法
例えば、postモデルを親としてitemモデルのルーティングを以下のようにネストした場合、 resources :posts do resources :items end showページ、およびeditページを表示した際にネストしたitemモデルのルーティングのURLのidが入れ替わって表示される(id... -
Ruby on Rails
【Rails】ネストしたモデルに対するform_withの書き方
例えば以下のように、一つの投稿(post)の中にさらに複数の投稿(item)を追加できるようにしたい場合、 そんな時は、idなどのパラメータの受け渡しの都合上、ルーティングを以下のようにネスト(nest)して親子関係にした方が実装しやすいかと思います。 resou... -
JavaScript
【Rails】JavaScriptで動的なバリデーション(リアルタイムでチェックする機能)を実装してみた
Railsでフォームのバリデーションチェックを行う場合、送信ボタンを押した後でないとエラーがあるかどうかを判定できません。 バックエンド側でバリデーションチェックは行いつつ、フロント側でもリアルタイムにバリデーションチェックを行う機構を実装し... -
JavaScript
【JavaScript】簡単な数字当てゲームを作ってみた
JavaScriptのチュートリアルを通して簡単なゲームを作ってみたので、学んだことを忘れないうちにメモとして残しておこうと思います。 今回作成したゲームは「数当てゲーム」で、1から100までの数字の中からランダムに割り当てられる数字を10回以内に当てる... -
Ruby on Rails
【Rails】ActiveStorage でプロフィール画像(アバター)を登録・更新する
ユーザーのプロフィール画像(アバター)を作成するにあたり、 ActiveStorageでファイルから画像をアップロード プロフィール編集画面にてアップロードした画像のプレビュー variantによる画像のリサイズおよび切り抜き(画像登録時) アップロードした画像... -
Ruby on Rails
【Rails7】住所を入力しただけで地図(Googleマップ)が自動表示されるようにする
Railsで作成したWebアプリケーションに住所を登録すると、表示画面に自動で地図(Googleマップ)が表示されるようにするための覚え書きです。 この機能を実装するにあたり、住所を登録するためのaddressカラムと、地図の位置情報(緯度・経度)を保存する... -
その他
Google Maps の API Key を取得する方法
データベースなどの住所情報からGoogleマップを表示する機能を作成する際に、地図の表示にGoogle Maps の API Key が必要になります。 当記事は、そのGoogle Maps の API Key を取得するための覚え書きです。 Google Maps Platform の無料利用枠について ... -
Ruby on Rails
【Rails】テキスト内のURLを自動でリンク化してくれるgem「rinku」を導入してみた
SNSの投稿や自己紹介文(テキスト)にURLを記述すると自動でリンク化してくれるように、Railsで作成したアプリ内でも入力したURLを自動でリンク化できるようにしたい、 と思い立ちググってみたら、テキスト内のURLに自動でリンクタグを付けてリンク化して...