Tagbangers Blog

J K

styled-components で作ったコンポーネントのスタイルの上書きができない場合の解決策

styled-components でスタイリングしたコンポーネントがあります const StyledButton = styled.button`   border-radius: 6px;   padding: 16px;   background-color: coral;   color: white;   font-size: 1.5rem;   font-weight: bold; ` export default StyledButton あらかわいい このコンポーネントを styled の引数に入れることでスタイルの上書きができます import Styl...

Spring REST Docs のデザインをお手軽にオシャンティーにする

おはようございます、BE 側の JK です Spring で REST API を設計した際にドキュメント化する方法として Spring REST Docs があるのをみなさんご存知でしょうか Spring REST Docs 公式のサンプルがいくつかあるので試しに見てみましょう 今回は唯一 Maven を使用したサンプルである "Spring Data REST" プロジェクトを使います(他は Gradle でしたねー) git clone https://github.com/spring-projects/spring-restdocs.git cd spring-restdocs/s...

Deno を使用して RESTful API → CSV 書き出し

こんばんわ、FE 側の JK です 業務で使用するちょっとしたツールを Deno で作ってみたかったので調べてみました Deno とは Deno - A secure runtime for JavaScript and TypeScript Node.js の作者によって作られた新しいランタイム環境で 2020 年にリリースされたばかりです TypeScript がゼロコンフィグで使用できるのが嬉しい点です node の文字を入れ替えると deno になる話は有名だそうです node -e "console.log('node'.split('').sort().join(''))" 準備 ...

[Mac 版] 開発用ローカル Kubernetes 構築方法2種

Kubernetes 初心者の JK です 今回はローカルで Kubernetes の環境を作成して本番環境と同じようにドメインでアクセスして動作するかを確認する方法をご紹介します なお、DNS の設定は Mac のやり方となるため他の OS では異なる設定が必要になる場合があります サンプルリポジトリ 下記のリポジトリを使用します https://github.com/koyama-tagbangers/k8s-web-app-sample api ディレクトリには node.js の簡易 API サーバプロジェクトを用意しています web ディレクトリには next.js を使用したプロジ...

Spring + React の Web アプリを Kotlin のみで作成する

先月から Tagbangers にジョインした生粋のハマっ子こと JK です(元インターン生) 私の好きなプログラミング言語の1つは Kotlin です Kotlin は JetBrains 社が開発した言語で主に Android アプリ開発で使用できる言語として有名です JK ≒ JetBrains Kotlin 今回はそんな Kotlin を用いて簡単な Web アプリを1から作成していこうと思います! GitHub 今回作成するプロジェクトの完成形は下記のリポジトリにプッシュしています koyama-tagbangers/kotlin-react-spring-sample What's...

Angular Material 6でFont Awesomeを利用してアイコンを表示する

Angular Materialではを使用することでMaterial Iconsを簡単に利用することができます。 Angular Material - Icon Material Icons 利用する際はindex.htmlでスタイルシートを読み込むことを忘れないよう注意してください。 しかしMaterial Iconsは種類が少なく、欲しいアイコンがない場合があります。 そんな時はFont Awesomeが便利です。 Font Awesome かなりの種類のアイコンが揃っており、基本的に無料で利用することができます。 有償のPro版では各アイコンの見た目の違うバージョンが利用できます。 A...