【サンプル付】Vue.jsでComponentを作成する! 正しくpropsを使おう!
vue.jsは自由度が高いので、型などを意識せずともそれなりのものを作ることができます。しかし、エラーや保守性を考えた場合、型定義や必須項目の設定をしておかないと後々面倒になるのでしっかりと理解しておきましょう! vue.jsでコンポーネントを作成する時に注意するポイントがあります。 型の安全性 必須項目の設定 デフォルトの設定 それぞれを見ていきます。 型の安全性 変数名によっては解釈の余地があ […]
vue.jsは自由度が高いので、型などを意識せずともそれなりのものを作ることができます。しかし、エラーや保守性を考えた場合、型定義や必須項目の設定をしておかないと後々面倒になるのでしっかりと理解しておきましょう! vue.jsでコンポーネントを作成する時に注意するポイントがあります。 型の安全性 必須項目の設定 デフォルトの設定 それぞれを見ていきます。 型の安全性 変数名によっては解釈の余地があ […]
vue.jsには便利なフィルターという機能がある。 以下のような形で書かれ、“パイプ(‘|’)” 記号を使用する <!– mustaches –> {{ message | capitalize }} <!– v-bind –> <div v-bind:id=”rawId | formatId”></div> コン […]
簡単なサンプルと、NativeとPWAでできることの説明などはこちらが綺麗にまとまっています。 Androidは大抵の機能が使えるのですが、iOS は全然ダメです。肝心のWebPushが使えないです。 アイコンのバッジとWebPushがiOSで対応したら一気に広まるとは思うのですが、今の所は機能面ではNativeに軍配が上がります。 PWA化させるだけなら Localh […]
pinterst,twitter,facebookなど、最近ではほぼ必ずと言っていいほど使われている無限スクロールをライブラリを使わずスクラッチでLravel と vue.js で実装する。 Laravel Framework 5.8.35 vue.js 2.5.17 axios 0.19.0 フロント <template> <div class=”c […]
Vuefityでのバリデーションをまとめる。 最初にバリデーションの一連の流れを紹介し、その後それぞれのフィールドのバリデーションを確認する。 バリデーションの流れ vuetify rulesメールアドレスのフィールドを例にする template <v-form ref="form" v-model="valid" lazy-validation> […]
多言語対応サイトをlaravelとvueで作ったのでその時のポイントをまとめておく。 対応言語を一つ増やすと1.2倍くらい労力がかかるイメージだった 言語は絞った方がいい treeで紹介されている通り、世界中では現在7,099の言語が話されています。もちろんそんなにカバーするのは不可能だし、facebookですら現在48言語です。基本的には英語と日本語の2つで大丈夫だと思いますが、世 […]
Vuetifyを使ってデータを表示するレスポンシブのテーブルを作成します。 vuetifyを使えば、簡単にすばやくサイトを作成できます。最近はテーマなども充実してきて、特に凝ったデザインでない限りはvuetifyを使った方がいいという感じです。 最近だとVuetifyのストアでグッズとかも結構出てるんですけど、あんまりおしゃれなものがないのでもう少ししっかり作ってくれたらなって感じはします(笑)。 […]
前回に引き続きやっていきます。vueファイルを作成し、jwt認証までを行います。 環境は以下の通りです。 Node npm Vue.js Vue Router Vuex PHP Laravel 12.4.0 6.9.0 2.5.17 3.1.2 3.1.1 7.1.16 5.8.34 LaravelMixの設定 webpack.mix.js const mix = re […]