Vue.js - Qiita Advent Calendar 2016 - Qiita
About reserved postingIf you register a secret article by the day before the same day, it will be automatically published around 7:00 on the same day. About posting periodOnly articles submitted after November 1 of the year can be registered. (Secret articles can be registered anytime articles are posted.)
Vue.jsを使う際のベストプラクティスについて考える - Qiita
Vue.jsは公式のドキュメントが非常に充実しており、またフォーラムでの議論やコミュニケーションもとても活発です。開発中に何か問題に遭遇した際には、ドキュメントやフォーラムに載っている情報を参照することで、多くの問題は解決できるといって差し支えないでしょう。しかしながら、現実世界のアプリケーションを開発していると、そういった情報だけでは解決が難しい個別具体的な問題や、そもそもどう実装すれば良いのかわからない、といった場面に遭遇することも多々あります。 筆者自身がVue.jsを利用してフロントエンド開発をしてきた経験に加え、Vue.jsの公式のドキュメントやサンプルプロジェクト、そしてVue.jsを利用しているOSSのプロジェクトやVue.jsのプラグインなどのソースを読んで蓄えてきたノウハウを本資料にまとめました。 「ベストプラクティス」と銘打ってはいるものの、筆者の好みや開発経験に依存す
フロントサイドのバリデーションにはvalidatorjsが便利 - Qiita
Webフォームのバリデーションをするのって面倒ですよね。どうせサーバサイドでバリデーションするのに…。 といいつつも、利用者を苛つかせないためにも、無駄な通信を減らすためにもフロントサイドのバリデーションは重要です。 何か良いライブラリが無いかなと思ってgithubを漁っていたら、良さげなライブラリを見つけました。 validatorjs "A data validation library in JavaScript for the browser and Node.js, inspired by Laravel's Validator."とあるとおり、LaravelのValidatorに似た感じになっているのが特徴です。 Laravelといえば、JSはreact.jsではなくてvue.jsだろうということで、Vueのコンポーネントでのサンプルです。(CSSはBootstrap) もちろ
React、Angularになじめなかった僕に手を差し伸べてくれたVue.js - Qiita
ギークハウス Advent Calendar 2016の12月２２日の記事です。 他の方とは、全然違う雰囲気になってしまいましたが、読んでいただけると幸いです。 なぜVue.js？？ 普段の仕事では、Ruby/Railsなので、フロントエンド周りは、jQueryにCoffeeScriptで片手間感覚... ↓ しかし最近のフロントエンド界隈は、良くも悪くも盛り上がっていて楽しそうだなあと思う日々。 ↓ いろいろ、ググって調べてみると、ES6、Babel、Reactふむふむ...🤔 ん？？ Webpack? JSX?? Flux?? Redux?? 「落ち着け！とりあえず日本語でOK」状態。。正にこの記事で書かれている状態そのものでした。 ↓ Reactとかでイケてるフロントエンド開発をちょっと試したいと思っても、BabelやWebpackの設定など環境構築でつまづき、肝心のアプリケーショ
Vue.jsを使った大規模開発に必要なもの - Qiita
初めに 正直JS界隈のエコシステムは難しいです。わからないことが目白押しです。 今までVue.jsをブラウザ上でなんのエコシステムも使わずに使ってきましたが、 規模が大きくなるとしんどくなるのは明らかなので Vue.jsガイド：大規模アプリケーションの構築を参考にwebpackを使ったりnpmを使って、 それっぽい環境を作って一からコードを書いてみました。 （編注：上記リンクはv1.0当時のものです。v2.0のガイドは単一ファイルコンポーネント、プロダクション環境への配信のヒント、ルーティング、状態管理、単体テスト、サーバサイドレンダリングなどをご覧ください。） 前提 Vue.jsガイド：大規模アプリケーションの構築の指示に従い構築するだけですが、この時点で以下の様な選択肢がある模様です。 プリプロセッサ？の違い Webpack(こっちだけ触ります) Browserify ルーティング オ
Vue.jsのサーバーサイドレンダリングをGAE/Goでやる #vuejs #golang - Qiita
メリークリスマス！（昨日） これはVue.jsアドベントカレンダーの記事です。 代打です。 僕は初日にサーバーサイドレンダリングについて書きましたが 今回もサーバーサイドレンダリングです。 今回の内容は本当は初日に書きたかったのですがずっとうまくいかずに悩んでいたけどつい昨日できたGoサーバでのSSR（サーバーサイドレンダリング）です。 GoでSSRをするメリットとしてまず一つにポータビリティです。 Node.jsもポータビリティはありますが、Goであればアセットもワンバイナリにまとめることができるのでバイナリを配置するだけでWebUIがあるツールも作ることもできるかもしれません。 そして、僕にとって１番のメリットであるApp Engine(GAE)でSSRができるようになります！ SSRについては初日の記事を見てください！ サンプルの実行 https://github.com/k2wan
レガシー管理ページをちょっと動的にするためだけのVue.jsとPHP - Qiita
こんにちは！ 片手間JSerの者です！ レガシーPHPの方から来ました！ みんなPHPで動的な管理画面とか作りたいじゃないですか。私などは怠惰ななまけものですので、動的なページ、特にブラウザ側での動きがあるページを作るのはだるいなあ、とか思ってしまふわけですよ。 きちんと設計したアプリケーションも良いものなのですが、水は低きに流れると申しまして、Vue.jsは雑に動くコードを異常に簡単に書くこともできます。 PHPだけで片手間 スゴイ雑に、こんなページを作ってみます。これは、何かの商品の一覧と説明文を登録する画面ってことにします。 このコードの思想としては、一個づつ追加して保存すると最後に空欄ができるのでJavaScriptがなくてもコンテンツを追加するアプリケーションが実現できる！！！ って感じです。 ソースコード: https://github.com/zonuexe/katatema
Vue.jsで10万件のリストを表示する - Qiita
はじめに Vue.jsは軽量ですが、数万件のリストを並べるとそりゃ普通につらい。 だから目に見えるとこ以外はdom描いてもらうのやめるってコードです。 デモ デモ(jsfiddle) コード <div id="app"> <div style="overflow:auto;height:170px;" @scroll="getScrollParam"> <ul :style="listStyle"> <li style="height:17px" v-for="num in displayList">{{num}}</li> </ul> </div> </div> new Vue({ el: '#app', data: function(){ return { list:list, scroll:0,//スクロール量 scrollMax: (list.length - displayRow
Vue.js のコンポーネント に JSライブラリ を統合する - Qiita
はじめに Vue.js いいですよ、Vue.js。 シンプルでパワフルです。 Angular(JS)と較べて、学習コストが半端なく低い。 直感的にDOM操作を行えます。 同じくMVVMを基盤にするKnockoutJSよりもシンプルに 書けます。 日本語の情報が充実しているので、今以上に ブレイクする可能性があると思っています。 公式サイトのガイド・APIリファレンスが有志の方のおかげで 日本語にも対応しているので、クライアントJSにあかるい方が いれば、即採用可能な状況になっています。 コンポーネント(View Model)へのJSライブラリ組込み v3.x JSライブラリをディレクティブとしてラップし、 JSライブラリを適用する要素にディレクティブを独自属性と して追加する JSライブラリをディレクティブとしてラップし、 JSライブラリを適用する要素にディレクティブを独自属性と して追加
クライアントサイドフレームワークの歴史 - Qiita
クライアントサイドJavaScriptフレームワークの歴史を整理します。 1stリリース順 1stリリース順に並べます。 有史以前 2008年 6月 SproutCore 10月 Cappuccino 第1世代 クライアントサイドJavaScriptに、どうにかして構造を与えようとした世代 2010年 7月 Knockout 10月 Backbone.js 10月 AngularJS 第2世代 フルスタック化を目指した世代 2011年 6月 Ember.js 7月 Agility.js 8月 Derby 9月 Spine 11月 Knockback.js 12月 Meteor 2012年 CanJS 第3世代 virtual DOM や Object.observe() を使った（使おうとした）世代 2013年 1月 Flight (Flight is not under active d
VueServer.js の紹介 - Qiita
この記事は、Vue.js Advent Calender 2015 1日目の記事です。 みなさん、VueServer.js というのをご存じでしょうか？ この記事では、軽く VueServer.js についてゆるい感じで紹介したいと思います。また、最後に Express に組み込んだデモ的なものを紹介したいと思います。 VueServer.js とは? VueServer.js は、その名のとおり、Vue.js で作ったコンポーネントを、サーバサイドでも動作させることができるオープンソースなライブラリです。 Vue.js は React.js の Virutal DOM とは違って、直に DOM を利用してレンダリングしているため、サーバサイドで動作させるには、 jsdom: DOM エミュレーションライブラリ phantomjs: ヘッドレスブラウザ Prerender.io: Pre-
はじめてのVue.js - 単一ファイルコンポーネントを作れる環境構築編 (npm + gulp + browserify + babel + vueify)
この記事では、Rails や PHP といったサーバーサイドのプログラミングをメインでやっている人向けに Vue.js を用いた簡単な TODO 管理アプリを作るまでを、2回に分けて解説します。 なお、著者の作業環境の都合上、Mac OSX を対象として記事を執筆しています。 1回目では、Vue.js を用いたアプリのモダンな開発環境構築について説明いたします。 Vue.js とは？ Vue.js は「リアクティブなデータバインディング」と「コンポーネントシステム」に主眼を置いたフロントエンド向けの JavaScript ライブラリです。 最も簡単な vue.js の始め方 (script タグで vue.min.js を読み込む) jQuery やその他のライブラリと同じく、 Vue.js もスタンドアロンで動くファイルをて異様してますし、 CDN にて配布もしています。 あなたの HT
はじめよう Vue.js - Qiita
今、一番熱いMVVMフレームワーク、Vue.jsのガイド、(http://vuejs.org/guide/)を訳してみました。 シンプルさ、美しさに驚愕せよ、と言いたい。 基本はGoogle翻訳ですので、まだ日本語としておかしいところあるかもしれません。Google翻訳のストレートな機械翻訳よりは読みやすいと思います。 はじめに Vue.jsは、インタラクティブなWebインターフェイスを構築するためのライブラリです。 技術的には、 Vue.jsはMVVMパターンのビューモデルの層に焦点を当てています。双方向のデータバインディングによって、ビューとモデルを接続します。実際のDOM操作と出力フォーマットはディレクティブとフィルタにより抽象化されます。 Vue.jsの哲学は、目標は可能な限り単純なAPIとMVVMデータのデータバインディングの利点を提供することです。モジュール性とコンポーザビリテ
体で覚えるVue.js - ViewModel生成編 〜 JSおくのほそ道 #022 - Qiita
こんにちは、ほそ道です。 今回はMV**なフレームワークのひとつであるVue.jsを取り上げてみます。 さて、どこから手をつけたら良いものかと思案にくれた結果、序論や諸注意点をアレコレ展開する前にまずはビシバシと弄って、ヒジョーにシンプルなサンプルをいっぱい作って体にしみ込ませてみるのがイイんじゃないかと思いました。 ボリュームがあるので何回かに分け、今回はビューモデルを生成するパターンをまとめます。 「考えるな、感じろ」の精神でやった後にどう考え学習すべきかや、どう設計すべきかなどの私見は述べられたら良いなと思っております。 ViewModel生成編 ディレクティブ編 [インスタンスメンバ編] (http://qiita.com/setzz/items/ebbfcc3565bcd27f344c) [グローバルメソッド編] (http://qiita.com/setzz/items/8f0
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
