React NativeのTextタグで改行したいけど{"\n"}を使いたくない時はTagged Template Literalsを使う
なにこれReact NativeのTextタグで複数行テキストを書く場合、改行がめんどくさいですが、Tagged Template Literalsを使えばスッキリ書けます。以下に動くソースコードを用意しています。1. 公式リファレンスまず...
2020/07/24
Gatsbyビルドチューニング ビルド時間を15分から7分に短縮するためのTips 7選
なにこれ自分のブログ(Gatsby製)のビルドが遅すぎてNetlifyでタイムアウトしてしまうので、ビルドチューニングをしました。15分以上かかっていたビルドが7分以下になり50%短縮できたので、その時の知見をまとめます。割と地味な作業が多...
2020/06/21
Gatsbyビルドエラー「window is not defined」への対処法
なにこれreact-cytoscapeのようなwindowオブジェクトを前提としたライブラリをGatsbyで使おうとすると、gatsby developのときは正常動作するにもかかわらず、ビルド時にだけwindow is not defin...
2020/05/23
Ionicの全体像、React Native・Flutterとの比較 2020年5月
なにこれクロスプラットフォームアプリを開発する手段はいくつかありますが、とっつきやすそうなIonicについて調査しました。実装方法というよりは、全体像と、React Native・Flutterとの比較についてまとめています。Ionic概要...
2020/05/02
もくもく会ならShinjuku Mokumoku Programmingがオススメ
なにこれ一時期いろんな勉強会に行きましたが、「勉強会に参加すると勉強している気になるだけで実際そうじゃない」ので最近はモクモク会にしか顔を出さなくなりました。その中でもShinjuku Mokumoku Programming(通称「新宿も...
2019/06/23
Gatsby + Netlify + ZapierでRSSリーダーを作る
なにこれ自分専用のRSSリーダーをGatsby + Netlify + Zapierを使って作りました。Gatsbyビルド時にRSSとOGPを取得して、Webサイトに表示しています。今回はこのWebサイトのビルドの仕組みと、Gatsbyビル...
2019/06/18
Netlify Formsでファイルを非同期アップロード with React + Formik + Axios
なにこれNetlify FormsはNetlifyにホストしている静的サイトでお問い合わせフォームを作れる機能です。DBを用意しなくても、お問い合わせフォーム送信結果はNetlify側で保持しれくれます。Netlifyの管理画面からCSVダ...
2019/06/02
Gatsbyにおける外部取得画像へのgatsby-image適用方法
なにこれGatsbyで画像を扱う場合gatsby-imageを使うとイイ感じに最適化してくれます。Webサイトのリポジトリ内の画像についてはgatsby-config.jsで簡単に設定できますが、今回はビルド時に動的に取得する外部画像に対し...
2019/06/02
Gatsbyで2種類のマークダウンファイルの区別する方法
なにこれGatsbyでWebサイトを作るときに、ブログや職種紹介など2種類以上のマークダウンファイルを管理する場合があると思います。通常だとMarkdownRemarkNodeのfileAbsolutePathでしか両者のマークダウンファイ...
2019/06/02
GatsbyのルートページにContextを設定する方法
なにこれGatsbyでは、gatsby-node.jsのcreatePagesで以下のようにページを作成できます。ただルートページ（index.jsのページ）はGatsby側で生成されるので通常はContextが設定できません。しかし場合に...
2019/05/31
パスを渡せばgatsby-imageで画像を表示してくれるコンポーネントの作成方法
なにこれこんな感じでgatsby-imageの画像を表示したい。そんなコンポーネントの作成方法です。 const filename = 'filepath/to/myimage.png' return <Image filen...
2019/05/13
