ブックマーク集（LIFF, Messaging API, Next.js, Node.js, xserver, nginxなど）

ブックマーク集

LIFF & MessagingAPIで、LINEミニアプリを作成した時に参考にした
Webサイトをここにまとめる。

---

JavaScript

• JavaScriptで小数点以下の桁数を指定する方法 #JavaScript - Qiita

• JavaScriptのNumberオブジェクト toFixed(x) メソッドの使い方 - 0xBrokers ブログ

• Number.prototype.toFixed() - JavaScript | MDN

• Fetch APIからPOST送信のdataパラメータを設定する２つの方法 | PisukeCode - Web開発まとめ

• Fetch APIでPOSTリクエストを送信するには？

• JavaScriptのFetch API について #promise - Qiita

• fetchメソッドの基本的な使い方【クエリパラメータとリクエストボディの使い分け】

• JavaScriptで生年月日から現在の年齢を計算する方法 | WebDev Tech

• async/await 入門（JavaScript） #AsyncAwait - Qiita

• momentで時間データの操作を楽にする #JavaScript - Qiita

• 【JavaScript】先頭・末尾から任意の文字数を取得・削除する方法（slice・substr） | WEMO's TIPS

---

TypeScript

• Typescriptのmap関数で、中身を入れ替える方法3選

---

React

• React JSXの中でfor文やif文を使う方法(備忘録) #React - Qiita

• Reactで覚えて置きたいスプレッド構文

• react-selectザックリ紹介 #React - Qiita

• React 子コンポーネント内で入力したデータを親コンポーネントに渡す。

• React 子から親へ入力内容を渡す #初心者 - Qiita

• 【React.js】useLayoutEffectでレンダリングの前に処理を実行する方法

• コレさえ理解すればOK！ReactのuseEffectは何をしてるのか解説

