2021-01-01から1年間の記事一覧

ResponseEntityでの各HTTPステータスレスポンス作成方法

はじめに 本記事では、Springで提供されているResponseEntityを使用したレスポンス作成方法について記述します。 主にHTTPステータス200系(成功)と、400・500系(エラー)の取り扱い方法です。 (個人的によく使うものだけです。悪しからず) ResponseEnti…

CRUDとHTTPメソッドの対応

はじめに データベースに対する操作であるCRUDと、それらを実現するためのHTTPメソッドについての対応表です。 対応表 CRUD HTTPメソッド C (Create) PUT R (Read) GET U (Update) POST D (Delete) DELETE 多分こんな感じだと思います。 ただし、PATCHメソッ…

export default

はじめに 例えばReactのコンポーネントなどで、以下のように関数コンポーネントを定義することがあると思います。 export default function MyComponent() { } 正直このexport defaultが何なのかよくわかっていなかったので、色々調べてみました。 結論 impo…

useStateのsetState()は非同期

はじめに Reactを使用している方なら以下のようなコードは数え切れないほどに書いていることでしょう。 const [state, setState] = useState(0); 今回は、useState()から返されるステート更新用関数は非同期で実行される、という点について書いていきます。 …

カスタムフックの戻り値は配列かオブジェクトか

結論 どっちでもいい。 が、以下の方針に従うのがいいような気がします。 返却される値を全て利用する場合が多い→配列 返却される値の一部を利用する場合が多い→オブジェクト 例えばReact標準フックのuseStateを考えてみます。 useStateは値とその更新関数を…

シェル芸人への第一歩

シェル・ワンライナー160本ノックを買いました。 シェルは全く知識がないわけではないですが、ひとつひとつ知識を増やしていけるよう頑張ります。 1日1問、半年以内に習得 シェル・ワンライナー160本ノック Software Design plus作者:上田 隆一,山田 泰宏,田…

docker-compose

これをやってみました。 qiita.com とりあえず、ファイル等はそのまま書けば動くので、記事の通りにやってみました。 各ファイルの意味などはわかっていないので要勉強。

Auth0を勉強する

仕事でSSO対応が必要になった。 フロントエンドがReactで、バックエンドがSpring(Kotlin)なので、こちらの資料が参考になりそう。 読む。 こっちの方がいいかも。 auth0.com

Spring Security について学ぶ

とりあえず、Getting Startedをやるべき。 実際にやってみたのでメモを残す。 build gradle 以下の2行を追加する。 implementation 'org.springframework.boot:spring-boot-starter-security' implementation 'org.springframework.security:spring-security…

intelliJ IDEAでSpring bootのデバッグ

[メモ]これをやる。 nosix.hatenablog.com

fish shellのプロンプトを変更する

やること タイトル通りです。fish shellを最近使い始めたが、プロンプトに出ているユーザー名とホスト名がいらないと感じているので、消すことにしました。 方法 $HOME/.config/fish/functionsにあるfish_prompt.fishを修正します。デフォルトでは以下のよう…

Flywayを触ってみる(コマンドライン)

はじめに データベースマイグレーションツールの一つであるFlywayを触ってみます。 業務で使用しているものの、私がやっていることはDBに変更があった際のマイグレーションファイルを作成する程度なので、改めて使用方法などを整理できればと思います。 なお…

Dockerを学ぶ(第3回)

はじめに 今回は、アプリケーションを修正してイメージの再作成を行います。 アプリケーションの修正 前回cloneしたアプリについて、TODOが0件の場合のメッセージを修正します。 修正後、最後イメージの作成とアプリケーションの開始を行います。 前回と同様…

Dockerを学ぶ(第2回)

