DEGUCHI Tatsuya

DEGUCHI Tatsuya

Tokyo, Japan
prism-react-rendererでRubyのシンタックスハイライトを有効にする方法
Prism

prism-react-rendererでRubyのシンタックスハイライトを有効にする方法

このブログではシンタックスハイライトを実現するために以前の記事でも紹介したようにprism-react-rendererを使っていますが、どうやらRubyのシンタックスハイライトが効いていないみたいだったので対応しました。 解決方法はREADMEのFAQにありました。 手順 ①Prismの本体が必要になるのでインストール yarn add prismjs # or npm install prisimjs ②prism-react-rendererのPrismをwindow.Prismに代入してRubyのコンポーネントを読み込む import React from 'react' // highlight-start import Highlight, { defaultProps, Prism } from 'prism-react-renderer' // highlight-end import './code.sass' // TypeScriptを使っている場合は型が怒られるのでdeclareが必要 declare global { // e
1 min read
Ruby向けのQuadkeyライブラリを作りました
個人開発

Ruby向けのQuadkeyライブラリを作りました

quadkey gemを作りました。ベースは公式にあるC#のものです。 実は3年ぐらい前に公開しているものなので今更ですが。 Quadkeyとは 緯度経度を使って範囲を指定したいときに使われるGeohashと同じようなものです。 Geohashはその仕組み上、長方形で範囲を表現するので若干使いづらいところがあったんですが、Quadkeyは正方形で範囲を表現するのでGeohashより使いやすいかなと思います。 画像のようなイメージです。 地球全体を4分割、更に4分割という感じでドンドン分割していきます。 例えば、北半球のアメリカの辺りがQuadkeyの0になり、アジアからヨーロッパのあたりが1。みたいな感じです。 東日本のあたりを表すのは133となります。 という感じで桁数が1つ増えると範囲が1つ狭まります。 東京タワー周辺とかを表現する場合は1330021123031133になります。 使い方 READMEに書いてある通りですが、前述の東京タワーを例にしてみます。 緯度、経度、精度(桁数)からQuadkeyを計算する Quadkey.encode(35
2 min read
GatsbyJS + Netlify + MDXでブログ作ってみた
Gatsby

GatsbyJS + Netlify + MDXでブログ作ってみた

以前から技術的なことはQiita、それ以外ははてなブログに書くようにしていたんですが、Qiitaは色々問題が出てきて投稿するのをためらうようになり、はてなもちょっと使うのを躊躇するようになってしまってどこにもアウトプットが出来なくなってしまいました。 まあなんとなく察して下さい。 ってことで何か良いサービスないかなと探したんですが良いものが見つからず結局自分で作るかということになりました。 ちなみに要件はこんな感じでした。 * Markdownで書ける * エクスポートできる * OGPがいい感じになる * はてなブログとかQiitaとかのイメージ * 今どきの見た目 * 技術的な記事以外もOK * メンテナンスコストなし(できれば) * 独自ドメイン設定できること(マストではない) もし何か良いサービスあれば教えてください。 Qrunchは結構条件に当てはまったんですが、技術的な記事以外がNGだったので今回は見送りました。 技術スタック * Gatsby * Netlify * MDX(Markdownからコ
2 min read