Java [Java] 日時を扱うクラスの使い方
概要 かつて使われていたjava.util.Dateクラス、java.util.Calendarクラスは以下のような問題があるため現在では使われていない。 月が0から始まるなど使いづらい スレッドセーフではない 期間を表すことができない 現在はJava8から追加されたTime API（java.timeパッケージ）が使われる。Time APIのクラスはnewが禁止されており、静的メソッドのnow(...
プログラミング
Java Java [Java] 文字列処理のチートシート
文字列の比較: equalsメソッド "hello".equals(new String("hello")) // true 文字列配列の連結: String.joinメソッド String joinedText = String.join(",", args); intに変換: Integer.parseIntメソッド int num = Integer.parseInt("100") 長さを取...
Java [Java] 「シンボルを見つけられません」の解決法
概要 hoge.MyClassをjavac MyClass.javaでコンパイル後、java MyClassとしても「シンボルを見つけられません」となってしまい実行することができない。 原因 原因は以下の2つである。 原因1: クラスはFQCNで指定しなければならない javacコマンドはソースファイル名を指定するにも関わらず、javaコマンドはクラス名(FQCN)を指定する必要がある。 原因2:...
Vue.js [Vue.js] ボタンクリックだけでなくEnterキー押下でもフォーム送信させる方法
概要 Vue.jsでフォーム送信を行う場合、type="button"のbutton要素やinput要素のclickイベントで処理するのが一般的である。ボタンクリックだけでなくEnterキーを押した時にもフォーム送信したい場合は、form要素のsubmitイベントハンドラで処理する必要がある。 clickイベントで処理する場合 <html lang="ja"> <head> <meta chars...
React [Next.js] 環境変数を使う方法
概要 APIキーなどをコードに埋め込むのはセキュリティ上好ましくないため、環境変数として用意するのが一般的である。 .env開発・本番に依存しないデフォルト値を定義する。 .env.local開発・本番に依存しないシークレットな値を定義する。(.gitignoreに追加する) Next.jsで使うAPIキーを管理するだけであれば、.env.localを用意すれば良い。 API_KEY=XXXXXX...
React [Next.js] Font Awesomeを導入する方法
概要 Next.jsでFont Awesomeを使うための手順をまとめました。 インストール コアnpm install @fortawesome/fontawesome-svg-core Reactコンポーネントnpm install @fortawesome/react-fontawesome 以下のアイコンパッケージは必要な分だけインストール。 Solidnpm install @forta...
React [Next.js] window, sessionStorage, localStorageなどが使用できない原因
概要 Next.jsでwindowなどブラウザオブジェクトにアクセスするとReferenceErrorとなってしまう。 console.log(window) // ReferenceError: window is not defined これはデフォルトでサーバサイドレンダリングが有効になっているからであり、if文でブラウザオブジェクトが存在するかどうかを判定することでエラーを回避することがで...
React [Next.js] SSRを無効にする方法
概要 Nuxt.jsはデフォルトでサーバサイドレンダリングが有効になっているため、サーバサイドでは存在しないwindow, localStorage, sessionStorageなどのオブジェクトを参照しようとするとエラーになってしまう。 Nuxt.jsの場合はnuxt.config.tsでssr: falseを指定することでSSRを無効にすることができるが、Next.jsの場合はnext/dy...
React [Next.js] CDN版のCSSやJavaScriptを使う方法
概要 Next.jsで外部のCSSやJavaScriptを使う場合、通常はnpmパッケージをインストールしたものをimportする。何らかの事情でCDN版を使いたい場合は、linkタグやscriptタグをNext.jsのルールに則った場所に記述する必要がある。 linkタグ pages/_document.js（拡張子はjsx, ts, tsxなど環境に依存）内に記述する。 import { He...
React [React] import文を絶対パスで記述できるようにする方法
概要 React.jsでの開発において、jsconfig.json（TypeScriptの場合はtsconfig.json）のcompilerOptionsにbaseUrlを指定すると、import文を絶対パスで記述できるようになる。 { "compilerOptions": { // 省略 "baseUrl": "." } } これによりimport Header from '../../../...