• [Reactで書く"e.target.value"って何か調べてみた #初心者 - Qiita](https://qiita.com/kuutarou/items/a6f61d1bbc50378034af "Reactで書く"e.target.value"って何か調べてみた #初心者 - Qiita")

• React / Express で作る Web アプリケーション開発入門｜研修コースに参加してみた

• ReactとNode.jsとMySQLで作る基本のWebメモアプリ(ページ2)

• とReact Hook Formで日付のデフォルト値が表示されない時の対処法 #chakra-ui - Qiita

• ゆ、useEffectちゃん!初回に動かないで! #JavaScript - Qiita

---

Next.js

• 【React】Next.jsを事始める（インストール、ページ設定、表示まで） - クモのようにコツコツと

• とほほのNext.js入門 - とほほのWWW入門

• 【忙しい人のための】Next.js公式チュートリアルを完走してきたので記事１本で振り返る【ギュッと凝縮】 | DevelopersIO

• Next.js 13のappディレクトリの基礎(Layout, Suspense, Data Fetching...)

• 【TypeScript】Reactでのイベントに設定する型の理解が少しだけ深まる | アールエフェクト

• Next.js と TypeScript で学ぶイベント処理「e.target.value」 - コムテブログ

• any型で諦めない React.EventCallback #React - Qiita

• Next.jsの起動するポート番号がlocalhost:3000から変わらない #Docker - Qiita

• とほほのNext.js入門 - とほほのWWW入門

• #そもそも下記のコードは何がしたいのか？inputに入力した値を取り出してuseStateで管理したい。なぜなら入力した値を用いて投稿だったり編集ができるから。const HogeHoge =…

• useRouterでパラメータを渡す【Next.js】 | Abillyz

• 【React】useEffectを使った非同期通信処理を理解しよう #JavaScript - Qiita

• Next.jsの環境変数設定まとめ #Next.js - Qiita

• Next.js の Anonymous Telemetry について調査

create-next-app（create-liff-App）

• create-next-appで訊かれていること

• Create-LIFF-Appでつまづいたところ覚書（2023年8月時点の情報）

本番ビルド

• Next.jsをレンタルサーバーにアップする際の苦戦録 #Next.js - Qiita

• Next.js：npm run buildするときにESLintで「Error: Missing "key" prop for element in iterator」が発生、その対処について

• Bloodborne のビルドシミュレータを Next.js で作った - /home/jiro4989

• 展開: 静的エクスポート | Next.js

• Next.jsをレンタルサーバーにアップする際の苦戦録 #npm - Qiita

---

Node.js

• Body-ParserがExpressにexpress.json()として標準搭載されている話 #Node.js - Qiita

• 【Nodeでmysql】データベースへconnectionPool(コネクションプール)接続する | kamiblog

• node.js + mysqlでMySQLに接続し、テーブルからデータを取得する | DevelopersIO

• 【npm audit】npm package の脆弱性対応してますか？

• NodebrewでNodeをインストールする #Node.js - Qiita

• node.jsをエックスサーバーで使うにはnodebrewを入れましょう

---

node_modules

• 日付の操作が楽になる！Moment.jsの使い方

• Moment.jsで週・月・年の操作 #moment.js - Qiita

• Node.jsで定期実行メモ #JavaScript - Qiita

• knex.jsでデータベースを操作しよう｜Node.jsによるWebアプリケーション作成入門

• npmでpackageのバージョンを調べる - ねこの足跡R

• 全52項目！Moment.js日付データ取得・設定する（Setter, Getter）実例 – console dot log

• Installation | Knex.js

• Nodemonを使用してNode.jsアプリケーションを自動的に再起動する方法 | DigitalOcean

pm2

• PM2を使ってNodeサーバを永続化する | いなばテクノ・エボリューション株式会社

• 【PM2】エラーで落ちたプログラムを自動で再起動させる方法

• node.js - npm run dev に pm2 コマンドを使用するにはどうすればいいですか - Stack Overflow

• pm2でNode.js実行環境を整備する #Node.js - Qiita

---

Express

• Express から MySQL に接続する #Node.js - Qiita

---

データベース

• 今更聞けない！コネクションプール入門 #Database - Qiita

• 日付に直すと日付がずれる — Domo Community Forum

SQL

• 【SQL】ORDER BY句を用いてソートを行う方法

• MySQLのテーブルに登録日時と更新日時を自動で設定する方法 | 株式会社CONFRAGE ITソリューション事業部

• MySQLのDATETIME型とTIMESTAMP型の違いを検証してみた #mysql5.6 - Qiita

• SQLのテーブル結合（JOIN, UNION, NATURAL）を覚えよう！基本構文と使用例を解説

• MySQL起動エラーの対処の仕方【Can't connect to local MySQL server through socket '/tmp/mysql.sock' (38)】 #Commnd - Qiita

• MySQLが起動しない（Can't connect to local MySQL server ~~）

• 誰も教えてくれなかったMySQLの障害解析方法 #MySQL - Qiita

• 今更聞けない！コネクションプール入門 #Database - Qiita

• MySQL | 実行中クエリの確認(show processlist)と強制終了(kill) - わくわくBank

• MySQLにて、DBの最大コネクション数と現在のコネクション数を確認する #MySQL - Qiita

• SQL COUNT 関数について調べてみた | DevelopersIO

• MySQL :: MySQL 8.0 リファレンスマニュアル :: 12.6.2 数学関数

• MySQL :: MySQL 8.0 リファレンスマニュアル :: 12.20.1 集計関数の説明

• [BigQuery] 日次・月次・年次データの抽出(GENERAGE_DATEARRAY)

• MySQL :: MySQL 8.0 リファレンスマニュアル :: 6.4.1.2 SHA-2 プラガブル認証のキャッシュ

• Node.jsでMySQL 8.0へ接続しようとする時に発生するエラー #MySQL8.0 - Qiita

• centOS Strem9でApache,PHP,MySQLを設定する

• Can't connect to local MySQL server through socket '/var/lib/mysql/mysql.sock'の解決法 #MySQL - Qiita

---

CSS

• marginとpaddingとは？基礎から解説！ゼロから始めるHTML/CSS講座Vol08

• 【CSS】displayの使い方を総まとめ！inlineやblockの違いは？

• justify-contentプロパティの意味と使い方

---

GitHub

• リポジトリをクローンする - GitHub Docs

• Support for password authentication was removed on Au...

• 【最速手順】【GitHub】リモートリポジトリの初回接続 – 独眼竜鳥むね

• Gitの内部構造：.gitディレクトリの解説 #Git - Qiita

• Git - 初めてのGitセットアップ

---

nginx

• NGINX + Next.jsでWEBサーバーの公開

• Next.jsをNginxを使ってSSLで公開可能な環境作成 - Planaria Work Log

• Xserver VPSでLEMP（Nginx+MySQL+PHP）環境を作成する方法 | サーバーチョイス

• nginxでsites-availableとsites-enabledを用いたバーチャルホストの設定

• Nginxでサブドメインとバーチャルホスト設定 #nginx - Qiita

• CentOS8(nginx)にcertbotを使ってシンプルに無料SSL化＆SSL自動更新 #nginx - Qiita

• Nginx コマンド超シンプル早見表 #nginx - Qiita

• [Ngrok 無料プラン]WEBとSSHを同時に公開する

• 個人サイトを作ろう(2) Nginx+Node.js導入 | estampie

• nginxのリバースプロキシとNuxt.jsのリダイレクトでハマった話 #Docker - Qiita

参考情報

• Node.jsはそれ自体がhttpサーバのようですが、nginxやapacheサーバを使う必要はないのでしょうか？大規模でもNode.jsだけで対応できるのでしょうか？

---

Apache

• 【保存版】.htaccessを利用したリダイレクト方法まとめ | 名古屋でホームページ制作、Web制作なら株式会社エッコ

• .htaccessリダイレクトの設定方法や書き方、注意点をわかりやすく解説 | QUERYY(クエリー)

---

LIFF

• LIFFアプリを作ってみたので、作り方をまとめてみた。｜あやおり子のうぇぶさいと

• LINEミニアプリとLIFFアプリの違いとは？どちらを選ぶべき？｜on inc.

• WebアプリのLIFFアプリ化｜【ハンズオン】認証を攻略！Rails×LIFFでセキュアなスタンプラリーアプリを作ろう！

• localhostに起動した本番ビルドLIFFアプリにインターネットからアクセスする | DevelopersIO

• LIFFを使ってみる｜Ken

• LIFFを使ってみる｜Ken

• LIFFで取得したユーザー情報をサーバーサイドで利用するときIDトークンとアクセストークンのどちらを利用するのがいいか比べてみた #LINE - Qiita

• LIFFアプリおよびサーバーでユーザー情報を使用する | LINE Developers

---

MessagingAPI

• LINE Messaging APIでリッチメニューを作成・表示させる方法｜Shohei Maeda

• CURLを使ったLINE Botのリッチメニュー画像の登録方法 #linebot - Qiita

• 友達全員にメッセージを送るシンプルな送信専用LINE BOTを作る【Node.js】 #linedc #JavaScript - Qiita

• Node.js & TypeScriptでLINEBot入門（2）：画像メッセージを取得する方法 | Go-Tech Blog

• placehold.jp | ダミー画像生成 モック用画像作成

• [LINE] デフォルトアクションとマルチアクションを試してみた #LINE - Qiita

---

レンタルサーバー

• VPS | サーバー名人～レンタルサーバーのプロ

• 【Ubuntu編】エックスサーバーVPSでバーチャルホストを設定する方法 | サーバー名人～レンタルサーバーのプロ

• 【Ubuntu編】Xserver VPSに無料SSL「Let's Encrypt」をインストールする方法 | サーバー名人～レンタルサーバーのプロ

• 【Mac/Win対応】Xserver VPSにSSH接続する方法の解説 | 1978WORKS

• XserverのVPSにドメインの紐付け | WinRoad徒然草

• 【Ubuntu編】エックスサーバーVPSにNginxをインストールしてWEB環境を構築する方法 | サーバー名人～レンタルサーバーのプロ

---

ネットワーク

SSL

• SSL通信にポート番号443以外は使用できる？代表的なウェルノウンポート番号まとめ

---

VScode

• Visual Studio Code | 行または複数行でインデントを追加、削減するショートカットキー | 1 NOTES

• Visual Studio Code で Remote SSH する。 #VSCode - Qiita

• 【解決済み】VSCodeで「Git の ‘user.name’ と ‘user.email’ を構成していることを確認してください」というエラーが出たときの対処 | Growers株式会社

---

SSH

• 【ContOS7】SSHのセキュリティ設定/sshd_config #CentOS - Qiita

---

Ngrok

• ITとセキュリティのあれこれ: ngrokで複数トンネルの設定

• ngrokを使用して複数ポートをhttps化する #ngrok - Qiita

---

Linux

• 「.bashrc」と「.bash_profile」の使いこなし | エンベーダー

---