JavaScript(ジャバスクリプト) mapとは？JavaScriptの配列オブジェクトについて
mapメソッドとは？map は、JavaScriptの配列オブジェクトが提供するメソッドの一つです。map メソッドは、配列内の各要素に対して指定した関数を実行し、その結果を新しい配列として返します。元の配列は変更されず、新しい配列が生成さ...
JavaScript(ジャバスクリプト) 
JavaScript(ジャバスクリプト) 【JavaScript】forEachメソッドとは？基本と使い方について
forEachメソッドとは？forEachは、JavaScriptで配列を繰り返し処理するためのメソッドです。与えられた関数を配列の各要素に対して一度ずつ呼び出します。ここで、提供されたコードでは、dataという配列の各要素に対してforE...
GAS(GoogleAppsScript) 【GAS】Firebaseのデータを取得してスプレッドシートに書き込む（Part2）
Google Apps Script（GAS）を使用してFirebaseからデータを取得し、それをスプレッドシートに書き込みます。前回のつづきです。だんだん難しくなってきましたね。大丈夫です、順番に進めていきましょう。Cloud Fires...
GAS(GoogleAppsScript) 【GAS】Firebaseのデータを取得してスプレッドシートに書き込む（Part1）
Google Apps Script（GAS）を使用してFirebaseからデータを取得し、それをスプレッドシートに書き込みます。以下は、基本的な例です。Google Apps Scriptプロジェクトの作成:Google ドライブで新しい...
WordPress(ワードプレス) 【WordPress】会話風の吹き出しを表示できるLIQUID SPEECH BALLOON プラグインの使い方
IQUID SPEECH BALLOON プラグインを使うと、ページやブログに会話風の吹き出しを作ることができます。吹き出し風のブロックを作りたいです！作ってみましょう！LIQUID SPEECH BALLOON の使い方WordPress...
GAS(GoogleAppsScript) 【GAS】Googleスプレッドシートに予定一覧を作成しics（iCalendar形式）形式でGoogleカレンダーにエクスポートする
Googleスプレッドシートから直接ICS形式でエクスポートする機能がデフォルトでは提供されていません。代わりに、Google Apps Scriptを使用してスプレッドシートからiCalendar形式を作成して、カレンダーにイベントを追加...
Googleスプレッドシート 【Googleスプレッドシート】ファイルを開く時にパスワードを設定する方法（Part2）
前回の続きです。残念ながら、Google スプレッドシートにファイルを開く際に直接パスワードを設定する機能がありません。そこで、他の方法を考えてみます。パスワードを設定したWEBページに埋め込む前回、こちらの公開したスプレッドシートをWEB...
JavaScript(ジャバスクリプト) 【JavaScript】CSSで特定の文字が入った段落を非表示にしたい
特定の文字が入った段落を非表示にしたい段落を非表示にするにはCSSのセレクタで可能ですが、クラス名や指定する場所が決まっていない場合に「特定の文字が入った段落を非表示にしたい」といった場合に困ったことになります。代替手段としてJavaScr...
Googleスプレッドシート 【Googleスプレッドシート】ファイルを開く時にパスワードを設定する方法（直接は無さそう）
Googleスプレッドシートにパスワード設定機能が無い？Googleスプレッドシートでは、Excelのようなファイルにパスワードをかける機能が直接提供されていません。しかし、代わりの方法を考えて、利用することができます。Excelファイルを...
GAS(GoogleAppsScript) Google Apps Scriptを用いたプルダウンメニューの条件分岐例
プルダウンメニューの選択に応じて異なるアクションを実行します。この例では、選択されたオプションに応じて、別のセルにメッセージを表示します。条件分岐スクリプトの作成ここでは、選択されたオプションに応じて異なるアクションを実行するスクリプトの作...
PWA（プログレッシブウェブアプリ） Firebase Cloud Messagingを使用してPush通知を送信するための基本的な手順
Firebaseプロジェクトの作成と設定:Firebaseコンソールにアクセスし、新しいプロジェクトを作成します。プロジェクトの設定で、Firebase Cloud Messaging（FCM）を有効にします。Firebaseプロジェクトの...
JavaScript(ジャバスクリプト) JSONデータとは？種類や基本的なフォーマットについて
JSON（JavaScript Object Notation）は、軽量でデータ交換のためのテキストベースのデータ形式です。以下はJSONデータの基本的なフォーマットです。オブジェクト（Object）JSONデータは、中括弧 {} で囲まれ...
JavaScript(ジャバスクリプト) 【JavaScript】async 属性を付与して読み込み順番を変える
async属性を使用してスクリプトの読み込み順序を変更する例を示します。以下は、3つのスクリプトがあり、それぞれが異なる順序で非同期に読み込まれる例です。async属性とは？async 属性は、HTMLの<script>タグに使用される属性...
Googleスプレッドシート 【スプレッドシート】IFERROR 関数を使用してN/Aエラー時に「商品が見つかりません」と表示する
IFERROR 関数についてGoogle スプレッドシートで IFERROR 関数を使用すると、指定された式がエラーを返す場合に、代わりに表示する値を定義できます。これは、特に VLOOKUP などのエラーを起こしやすい関数を使用する際に便...
PWA（プログレッシブウェブアプリ） FirebaseでPWAのPush通知アプリを作る（Part1）
Firebaseを使用してPWA（プログレッシブWebアプリケーション）のPush通知アプリを作成する方法についての詳細な手順を以下に示します。これはPart1であり、Firebaseのセットアップと基本的なPWAの設定に焦点を当てます。以...
Gmail(Gメール) 【Gmail】便利な検索機能20個｜メールの整理や検索を効率的に行う方法
以下、それぞれGmailの便利な検索機能です。キーワード検索キーワード検索： メールの本文や件名に特定のキーワードが含まれている場合、検索ボックスにキーワードを入力して対応するメールを見つけることができます。差出人指定差出人指定： from...
Scratch(スクラッチ) 【Scratch】スクラッチプログラミングのアイデア30個
スクラッチを使うと、様々なゲームやアプリケーションを作ることができます。Scratchはこちらシンプルなブロック崩しゲームシンプルなブロック崩しゲーム: プレイヤーがパドルをコントロールしてボールを跳ね返し、ブロックを崩していくクラシックな...
GAS(GoogleAppsScript) icsファイルとは？GASでの生成方法について
icsファイルとはicsファイルは、iCalendarフォーマットで構造化されたカレンダーデータを含むファイルです。iCalendarは、イベントや予定などのカレンダー関連の情報を共有するための標準フォーマットです。ICSは「iCalend...
CSS(シー・エス・エス) CSSのclass名に使える文字は？適切なクラス名とそのサンプル
CSSのclass名に使えるルールCSSのクラス名には、ほとんどのUnicode文字が使用できます。ただし、いくつかのルールがあります。英数字（a-z、A-Z、0-9）は使用できます。ハイフン（-）やアンダースコア（_）も使用できます。ただ...
SEO(検索エンジン最適化) YMYLとは？SEOに関する重要な概念について
YMYLとは？YMYLとは、Your Money or Your Lifeの略で、直訳すると「あなたのお金、あなたの人生」という意味です。Googleの検索品質評価ガイドラインでは「人の将来の幸福、健康、経済的安定、または安全に影響を与える...
JavaScript(ジャバスクリプト) 【JavaScript】画面遷移中にぐるぐるローディングアニメーションを表示したい
グルグル回るローディングアニメーションリンク先をクリックした際に、グルグル回るローディングアニメーションを表示してみます。スクリプト参考例特定のリンクをクリックしたときにローディングを表示するようにしたい場合、JavaScriptでそのリン...
CSS(シー・エス・エス) z-indexとは？要素の重なり順番を制御するCSS
z-indexは、要素のスタッキングコンテキスト内での描画順序を制御するためのCSSプロパティです。このプロパティは通常、position プロパティが static 以外の値を持つ要素に対して使用されます。以下に、z-indexの詳細な説...
GAS(GoogleAppsScript) 【GAS】スプレッドシートをJSON形式で出力して読み込むAPIを作る（Part2）
前回は、GoogleスプレッドシートをJSON形式で出力するところまで進みました。続きです。JSONデータを出力するHTMLJSONデータから total フィールドの値を取得して表示するためのHTMLコードを準備します。<div clas...
GAS(GoogleAppsScript) 【GAS】スプレッドシートをJSON形式で出力して読み込むAPIを作る（Part1）
GoogleスプレッドシートをJSON形式で出力し、それを読み込むAPIを作成してみます。以下の例では、doGet 関数を使用してJSON形式でデータを出力し、doPost 関数を使用してデータを書き込むようなAPIを作成しています。Goo...
JavaScript(ジャバスクリプト) 【JavaScript】リンクをクリックしたらTwitterに投稿できるようにしたい
HTML部分を作るまずは、表示するカードのHTML部分を作ります。<div class="card-container"> <div class="card"> <a href="#" onclick="tweetCard('いつもありがと...
Googleスプレッドシート 【Google スプレッドシート】スペースやカンマで区切られた列を分割する（SPLIT 関数）
Google スプレッドシートに貼り付けたCSVなどのデータの列を分割するには、以下の2つの方法があります。方法1： > を使用する分割したい列を選択します。メニューバーの タブをクリックします。 をクリックします。区切り文字を選択します。...
Canva（キャンバ） Canva(キャンバ)でLINE公式アカウントのリッチメニューを作る方法
Canva(キャンバ)を使ってLINE公式アカウントのリッチメニューを効率よく作る流れです。CanvaにログインするCanvaの公式サイトにアクセスして、ログインします。アカウントが無い場合はアカウントを作成します。アカウントを作成するには...
Cursor(カーソル) Cursor(カーソル)でAIを呼び出す方法（Command+K）
CursorでAIを呼び出すには、以下の2つの方法があります。1. キーボードショートカットを使用するCursorのキーボードショートカットは、Command+Kです。Windowsの場合はCtrl+Kです。このキーを押すと、AIのメニュー...
Cursor(カーソル) 「Cursor」とは？AIでコード生成・レビュー・デバッグが可能な次世代エディタ
Cursorは、AIを活用してコーディング作業を効率化するテキストエディタです。Visual Studio Code（VSCode）をフォークして作られており、VSCodeの基本的な機能に加えて、AIによるコード生成、コードレビュー、デバッ...
JavaScript(ジャバスクリプト) 【JavaScript】クイズで正解したら下の方に正解・不正解と表示されるようにしたい
JavaScriptで簡単なクイズのWebページを作成します。HTML<div id="quiz-container"> <h2>クイズ</h2> <p>世界で最も高い山は？</p> <button onclick="checkAnswer...