はじめに 今回もDocker公式ドキュメントを実施してみます。 お次はどうやらNode.jsを使用したサンプルアプリケーションを使ったチュートリアルになるようです。 とはいえ、JavaScriptの経験がなくとも問題ないようですよね、安心して実施していきます。(?…

Dockerを学ぶ

はじめに 正直何もわかっていないので、Dockerを学ぼうと思います。 とりあえず何はともあれ公式ドキュメントを見てみるのが1番だろう、ということで公式ドキュメントのget-startedを参考にしています。 なお、実際に使用してみることを第一目標にしているの…

terraformでGCPにインフラ環境を構築する

これをやりました。

Cloud run へデプロイする

Google Cloud Platformの1サービスであるCloud Runを使用してJavaアプリケーションをデプロイします。 手順についてはこちらを参考にしていますので、興味のある方は参照してください。 0. 事前準備 こちらを参考に、Cloud SDKをインストールします。 1. プ…

react-collapsibleを使ってアコーディオンを作成する

アコーディオン、Webでよく見かけますよね。 今回はreact-collapsibleを使用してFAQのようなアコーディオンを作成してみようと思います。 完成形 最初に完成形だけ置いときます。 とりあえずソースを見せろという方はこちらをご覧ください。 準備 まずは必要…

typed-css-modulesを使用して型定義ファイルを作成する

この記事の目的 typed-css-modulesをインストールし、*.module.css.d.tsファイルが自動作成されるようにする。 はじめに ReactにはCSS modulesという機能があり、これを使用するとコンポーネントとCSSファイルを1対1で紐付けられるようになります。例えば、 …

first-childが効かなかったので

first-childが効かない時の対処方法。 first-childが効かない例 例えば以下のようなHTML構造になっている場合、 <div class="myClass"> <h1>title</h1> <p>hoge</p> <p>hoge</p> <p>hoge</p> </div> 以下のようなCSSは適用されません。 .myClass p:first-child { background-color: red; } これは、myClassの最初の子要…

npmってなんですか?

npmってなんですか? 世界一大きいソフトウェアライブラリ ソフトウェアパッケージマネージャー npmを使ってみる npm init オプション -- y npm install 基本の使い方 オプションなど --save-dev -g パッケージを指定しない場合 エイリアス npm uninstall 基…

オリジンってなんですか?

弁当ですか?(違う) 結論 一言で言うと、プロトコル・ドメイン・ポートまでを一塊にしたもの。 解説 例えば、 http://example.com:80/app1/index.html 上記のようなURLがある場合に、 http://example.com:80 ここまでがオリジンということになります。 あ…

useStateに型情報を付与する

useStateに型情報を付与する TypeScript + Reactでフロントエンド開発するなら、最大限型による恩恵は受けたいですよね。 ということで、以下のようにすると型情報を付与したuseStateが定義できます。 booleanなどの場合 この場合は型推論が働く(多分)ので…

スプレッド構文

JavaScriptでたびたび見かけるスプレッド構文についてまとめます。 構文 ...obj; // こういう感じ 配列の場合の例 const arr = [1,2,3,4,5]; const arr2 = [...arr, 6,7,8]; console.log(arr2); //[1, 2, 3, 4, 5, 6, 7, 8] オブジェクトの場合の例 const us…

フロントエンドあれこれ

昨今のフロントエンド事情について行けていないので、アプリケーション作成時によく聞く単語などを整理する。 間違っているところもあるかもしれないが、現時点での理解を残す。 Webpack 複数のファイルを1つにまとめる。らしい。 ESLint JavaScript用の静的…

3連休中の読書

以下の3冊を読みました。 ざっくり内容や感想を書き記します。 証言 羽生世代 証言 羽生世代 (講談社現代新書)作者:大川慎太郎発売日: 2020/12/16メディア: Kindle版 将棋界のレジェンド羽生善治と同世代の棋士を総称して「羽生世代」と呼ぶのですが、その羽…

2つのArrayからMapを生成する

結論 zipとtoMapを使用することで簡単にできます。 val names = arrayOf("one", "two", "three") val nums = arrayOf(1, 2, 3) val nameAndNums = names.zip(nums).toMap() println(nameAndNums) // {one=1, two=2, three=3} zipは、List<Pair<T, R>を返却するメソッド</pair<t,>…

Converter<S, T>を使用してリクエストパラメータを任意の型に変換する

Springのコントローラが受け取る引数は基本的にあらかじめ決められた型のものしか受け付けません。 (Stringなど) そのため、パラメータでオリジナルの型として受け取りたい場合はConverter<K, T>を使用するといいでしょう。 例えば以下のようなコントローラのメ</k,>…

binary(16)からUUIDを得る

sql

SELECT LOWER(CONCAT( SUBSTR(HEX(id), 1, 8), '-', SUBSTR(HEX(id), 9, 4), '-', SUBSTR(HEX(id), 13, 4), '-', SUBSTR(HEX(id), 17, 4), '-', SUBSTR(HEX(id), 21) )) FROM some_table;