概要 Nuxt.jsのプロジェクトをCircleCIで動かしてみる config.ymlの作成 Nodeプロジェクト用ののテンプレートを利用してconfig.ymlを作成する プロジェクトルートから .circleci/config.yml を作る。 $ mkdir .circleci $ touch .circleci/config.yml config…

複数コンポーネントで状態管理をするのに便利らしいVuexを使ってみた。 Vuexストアに状態管理を任せて、各コンポーネントはストア経由で状態変更することで、状態変更を一元管理できるっぽい。 ja.nuxtjs.org ストアの作成 store/sample.js を作成する。 sto…

概要 http://localhost:3000/sample?hoge=abc123 のようにRequestされた場合に、 abc123 を画面に表示してみる asyncDataを使う pageコンポーネントの場合、asyncDataというメソッドを使うと、Context経由でリクエストの情報を取得できる。 asyncDataはレン…

Nuxt.jsのテストをjestで書くというのを先日やってみたが、Assertionにpower-assertを使うようにする。 su-kun1899.hatenablog.com power-assertの導入 babel連携が必要になるので、 power-assertに加えてbabel-preset-power-assertをインストールする。 git…

Nuxt.jsには静的ファイルの生成がサポートされており、成果物を静的ファイルとしてホスティングできるようになる。 開発中など、この静的ファイルをNuxt.jsに依存させないで確認したいときに、http-serverを使うと便利。 静的ファイルの生成 vue-cliから作成…

概要 Nuxt.jsで、jestというテスティングフレームワークを使って、コンポーネントのテストを書いてみました。 facebook.github.io 準備 ※vue-cli でNuxt.jsのプロジェクトは作成済とします。 jest-vue-preprocessorをインストールします。 たぶんVueとjestを…

概要 とりあえずNuxt.jsはVSCodeで書いてみてるんだけど、フォーマットをかけるとエラーになってしまう。 前提 Veturというプラグインを入れています。 github.com 結論 Prettierプラグインを入れる。 github.com VSCodeの設定に下記を追加する。 "prettier.…

vue-cliからテンプレートプロジェクトを作ると、ディレクトリがいくつも作られるのだが、それぞれの役割についてわかったこと。 基本的には↓に書いてあるけど。 ja.nuxtjs.org テンプレートプロジェクトを作る $ vue init nuxt-community/starter-template n…

RSGT2018に行ってきた。 別にレポートでもなんでもない。 参加して感じたことや考えたことが、自分の中で整理されて言葉になってきたものを、ただ書きなぐっただけのちら裏。 2018.scrumgatheringtokyo.org Scrumが好きだ いろんな話を聞いてやっぱり僕はScr…

npmってなんなのん？ npmはNode.jsを使う時のパッケージ管理ツールっぽい。 mavenとかGradleに近いものと理解した。 使ってみる nodeが入っているなら一緒にインストールされているっぽい。 $ npm -v 5.6.0 package.json workspace的なところで npm init す…

Next.js とか Nuxt.js とかって何よ Next.js: React アプリケーションをサーバーサイドレンダリングするためのフレームワーク Nuxt.js: Vue.js アプリケーションをサーバーサイドレンダリングするためのフレームワーク サーバーサイドレンダリングって何よ q…

有名な本だけど、はじめて読んだ。 その名の通り、UNIXというOSの考え方の解説本なんだけど、その考え方が本当に素晴らしいと思う。 「Small is beautiful」に始まり、「できるだけ早い試作」「効率より移植性」など、プログラミング・エンジニアリング・そ…