Latest Stories

Tried & published Next.js 9.0 + TypeScript + redux-observable starterJuly 10, 2019

Next.js 9.0 has been released. I tried it with my usual development libs (redux-observable, styled components, etc…), and I found some gotchas, so I’m writing down this. redux-observable Using redux-observable with Next.js, we have to put some code to , and the style is little bit different comparing to pure react development. There are some libraries that helps it next-redux-wrapper next-redux…

Keep Reading →

Next.js 9.0 + TypeScript + redux-observable を試してstarterとして公開したJuly 09, 2019

Next.js 9.0が出たので試してみたところ、色んなところでハマったのでメモとして残す。 redux-observableを導入する段階でハマる Next.jsでreduxやredux-observableなどを使う時は に処理を書くらしく、いつもと勝手が違ってハマった。 next-redux-wrapper とかあるみたいだけど最終的には使わずに こんな感じ で書いた。 CSSのimportでハマる Semantic UI React を導入する際に という感じでCSSをimportしようとするとエラーが出てハマった。 Next.jsではwebpack.config.jsで書いているような設定をnext.config.jsに書くらしかったので書いてみたもののサクッと動かなかった。 そして というのを使えば動くという情報を見つけたので試してみたらInvalid Option…

Keep Reading →

Migrate redux-observable boilerplate from ES6 to TypeScript & HooksJune 13, 2019

I’ve used my redux-observable boilerplate frequently when starting development, and it’s became a bit old. So I’ve decided to migrate it to TypeScript + Hooks + Rxjs 6. I’m leaving the record for my own review, and for the people who is trying to do similar things. By the way, the result is this repository. https://github.com/kunihiko-t/redux-observable-ts-hooks-boilerplate Build the foundation…

Keep Reading →

手持ちのredux-observableのboilerplateをTypeScript & Hooks化したJune 11, 2019

何か開発を始める時に度々使っていたredux-observableのboilerplateがちょっと古くなってきたので、この際TypeScript化してHooksも使うようにしてrxjsも5系から6系に上げよう!と思いたち、なんとか動くところまで持っていけたので、同じような事をしようとしてる人達と自分の振り返りのために記事として残すことにしました。 ちなみに成果物はこれ↓ https://github.com/kunihiko-t/redux-observable-ts-hooks-boilerplate とりあえず土台を作る フルスクラッチで1つ1つ設定など書いていくのが面倒だったので してからejectしました。 typescript-eslintなどの設定はこちらを参考にさせていただきました。(実際のところ全部終わってから追加しましたが) http://watanabeyu…

Keep Reading →

House Prices: Advanced Regression Techniquesをやった時にハマったことNovember 30, 2018

簡単そうなKaggleのCompetitionに参加してみようと思い、House Prices: Advanced Regression Techniquesをやってみました。 https://www.kaggle.com/c/house-prices-advanced-regression-techniques/leaderboard 特徴量エンジニアリングなどはこのあたりを参考しました。 https://www.kaggle.com/pmarcelino/comprehensive-data-exploration-with-python…

Keep Reading →

Serverless Framework + SAM CLI + Golangで開発を始める準備をした時のメモSeptember 11, 2018

はじめに Serverless Framework (AWS Lambda 利用) SAM CLI を使ってGolangのウェブアプリを開発する準備をした時のメモです。 主に ローカルで開発する時どうするのか GolangのWAF( chi とか)を動かすにはどうすれば良いか がイマイチわかってなかったでそのあたりを中心調べました。 オフライン開発 オフライン開発には serverless-offline というプラグインがあるらしいので試してみましたが、Golangに対応していないようなので違う方法を探すことにしました。 色々と調べてるとAWSが出しているSAM CLIというローカル開発用のツールが提供されているようだったのでとりあえずこれを使ってみることにしました。 Python2系だとインストールに失敗するようなので、Macを使っている人はpyenvなどで…

Keep Reading →

React Component Pattern NoteJuly 11, 2018

This article is a React Component Design Pattern note for myself. Render Props Like above code, it literally use render prop for reuse components. In this case, we use following code as an example. This example has two input field and just sum up them. Using render props make above code reusable, like following. Reuse it with a component squaring the total value. It seems like a bad example, so I…

Keep Reading →

Planet Understanding the Amazon from SpaceをやるJuly 10, 2018

今回はLesson3あたりで解説されている Planet: Understanding the Amazon from Space をやっていきます。 今回もPaperspaceのGradient°を利用します。 動画やコード、動画の解説は下記リンクを参照してください。 http://course.fast.ai/lessons/lesson3.html https://medium.com/@hiromi_suenaga/deep-learning-2-part-1-lesson-3-74b0ef79e56 https://github.com/fastai/fastai/blob/master/courses/dl1/lesson2-image_models.ipynb 下準備 KaggleのCLIを使えるようにしてデータをダウンロードし、解凍します。 7z…

Keep Reading →

React Component構築時のパターンメモJuly 08, 2018

Reactを使ってアプリを作る時にどう書くのが良いだっけ?ってなりがちなのでメモ。 Render Props みたいな感じで文字通りrender propsを利用いてコンポーネントを再利用するテクニック。 数値入力フィールドを2つ持ち、足し算の結果を表示するコンポーネントをベースにして考える。 Render Propsを使ってで再利用可能なコンポーネントに書き換えると下記のようになる。 合計値を二乗するコンポーネントで再利用する。 ちょっと例が良くない気がするのでそのうち差し替えるかも。 詳しくこのあたりをどうぞ。 https://reactjs.org/docs/render-props.html Higher Order Components コンポーネントを受け取ってコンポーネントを返す関数。 下記はRender Propsのところで作ったAdderをHoC化したコード。 https…

Keep Reading →

gatsby-starter-netlify-cmsを導入したJuly 05, 2018

動機 ちょっと前にNetlify + Gatsby + Contentful関連の記事を読んで、とりあえず https://github.com/greglobinski/gatsby-starter-personal-blog こちらのstarterのデザインがいい感じだったのでテンプレートとして導入してブログを書いてみたのですが、デフォルトだとファイルシステムからコンテンツを読むようになっていて、contentfulに対応させようと色々と変更してみたものの思ったより手間がかかりそうで放置していました。 そして今日ふとgatsbyのstarterでいい感じのものがないかなぁと このあたり を漁っていて見つけたのが gatsby-starter-netlify-cms です。 デモを確認したところデザインがシンプルで自分好みであり、 Netlify CMS というcontentful…

Keep Reading →

Dogs vs. Cats Reduxを解いてKaggleにsubmitした時のメモJuly 02, 2018

Fast.ai の Deep Learning Part 1: Practical Deep Learning for Coders の動画を観たり課題を解いたりした時のメモです。 今回は Dogs vs. Cats Redux: Kernels Edition を このJupyter Notebook を参考にしながらPaperspace上で動かしてKaggleへSubmitするところまでやります。 環境構築 まず、動作させる環境について確認しました。 最初は無料だしGoogle Colabを使おうとしていたのですが、確認のためJupyter Notebookを動作させているとメモリが足らずエラーが出始めたり、別タブに移動して時間が経つと動作が中断されたりといった感じで厳しそうだったので、ストレスなく作業するために動画内でも言及されていた Paperspace…

Keep Reading →

Stub database connection with GORMMarch 29, 2017

This article is a note when I was looking for how to stub database connection with GORM . At first, I found go-sqlmock . It stubs database connection. I thought that it’s easy to make connection stub. go-sqlmock makes stub connection & return it. So, I tried to set db to GORM. But GORM hides db field of their DB struct . I looked into GORM & go-sqlmock , and I understood following. GORM…

Keep Reading →