PWA（プログレッシブウェブアプリ） WordPress（ワードプレス）をプログレッシブウェブアプリ（PWA）化する流れについて
WordPress（ワードプレス）をプログレッシブウェブアプリ（PWA）に変換するには、いくつかの手順を踏む必要があります。以下に、一般的な手順を示します。Service Worker の追加Service Worker の追加: Serv...
EGUWEB
PWA（プログレッシブウェブアプリ） 
Node.js（ノード・ジェイエス） 【Node.js】Error: Cannot find module XX\node_modules\yarn\bin\yarn.js
謎のエラーにはまる…。Cannot find moduleError: Cannot find module 'XXXXXXXXXXXs\app\git\node_modules\yarn\bin\yarn.js'どうやらmodule PA...
Vercel（ヴァーセル） 【Vercel】Next.js＆Vercel でヘッドレスWordPress環境を構築する（Part2）
Next.jsとVercelを使用してヘッドレスWordPress環境を構築します。前回の続きです。ヘッドレスWordPressとは？ヘッドレスWordPress（Headless WordPress）は、WordPressのコンテンツ管理...
Vercel（ヴァーセル） Next.jsの新規インストール手順-Part1（プロジェクトフォルダ作成）
Next.jsはReactアプリケーションのための人気のあるフレームワークです。以下はNext.jsのセットアップ手順の基本的なガイドです。Node.jsのインストールNode.jsのインストール: Next.jsを使うには、まずNode....
Git(ギット) ‘git’ は、内部コマンドまたは外部コマンド、操作可能なプログラムまたはバッチ ファイルとして認識されていません。
gitエラーメッセージ「'git' は、内部コマンドまたは外部コマンド、操作可能なプログラムまたはバッチ ファイルとして認識されていません。」このエラーメッセージは、WindowsのコマンドプロンプトまたはPowerShellでgitコマン...
Vercel（ヴァーセル） 【Vercel】Next.js＆Vercel でヘッドレスWordPress環境を構築する（Part1）
Next.jsとVercelを使用してヘッドレスWordPress環境を構築します。ヘッドレスCMS（Content Management System）とは？ヘッドレスCMS（Content Management System）は、コンテ...
Node.js（ノード・ジェイエス） yarnとは？Node.jsのパッケージマネージャーの基本について
yarn（ヤーン）とは？Yarnは、Meta(Facebook)のSebastian McKenzie によって開発されたJavaScriptパッケージマネージャーです。JavaScriptのプロジェクトで使用される依存関係を管理し、効率的...
WordPress(ワードプレス) 【WordPress】HEICをJPG画像に変換するオンラインサービスを作成する方法
HEICをJPG画像に変換するオンラインサービスをHTMLとPHPを使って作成してみます。HEIC（ヘイク）とは？HEIC（High Efficiency Image Format）は、高効率な画像フォーマットの一種です。High Effi...
JavaScript(ジャバスクリプト) 【JavaScript】ブラウザ上でWEBPからJPGへの変換を行うツールを作る
HTMLとJavaScriptを使用して、WEBP画像を読み込みJPGに変換してダウンロードする、ブラウザ上でWEBPからJPGへの変換を行うツールを作ります。サンプルページはこちらhtmlコード<!DOCTYPE html><html l...
JavaScript(ジャバスクリプト) 【JavaScript】「文字数カウンター」アプリケーションを作る方法
HTML, CSS, そして JavaScript だけで文字数カウンターを作成してみます。完成形はこちら▼以下は、画面に文字を貼り付けるとその文字数が表示されるコードの例です。文字数カウンターのHTMLコードユーザーがテキストエリアにテキ...
Node.js（ノード・ジェイエス） 【Node.js】npm ERR! path ~/node_modules/sharp
Node.jsプロジェクトでSharp画像処理ライブラリに関連するエラーが発生しているようです。インストールの問題、バージョンの非互換性、または欠落している依存関係に関連する可能性があります。以下は、エラーを解決するために試すことができる一...
Vercel（ヴァーセル） 【Next.js】Fix the upstream dependency conflict, or retry
エラーメッセージによれば、reactとreact-useのバージョンが競合している？ようです。code ERESOLVEnpm ERR! ERESOLVE unable to resolve dependency treenpm ERR! ...
Vercel（ヴァーセル） 【エラー発生】npm ERR! ERESOLVE unable to resolve dependency tree
code ERESOLVEnpm install XXXXXXXnpm ERR! code ERESOLVEnpm ERR! ERESOLVE unable to resolve dependency treenpm ERR!npm ERR...
PWA（プログレッシブウェブアプリ） Next.jsでGenerateSWプラグインを使用する｜workbox-webpack-plugin（PWA化）
GenerateSWプラグインを使用するNext.jsでGenerateSWプラグインを使用してService Workerを構築する場合、以下の手順を実施できます。これにより、Progressive Web App（PWA）機能をNext...
PWA（プログレッシブウェブアプリ） Build failed because of webpack errors｜next-pwaプラグインの設定に問題？
next-pwaプラグインの設定に問題？このエラーは、おそらくnext-pwaプラグインの設定に問題があるために発生しています。Failed to compile.Please check your GenerateSW plugin co...
Notion(ノーション) ChatGPT to Notion Chrome拡張機能と使用方法について
ChatGPT to Notion Chrome拡張機能とは？ChatGPT to Notion Chrome拡張機能を使うと、ChatGPTのチャットをNotionと連携して保存できます。ChatGPT のページでは、各回答の下に新しいピ...
Vercel（ヴァーセル） Command “npm install” exited with 1
npm installコマンドがエラーコード1で失敗したようです。npm ERR! A complete log of this run can be found in:npm ERR! /vercel/.npm/_logs/2023-08...
Marketing(マーケティング) 「ファーストチェス理論」とは？
ファーストチェス理論とは？ファーストチェス理論とは、チェスの名人がチェスを行う際に「５秒で考えた打ち手」と「30分考えた打ち手」のうち、86％は同じになるという理論のことです。つまり、どれだけ長く思考しても、“最初に思いついた手段”に戻って...
JavaScript(ジャバスクリプト) 【Draggabilly】HTML要素をドラッグアンドドロップできるJavaScriptライブラリ
Draggabillyとは？Draggabillyは、HTML要素をドラッグ可能にするためのJavaScriptライブラリです。指定したHTML要素をマウスやタッチ操作でドラッグできるようにします。以下はDraggabillyの基本的な使い...
GoogleSpreadsheet(スプレッドシート) 【Googleスプレッドシート】損益率を求める方法
Googleスプレッドシートで損益率を求める方法です。損益率とは？損益率（そんえきりつ、Profit and Loss Ratio）は、投資やビジネスにおける収益性やリターンの指標です。損益率は、投資や取引の成果や業績を測定する際に使用され...
WordPress(ワードプレス) PopupMakerプラグインとJavaScriptで簡易的なチャットボットを作る（Part2）
前回の続きです。簡易的なチャットボット画面ができた前回、PopupMakerとJavaScriptを使って、簡易的なチャットボットのような画面ができました。前回のままだと、チャットの送信ボタンが無いので、送信ボタンを追加してみます。チャット...
WordPress(ワードプレス) PopupMakerプラグインとJavaScriptで簡易的なチャットボットを作る（Part1）
PopupMakerプラグインとJavaScriptで簡易的なチャットボットを作るPopupMakerはWordPressのプラグインで、ウェブサイトにモーダルウィンドウやポップアップを追加することができます。一方、JavaScriptはウ...
WordPress(ワードプレス) 【WordPress】何度ログインしても自動でログアウトされてしまう問題について
ワードプレスで何度ログインしてもログアウトされる…。クッキーとキャッシュのクリアこれらはしばしばログイン問題を引き起こすため、ブラウザの設定でクッキーとキャッシュをクリアしてみてください。Google Chromeの場合右上のメニューアイコ...
WordPress(ワードプレス) 【WordPress】AI Chatが実装できるプラグイン｜AI Engineプラグイン
AI Engineプラグインとは？AI Engine: ChatGPT チャットボット、コンテンツ生成、GTP-3と4、高度なカスタマイズは、WordPress に AI 機能を追加する強力なプラグインです。このプラグインを使用すると、さま...
Vercel（ヴァーセル） VercelでNotionのデータを連動させる｜Next.js Notion Starter Kit
VercelとNotionを連動させる手順は以下の通りです。この手順は、Next.js Notion Starter Kitを使用している場合の手順です。※VercelとNotionのアカウントを持っていることが前提です。Next.js N...
PWA（プログレッシブウェブアプリ） next-pwaとは？Next.jsにnext-pwaをインストールする流れ(Part1)
next-pwaとは？next-pwaは、Next.jsアプリケーションにProgressive Web App (PWA)の機能を追加するためのプラグインです。next-pwaを使用すると、Next.js アプリケーションをプログレッシブ...
Mac(マック) 【Mac】シェルスクリプトのサンプル例と実行方法について
シェルスクリプトのファイルサンプル例以下にシェルスクリプトのファイルサンプル例を示します。#!/bin/bashecho "Hello World!"#!/bin/bashは、シェルスクリプトの最初の行に書くシェバンと呼ばれる行です。シェバ...
JavaScript(ジャバスクリプト) 【JavaScript】JavaScriptのループ文について（for文・while文・do-while文・break文・continue文）
JavaScriptのループ文について、丁寧に分かりやすくひとつずつ説明します。for文for文は、特定の回数だけ繰り返し処理を行うための文です。for文の構文は、次のとおりです。for (初期化式; 条件式; 増減式) { // 繰り返し...
WordPress(ワードプレス) WordPressの管理画面で管理バー（アドミンバー）メニューのコメントを非表示にする
ワードプレス管理バー（アドミンバー）のコメント部分を非表示にしてみます。admin_bar_menufunctions.phpやWPCodeなどのSnippetsで下記のようなphpを追加します。add_action( 'admin_bar...
JavaScript(ジャバスクリプト) 【JavaScript】イベントリスナー・コールバック関数とは？
JavaScriptのイベントリスナーとコールバック関数は、JavaScriptが動的なWebサイトを作成するために使用する重要な概念です。イベントリスナーとは？JavaScriptでは、Webページ上で何かが起こるたびに「イベント」が発生...
