JavaScript

JavaScript

JavaScriptでpdfなどのファイルダウンロード処理を行う方法

今回はJavaScriptでpdfなどのファイルダウンロード処理を行う方法を紹介します。pdf以外にもexcelや画像など、ファイルとして同...
JavaScript

【Nuxt3×Firebase v9】.envでステージングと本番環境を分けて開発・hostingする方法

今回はNuxt3とFirebase v9の環境で、Firebaseの環境変数を.envで開発・本番でそれぞれ分けて使用し、ホスティングする方...
JavaScript

JavaScriptでオブジェクトをjsonとしてダウンロードする方法

今回はJavaScriptでオブジェクトをjsonファイルとしてダウンロードする方法を紹介します。 オブジェクトをjsonとしてダ...
JavaScript

Vueでaタグに@clickイベントを当てた時のページ遷移を無効化する方法

今回はVueでaタグに@clickイベントを設定する時にhrefの遷移先に遷移してしまう処理を無効化する方法を紹介します。 結...
JavaScript

Cloud Storageから画像のURLを取得する方法

今回はFirebaseのCloud Storageにアップしてある画像のURLを取得してページに表示する方法を解説します。 Clo...
JavaScript

Cloud Storageに画像をアップロードする処理の書き方を解説

今回はFirebaseのCloud Storageに画像をアップロードする処理の書き方を解説します。 フロント側の処理で「ボタンを押し...
JavaScript

JavaScriptでinput type=”file”で画像をアップした際にプレビューを表示する方法

今回は<input type="file">をクリックした際にアップした画像をそのまま表示するプレビュー的な機能の作り方を解説し...
JavaScript

Firestore v9のデータ(コレクション)をmap()で返して関数化する方法

firestoreからコレクションを取得する際、forEach()のループ内でデータにアクセスする方法はありますが、map()で関数に分けで...
JavaScript

【Firestore】TypeError: 〇〇.toDate is not a functionの時に確認したいこと

今回はfirestoreからデータを取得する際、TypeError: 〇〇.toDate is not a functionというエラーが表...
JavaScript

JavaScriptで「01」のように数値の桁数を合わせる方法(ゼロパディング)

今回はJavaScriptで「01」のように数値の桁数を合わせる方法(ゼロパディング)を解説します。 桁数を合わせるゼロパディング...
Vue

Vueの$emitで複数の値を渡す方法

今回はVueの$emitの引数に複数の値を渡して送る方法を解説します。 やり方は以下の2つです。 $emitの引数に複数...
Vue

vue-slickで特定の任意のスライドに移動する方法(slickGoTo的な)

今回はvue-slickでクリック時に特定の任意のスライドに移動できる機能(slickGoTo的なやつ)の作り方を紹介します。普段スライダー...
JavaScript

【JavaScript】exceljsでExcel/CSV両方で出力できる機能を実装する

今回はJavaScriptでExcel/CSV両方出力できる機能を実装する方法を解説します。 ExcelだけやCSVだけならライブラリ...
JavaScript

【jQuery】別のページから遷移した時にアコーディオンを開く方法

今回は別のページから遷移した時にそのアコーディオンを開いた状態にしておく方法を紹介します。 今回やりたいこと 例えば「https...
JavaScript

【jQuery】絶対パスでもスムーススクロールする方法

今回はスムーススクロールを絶対パスでも処理できるようにする方法を解説します。 よく見かける方法だと「#」で始まっている内部リンクしか処...
JavaScript

郵便番号から住所を自動で入力!ajaxzip3の使い方!

今回は郵便番号を入力しただけで住所を自動で入力してくれるライブラリ「ajaxzip3」の使い方を解説します。 ajaxzip3を読...
JavaScript

SafariでブラウザバックするとJSなどが解除されていない問題【bfcache】

ある日仕事でWebサイトを作っていたのですが、iPhone実機のiOS Safariでハンバーガーメニューのリンクからページ遷移した後ブラウ...
JavaScript

【超簡単】slickで各スライドの要素の高さを合わせる方法

今回はslickで各スライドの要素の高さを合わせる方法を解説します。 テキストの量にばらつきがあるスライドだとこんな感じで高さが不揃い...
JavaScript

【jQuery】上にスクロールした時に表示されるヘッダーの作り方

今回はjQueryで上にスクロールした時に表示されるヘッダーの作り方を解説します。 デモ 実際の動きはこんな感じです。下にスクロ...
JavaScript

【超図解】jQueryでスクロール時に要素をフェードインさせる方法

今回はjQueryでスクロール時に要素を下からふわっとフェードインさせる方法を初心者でもわかりやすいように図解で説明します。 デモ...