TLDR Terraform でやるとブルー/グリーンデプロイのためのインスタンスの作成や古いインスタンスの削除までやってくれます！ 背景 RDS の更新でダウンタイムを最初限にしたかったので、ブルー/グリーンデプロイを検討しました。 ただし、AWS のコンソールでポチポチする作業は怖いので Terraform でできないのかなって調べたらまさか対応してくれます！ https://registry.terraform.io/providers/hashicorp/aws/latest/docs/resources/db_instance#blue_green_update blue_green...
こんにちは、シルベスターです 今回は mapbox で月を再現したいです sky layer で太陽をカスタマイズすることができて、それを月っぽくすればいいのかなーと思います ↓ これが既存のスタイルですが、どんどん変えていきます まず、太陽の中心を変えます（210, 30）→（110, 85） 次は太陽周りの色を青っぽくします #ffffff → #2483ff 月っぽくしたいので intensity を 10 → 2.5 まで落としました 最後に atmosphere color を変えます 月のあるところにそんな変わらないが、少し回転したら違いがわかると思います ↓ before ↓ a...
こんにちは、そして久しぶりです！ タグバンガーズのシルベスターです。 今回紹介するのは、mapbox studio の 3d terrain です。 最近追加された 3D 機能少し気になったので少し触ってみました。 せっかくの 3D terrain なので今回は Outdoors テンプレを使いたいと思います。 早速富士山の方へ 3D terrain を enabled にすると 真上から見るそんな変わらないが、pitch を変えてみると… 富士山が3Dに！ そして、色のないところもあるんですが、 空を有効化すると、このように空のスタイルを変えることもできました さて、 少しずつスタイルを変え...
こんにちは、久しぶり、シルベスターです。 最近デザインのタスクが多く、Figma しか触っていない日々が結構多かったんですね笑 デザイン、またはワイヤーフレームを作ってる時って画面が増えていくと修正するのも面倒くさくなるのが自分だけじゃないと思います、 だけど Figma は便利な機能がいっぱいあってすごく助かります笑 そして今日紹介したいのは auto layout です！ 目次 Auto Layout とは なぜ Auto Layout を使うのか Auto Layout はどうやって作るの？ Auto Layout とは アイテムの間のスペースを保ってくれるグループ的な？笑 アイテムの位...
こんにちは、フロントエンドチームのシルベスターです。 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 Studioとは？ Mapbox Studio is the Mapbox application for managing your geospatial data and designing custom map styles. Use Mapbox Studio to build and design a map to your exact specifications by uploading and editing your own data, utilizing Mapbox-provided tilesets, adding custom fonts and ico...
Read the English article here gulp, gulp-sass のインストール $ npm install gulp gulp-sass -D サンプルのディレクトリ構成 必要なもの: ソースディレクトリ アウトプットディレクトリ gulpfile.js 今回の場合, ソースディレクトリとアウトプットディレクトリはそれぞれ、./sass と ./css となる。 gulpfile.js の設定 gulpfile.js を以下のように設定する gulpfile.js const gulp = require('gulp') const sass = requi...
