2022年– date –
-
【Rails7】メニューバーのタブの切り替えをJavaScritp + Stimulus で実装してみた
どうも、ヒロキです。 今回はRails7でメニューバーのタブの切り替えをJavaScript、およびそのフレームワークのStimulusを使って実装してみました。 今後、同じ機能を再現するための覚書用と、後学のため記事にまとめておきます。 どなたかの参考になれば幸... -
【Rails7】ActiveStorageで複数枚画像を投稿・更新する（プレビュー表示も実装）
ActiveStorageで複数枚画像を投稿（保存）する方法についての情報はたくさん出てきますが、正直どれも僕が思い描いていた画像アップロード機能のイメージとは違うかなぁと感じております。 例えば、僕が思い描いている複数枚画像アップロード機能のイメー... -
【Rails7】Rakeタスクをwheneverで定期的に実行する方法（タスクの自動化）
RailsにはRakeというgemが標準搭載されており、Railsで定期的に実行したい処理をRakeタスクとして定義しておくことで、必要なときに呼び出して実行することができます。 Rakeタスクを作成するメリットとしては、アプリケーションを起動せずにターミナル上... -
【Rails7】ゲストログイン機能を実装する方法（Devise実装済み）
Rails7でポートフォリオ用のWebサイト（もしくは正式なWebサービス）にゲストログイン機能を実装したい。 ネットでググるとDeviseでゲストログイン機能を実装する方法はたくさん出てきますが、「Rails7」＋「Devise」と言う条件下でゲストログイン機能を実... -
【Rails】Font Awesome の導入方法および使い方
RailsでFont Awesomeを導入してみたので、導入の流れや使い方についてまとめてみました。 Font Awesomeは無料で2,000種類以上のアイコンが利用できる上に、各アイコンのスタイルも変更できたりとバリエーションに富んでいて非常に使いやすい。 ただ、Font ... -
【Rails】Tailwind CSS でカスタムCSS を作成・インポートする方法
最近、RailsでTailswindCSSを導入してみたのですが、思った以上に使い勝手が良い。 特に、カスタムコンポーネントでデザインを簡単に、自由自在に表現できる点は素晴らしいですね（さよなら、Bootstrap 笑）。 ところで、カスタムコンポーネントを作成する... -
【Tailwind CSS】VSCode上 で「@tailwind」「@apply」付近に出るエラー表示の対処法【Rails】
Rails で TailwindCSS を導入してみたところ、application.tailwind.cssのTailwindCSS読み込み部分（@tailwind）でエラー表示が。 最初は読み込みエラーかなと思ったんですが、CSSはちゃんと適用されているし、色々と調べてた結果、エディタ（VSCode）上の... -
【Rails7】Deviseを導入する方法（Turbo対応済み, メールサーバー設定込み）
【重要】Rails7でDeviseを導入される方へ2023年2月17日に最新版Devise（v4.9.0）がリリースされ、Rails7のTurboに対応するようになりました。それに伴い、当記事で紹介しているTrubo対策が必要なくなりました。故に、当記事は古い情報となりますので、Rail... -
【Rails】ゲストログイン機能を実装する方法（Deviseなしで）
以前、アカウント独立型のゲストログイン機能の実装について記事にしました。 https://plog.kobacchi.com/rails-guest-user-login/ ただ、一般的にゲストログイン機能は1アプリに1ゲストアカウントを作成し、そのアカウントを他のゲストログインユーザー同... -
【Rails7】JavaScript（+Stimulus）でクリップボードにコピーするボタンを実装してみた
表示されたテキストをボタンクリック一つでクリップボードにコピーしてくれる機能、あったら便利ですよね。 ということで、今どきのWebサービスでよく見かける以下のようなボタンを実装してみました。 今回の実装で用いたJSライブラリはStimulus。 Rails7... -
【Rails7】Ajax + Stimulusでメールアドレスが登録済みかどうかチェックする方法 (jQueryなしで実装)
Railsではフォーム入力時（新規ユーザー登録時）にすでに登録済みのメールアドレスがある場合、バリデーションが発動して登録できないようになっているかと思います。 しかし、しかしですよ！？ メールアドレスがすでに登録されているかどうかは、フォーム... -
【Rails7】JavaScript + Stimulusで動的なバリデーションチェックを実装してみた
以前、JavaScriptで動的なバリデーションチェックを実装する旨の記事を書きましたが、JSのコードが冗長なのと変数宣言にvarしか使えない（Turboとの相性により）という課題がありました。 https://plog.kobacchi.com/rails-javascrip-realtime-validation-...
