Kubernetes 初心者の JK です 今回はローカルで Kubernetes の環境を作成して本番環境と同じようにドメインでアクセスして動作するかを確認する方法をご紹介します なお、DNS の設定は Mac のやり方となるため他の OS では異なる設定が必要になる場合があります サンプルリポジトリ 下記のリポジトリを使用します https://github.com/koyama-tagbangers/k8s-web-app-sample api ディレクトリには node.js の簡易 API サーバプロジェクトを用意しています web ディレクトリには next.js を使用したプロジ...
こんにちは、久しぶり、シルベスターです。 最近デザインのタスクが多く、Figma しか触っていない日々が結構多かったんですね笑 デザイン、またはワイヤーフレームを作ってる時って画面が増えていくと修正するのも面倒くさくなるのが自分だけじゃないと思います、 だけど Figma は便利な機能がいっぱいあってすごく助かります笑 そして今日紹介したいのは auto layout です！ 目次 Auto Layout とは なぜ Auto Layout を使うのか Auto Layout はどうやって作るの？ Auto Layout とは アイテムの間のスペースを保ってくれるグループ的な？笑 アイテムの位...
先月から Tagbangers にジョインした生粋のハマっ子こと JK です（元インターン生） 私の好きなプログラミング言語の1つは Kotlin です Kotlin は JetBrains 社が開発した言語で主に Android アプリ開発で使用できる言語として有名です JK ≒ JetBrains Kotlin 今回はそんな Kotlin を用いて簡単な Web アプリを1から作成していこうと思います！ GitHub 今回作成するプロジェクトの完成形は下記のリポジトリにプッシュしています koyama-tagbangers/kotlin-react-spring-sample What's...
細かすぎるのですが Jira の仕様の小ネタです。 Agile な開発をする際に使える Jira Software のスプリントですが、今回はある１プロジェクトのチケットをエピックリンクでフィルタしただけのスプリントで、 かつ、プロジェクトの権限はすでについているのに警告表示されてしまう場合です。 フィルタを元にスプリントを作っていると時々こんな状態になります。 ちなみにこのスプリントで指定したフィルタはこんな感じです "エピック リンク" = ABC-1111 ORDER BY ランク ASC 警告文は「すべてのプロジェクトにて「スプリントの管理」権限が必要」と書いてありますね さて、これを...
はじめに 本日は、以下のようなシーケンスで OpenID Connect の Authorization Code Flow を確認していこうと思います。 開発済みのプロジェクトのいくつかで Keycloak,OpenID Connect, Spring Cloud Gateway が使われており順に理解していく必要を感じたため、今回は基本的な構成から学んでいきたいと思います。 UserInfo Endpoint(Spring Boot) および IdP(docker container として起動) のサンプルコードは以下のリポジトリに用意しました！ https://github.com/k...
この記事について AWS ManagedのElasticsearchでCustom PackageやUser Dictionaryが使用したかったので、試してみると通常のElasticsearchとの差異があったので気になり何が実行可能でなにが実行かのうでないのかをはっきさせたく検証を行いました。 ターゲット層はDocker等でElasticsearchを使用していてAWS ManagedのElasticsearchにMigrationしたいかたやまたあたらしくElasticsearchを使う方にも有益な情報だと思います。 Elasticsearchの準備 Elasticsearchを作成する...
こんにちは、フロントエンドチームのシルベスターです。 React で custom marker を作りたいなーと思っていろいろ調べた結果、 uber の react-map-gl と styled-components を使うと簡単に作れるねってことがわかりました なぜかと言うと、react component として import できて、必要な props を渡すだけでできるから？笑 早速やってみましょう Getting Started React-map-gl npm i react-map-gl Styled-components npm i styled-components マッ...
突然ですが、社内で Mapbox がアツいので何か書こうと思います。 とりあえず Web で地図を作るとするなら、動的な情報が表示できるものでないと、 極論、「じゃあ画像でも貼っとけばいいじゃん！」という話なので、 動きのあるデータを地図上に表示する準備として、まずは レイヤーに格納する情報を動的に取得できるようにしてみようと思います。 （とはいえ、今回は 鎌倉なびマップ の静的なデータを利用したため、動的に更新される事はないのですが） それではやっていきましょう。 Mapbox では、レイヤーに関わる情報を Source と Layer に分けて保持します。 map.addSource で ...
ml5.jsはTensorflow.jsをラップしてブラウザ上で機械学習を使ったWebアプリケーションを簡単に作成できるライブラリです。 以下のような簡単なコードだけで画像のカテゴリー分類などができます。 const classifier = ml5.imageClassifier("MobileNet", () => { console.log('model ready!') }); const img = document.querySelector("#myImage"); const prediction = classifier.p...
MapboxGLで使うGeocoderの紹介です。 地名、住所などから経度緯度を調べることができます。 Your browser does not support HTML5 video. まずはMapboxのユーザー発行後、Access tokenを取得する必要があります。 今回はpk.〜から始まる物を使います。 https://account.mapbox.com/ ステップを踏んでやり方を教えてくれるのでプロジェクトに合わせてinstall&importしていきます。 この後の細かいところの説明は公式にお任せしまして... https://docs.mapbox.com/mapbox-g...
