Vue.js アプリケーションを Docker 化する — Vue.js
最終更新日: 2019年10月29日 簡単な例あなたははじめての Vue.js アプリケーションを素晴らしい Vue.js webpack テンプレート を利用して作成し、Docker コンテナで実行もできることを同僚に披露したいと思っています。 ではプロジェクトルートに Dockerfile を作成しましょう: FROM node:lts-alpine # 静的コンテンツを配信するシンプルな http サーバをインストールする RUN npm install -g http-server # カレントワーキングディレクトリとして 'app' フォルダを指定する WORKDIR /app # `package.json` と `package-lock.json` （あれば）を両方コピーする COPY package*.json ./ # プロジェクトの依存ライブラリをインストールする R
vue-router query stringで配列を扱う - とりあえずphpとか
vue-routerでquery stringをパラメータにつける際に配列がうまくいかなかったのでそのときに調べたことをメモしておく。想定しているurl以下の形。 http://localhost/my-component/?val=1&arr[]=10&arr[]=20最初に試した書き方 this.$router.replace({ name: 'my-component', query: { val: 1, arr: [10, 20] } }) // 配列で指定した部分が配列にならない・・・ // http://localhost/my-component/?val=1&arr=10&arr=20vue-routerのドキュメント見てたらparseQueryとstringifyQueryというのがあった https://router.vuejs.org/ja/api/options.h
【Vue.js】Web API通信のデザインパターン (個人的ベストプラクティス) - Qiita
はじめに Vue.jsを使用したアプリケーションでのWeb API呼び出しのデザインパターンについて調べてみました。 しかし検索して出てくるチュートリアルやサンプルは、コンポーネント内でaxiosをインスタンス化していたり、Vuexの中でaxiosを使用するというサンプルがほとんどでした。 しかし実際のプロダクトでこれをしてしまうと コンポーネント内でAPIアクセスの直書きによって単体テストが困難に Vuex(actions)の肥大化(使い回さない処理はStoreに記述しないほうがいいとする文献もある) API通信部分をPureJSでモジュール化しても依存度がイマイチ下がらない（コンポーネントでモジュールをインポートするため）。 などなど問題になることが多そうでした。 ある日、Jorge氏が投稿した「Vue API calls in a smart way」という記事にたどり着きました。
Vueでアプリケーションを作るときに抑えたい実装 | MixDesign
const state = () => ({ posts: [], isPostsLoading: false }) const mutations = { setPosts(state, payload) { state.posts = payload }, onPostsLoadingStart(state) { state.isPostsLoading = true }, onPostsLoadingFinished(state) { state.isPostsLoading = false } } const actions = { async fetchPosts({ commit }, payload) { commit('onPostsLoadingStart', {}) const { response } = await // ここで非同期処理 commit('setPo
グリグリ動くUIをVueとSVGでサクッと書く - No Regrets in Bathing
これは Vue.js #3 Advent Calendar 2017 – Qiita 4日目の記事です。 こんにちは。SVGで色々なコンポーネントを作っているものです。最近の作品は下記のような感じです。 Webでグリグリ動くUIを作りたい！！という一心でやっています。 これらはほとんどSVGとVueの組み合わせのみで作っています。依存が少ないというのは大事で、ライブラリ間の相性でハマったり、いろんなドキュメント間を往復することがなくなります。 Webでグリグリ動くUIを作るのは基本的にめんどくさいです。jQuery pluginを駆使して作るのも闇が多いですし、divやcanvasをゴリゴリするのも結構手間がかかります。 ですが、最近はSVGで高度なUI実装されることが増えてきた気がします。特に自分が衝撃を受けたのは、CacooがFlashからSVGにスイッチしたことです。 nulab-i
Vue.jsでD3.jsを使わずにグラフを実装する - Qiita
Vue.jsでグラフ を実装するサンプルコードを探すとD3.jsを用いている例が結構見つかります。 しかし本当にD3.jsが必要なのでしょうか？ この記事ではD3.jsやその他グラフライブラリを用いずにVue.jsのみで実装したグラフについて解説します。 TL;DR SVGでおｋ グラフコンポーネントにSVGのテンプレートを書く テンプレートに必要な値を computed でじゃんじゃん作る デモとリポジトリ デモ： https://haribote.github.io/vue-graph-demo/ リポジトリ: https://github.com/haribote/vue-graph-demo 折れ線グラフ、棒グラフ、円グラフ、の3つのグラフを実装してみました。 データの内容はプロ野球における直近5シーズンの年間入場者数です。 NPBが公開している統計データからJSONを用意しました
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
