【Rails】GitHubのセキュリティアラートで発見された脆弱性を解消する方法

2022年1月16日 14:01
# はじめに GitHubにはセキュリティアラートという機能があります。セキュリティアラートはリポジトリに含まれるライブラリやパッケージの脆弱性を定期的にチェックし、脆弱性のあるライブラリやパッケージが発見されたらアラートで知らせてくれるという機能です。 本記事では、GitHubのセキュリティアラー [...]

【Rails】devise-two-factorを使った2段階認証の実装方法【初学者】

2021年12月13日 11:59
# はじめに Railsアプリで2段階認証を実装するには、「rotp」というGemを使う方法の他に、「devise-two-factor」というGemを使う方法があります。「devise-two-factor」はその名の通り、IDとパスワードによる認証を実装する「devise」というGemの拡張機能です。 [...]

【Rails】rotpを使った2段階認証の実装方法【初学者】

2021年12月12日 14:30
# はじめに 昨今はIDとパスワードによる認証だけでなく、ワンタイムパスワードによる2段階認証を導入するWebアプリが増えてきました。Railsで作成したWebアプリでも、IDとパスワードによる認証に加えて2段階認証を導入するニーズが高まっています。 本記事では、IDとパスワードによる認証に加えて、 [...]

【Rails】deviseを使った認証機能の実装【初学者】

# はじめに Railsアプリに認証機能を導入するには「devise」というGemを使う方法が最も簡単です。「devise」は認証に係る機能をほとんどコードを書くことなく実装できる反面、処理がブラックボックス化されており、全容が把握しづらいというデメリットがあります。Railsで初めて認証機能を導入する場 [...]

【Rails】IDとパスワードによる認証機能の実装【初学者】

2021年12月2日 15:46
# はじめに 大抵のWebアプリでは、ユーザー登録/解除、ログイン/ログアウトといった認証機能を持っています。Railsには簡単に認証機能を導入できる「device」というGemが用意されています。「devise」は多くのRailsアプリで使われている実績のあるGemですが、「devise」を使わなくても [...]

【Rails】Railsプロジェクトの新規作成【初学者】

# はじめに Ruby on Rails(または単にRails)は、Rubyというプログラミング言語で設計・開発されたWebアプリケーションフレームワークです。一般的に、Webアプリケーションをイチから作成するには膨大な量のコードを書く必要があります。Webアプリケーションフレームワークは、Webアプリケ [...]

【CSS+JS】メニューアイコンの一種、ベントーメニューの実装方法(アニメーション付き)

2021年10月19日 14:56
# はじめに メニューアイコンの中ではハンバーガーメニューが有名だと思いますが、その他にもいろいろな種類があって、それぞれに名前もつけられています。 <a class="gallery" data-group="gallery" href="https://i.imgur.com/zTufFAS.j [...]

【CSS+JS】メインコンテンツの裏から現れるフッターの実装方法

2021年10月18日 13:58
# はじめに オシャレなサイトなどでたまに見かける「メインコンテンツの裏から現れるフッター」の実装方法について説明します。 # サンプル <iframe height="392" style="width: 100%;" scrolling="no" title="Untitled" src="h [...]

【CSS+JS】背景画像の視差効果(パララックス)を実装する方法

2021年10月17日 13:47
# はじめに JavaScriptプラグインを使わずに、背景画像の視差効果(パララックス)をVanilla JS(ピュアなJavaScript)だけで実装する方法について説明します。 # サンプル まず、背景画像の視差効果(パララックス)とはどういうものなのか確認するために、下記のサンプルをご覧く [...]

【Rails】ダウンロードしたフリーフォントをWebpackerを使って導入する方法

2021年10月16日 15:56
# はじめに Webサイトのデザインを彩るひとつの要素にフォントの種類があります。Google Fontsの登場により、様々なフォントが手軽に導入できるようになりました。しかし、世の中にはGoogle Fontsが提供するフォント以外にもたくさんのフリーフォントが存在します。 本記事では、ダウンロー [...]