Vue.js/Nuxt.jsVue.jsのプロジェクトにfirebaseを導入する
概要Vue.jsを利用したプロジェクトに、firestoreを利用してデータ取得を行う手順を解説する。公式ドキュメント公式ドキュメントはこちら。前提vue createコマンドを利用して作成したVue.jsプロジェクトを想定するfireba...
フレームワーク
Vue.js/Nuxt.js
Vue.js/Nuxt.js【Vue.js】ディレクティブ省略記法メモ
Vue.jsではよく利用する構文は省略して記述することができる。久しぶりにVue.jsに触ると忘れてしまうのでメモ。v-bind: → :v-bindディレクティブは、Vue.js内で使われているデータを画面に埋め込む時によく利用するディレ...
React.js/Next.js【React.js】useState,useRef,useEffectの使い分け簡易まとめ
久しぶりにReactを触ると、どのhooksがどんな機能か忘れてしまうのでまとめ。簡易的にしかまとめていないので、詳細は公式サイトなどを見てほしい。useState（個人的に）一番基本的な状態管理のためのhooks。アプリケーションで一番よ...
React.js/Next.js【Next.js/React.js】TypeScriptで書かれたプロジェクトにESLintとPrettierを導入する
概要Next.jsTypeScriptという条件のプロジェクトに、いい感じに静的解析ツールとコードフォーマッターを入れる。ESLint（静的解析ツール）の導入公式ページを参考に導入する。インストール$ npm install eslint ...
React.js/Next.js【Next.js】SCSSを使う環境を構築する（TypeScript利用）
まずはnpm installこちらの公式ドキュメントに記載されている通り、sassのインストールを行う。$ npm install sassscssファイルを作成.scssの拡張子でcss modulesを作成する。./style/abou...
React.js/Next.js【Next.js】Boostrapを導入する
Next.jsにBootstrapを導入するときの備忘録。基本的にはこちらに従って行うだけ。まずは必要なパッケージをインストールする$ npm install react-bootstrap bootstrap実装するimport 'boo...
Java【SpringBoot】CheckStyleをGradleを使って導入する
CheckStyleとはJavaの静的解析ツールの一種で、コーディング規約に従ってコードが書かれているかどうかをチェックするためのものである。インデントが汚かったり、改行のポイントが汚かったりするところを指摘してくれる。ディレクトリ構成Sp...
Java【SpringBoot】よくお世話になるアノテーション – バリデーション編
SpringBootにおいてバリデーションを利用するときよくお世話になるバリデーション用アノテーションを紹介する。nullチェック系@javax.validation.constraints.Null値がnullであることをチェックする。@...
JavaScript【Nuxt.js】chart.jsを使ってみる
Nuxt.jsのプロジェクトにchart.jsを導入し、グラフを描画する。一応Nuxt.jsとして紹介しているが、もちろんVue.jsでも利用できる。参考インストールVueを使うときは、chart.jsをそのまま使うのではなく、vue-ch...