и� N� Ph� ��� `�� 05� ��n �� ��� �L� ��� ��� 0�� �Ě P � �$^ ��� ��� ��0 @G� `�� �5� �r� п� @� �W �ҍ �`� ��� �9 �� P�� >�
![Internels Vue.js 算出プロパティはどうやって動いているか](https://cdn-ak-scissors.b.st-hatena.com/image/square/8303bbbc0ecc08df003c429079fe7e06ad8bb96d/height=288;version=1;width=512/https%3A%2F%2Fkitak.github.io%2Fslides%2F170316-vue-meetup%2Fimg%2F2.png)
vuejs-meetup.connpass.com 申し込んだ時点で213/80人と絶望的だったのですが、たまたまブログ書く枠が空いたので勢いでポチってしまいました。ただ、私はVue.js初心者(※)なのでブログを書けるほど内容が理解できるのかかなり不安でしたが、結果的にどのトークも楽しめました(理解したとは言ってない)。なので、同じような初心者の方でも、興味があれば参加してみるとよいのではと思います。 (※)人がつくったアプリ(Vue 1.x)の改修をしたり、開発合宿でミニマムな評価アプリ(Vue 2.x)をギリギリつくった程度のレベルです。 以下、それぞれのトークの内容のメモです。 Vue.js の中身 - 算出プロパティはどうやって動いているか @kitak https://kitak.github.io/slides/170316-vue-meetup/ Vue.jsのようなライブ
Vue.js Tokyo v-meetup="#3" での発表資料です。
Vue2.xでは仮想DOMが使われるようになりました。それに伴い、Vue用のテンプレートを仮想DOMをレンダリングするための関数に変換するという処理をコンパイル時に行ってくれる仕組みが組み込まれています。 そして、お手軽にVueを試したい人、プロダクトにVueを使いたい人、コンポーネント志向でアトミックに実装したい人など、様々な用途に応じたテンプレートの書き方(&コンパイルの方法)を用意してくれています。 そのためテンプレートの書き方とコンパイルの種類については仕様がやや複雑で、公式ドキュメントだけでは理解が難しくけっこうハマりどころだと感じている(事実ずっぽりハマりました)ので、知見を残しておこうと思います。 ※この記事を書いている時点でのVueのバージョンは2.2.1です。 おさらい Vue.jsの利用方法3パターン 1. Vueを<script>タグで埋め込む方法 2. Vue CL
年明けからVue.jsを結構触ってます。 参考になったなとか、このへん読んどくといいなと思ったリンクなど紹介していきます。 でもとりあえずVue.jsの公式のドキュメント(https://jp.vuejs.org/v2/guide/)を一通り眺めたほうがいいです。 公式のドキュメントは文量もそんなにないので、手を動かす前にパラパラと流し読みしてしまいましょう。 では読み終わった人向けに、紹介を続けます。 Vue.js概要? http://qiita.com/asip2k25/items/bd4bdccd5201d542953c 他のフレームワークとの比較と、Vue.jsの志向しているものを解説しています。文量は結構ありますが、Vue.jsを無駄なく使っていくためには良いガイドですので、ぜひ一読してください。 Vue2のディレクトリ構成を考える http://qiita.com/kurosa
はじめに Vue2が良さそうなので、実装しながらディレクトリ構成について考えてみたいと思います。 Vuexも使います。 環境構築 Vue.jsではvue-cliが用意されており、最初の開発環境が簡単に作れます。 手っ取り早く動く環境を作りたいときなど試してみると良いです。 npm install -g vue-cli vue init webpack my-project cd my-project npm install npm run dev またvue-cliは[ Webpack / Browserify ]の両方に対応されており、以下の4つのテンプレートが用意されています。 browserify browserify-simple webpack webpack-simple vue-cliはWebpackの2系に移行済みです! ├── assets ├── dist ├── gu
フロントエンド界隈の闇といえば、開発をはじめる前に周辺ツールで消耗すること。 以下の記事を見ていただくと、わかるかと思う。 1年半ほど前に書いた記事だ。 フロントエンド初心者だった私が、Vue.js(0.12)を使ってTypeScriptでChrome拡張機能を開発しようとしたとき、本題の「Vue.js」を触るまでに以下のツールを学ばなければならなかった。 npm: nodeのパッケージ管理ツール bower: フロントエンド系のライブラリ管理ツール tsd: TypeScriptの型情報管理ツール gulp: タスクランナー(ビルドやテスト自動化のため) webpack: モジュールバンドラー(ファイルを1つにまとめ依存解決するため) ts-loader: TypeScriptをwebpackでビルドするときに使うプラグイン Jasmine: テストツール(BDD) mocha+chai
はじめに Rails 5.1ではJavaScript/index.html.erb周りのサポートが大きく改善されました。 これにより、Vue.jsやReactといったモダンなJSフレームワークをRails内で非常に扱いやすくなっています。 僕も実際に試してみましたが、本当にびっくりするぐらい簡単にVue.jsやReactを動かすことができました。 そこでこの記事ではRails 5.1とVue.jsを組み合わせたサンプルアプリケーションの作成方法をチュートリアル形式で、できるだけ詳しく説明します。 また、ローカルで動かしておしまい、ではなく、Herokuにデプロイしたり、テストコードを書いたりするところまでカバーします。 この記事自体は長いですが、実際に手を動かすと(スムーズに進んだ場合)30分以内で終わらせることができるはずです! 今回作成するサンプルアプリケーション 今回は以下のリンク先
このサイトは、只今WEB業界で活躍中のデザイナー、プログラマーの方々の情報を集めたweb統合情報サイトです。 web帳 どもです。 タイトル長めになりました。 かれこれ、6、7年放置気味のWordPressのサイトを サーバー移転に伴い色々と整理しています。 既存のWordPressは、がっつりプラグインに依存しているしjQueryも7年前ぐらいに入れっぱなし。。 という事で、外せるプラグインは外して、これを機にjQueryも外そうと。 したところ、よくある「さらに記事を読み込む」ボタンの実装がどうやら必要だ。 このボタンを押すと、Ajaxで記事を取得してきて、表示する。と言った機能。 今まで、プラグインを利用してきたのですが、外せるなら外して自作したいですよね。 そこで、どうせなら新しめのフレームワークを入れちゃおうかなと、どれを入れようか20秒ほど考えました。 Angular2を入れる
{ "name": "vuebingo-qiita", "version": "1.0.0", "description": "vuebingo-qiita", "main": "index.js", "scripts": { "webpack": "webpack" }, "author": "", "license": "ISC", "devDependencies": { "babel-core": "^6.21.0", "babel-loader": "^6.2.10", "babel-plugin-transform-runtime": "^6.15.0", "babel-preset-es2015": "^6.18.0", "copy-webpack-plugin": "^4.0.1", "vue-loader": "^10.0.2", "vue-template-compil
Angular、Reactと並んで海外で人気が高まっている「Vue.js」。ReactとAngularの開発経験がある著者がVue.jsをチュートリアルを通じて特徴をまとめました。2017年、新しく学び始めるきっかけにどうぞ。 2016年9月、人気のJavaScriptフレームワークVue.jsがv2をリリースしました。それ以来ぜひ使ってみたい、どのようなものか知りたいと思っていました。AngularとReactを使い慣れた者の1人としては、Vueが似ているところや違うところも知りたかったのです。 Vue.js 2.0はすばらしいパフォーマンスを誇ります。データサイズが比較的小さく(バンドルされるVueのランタイム版は一度最小化してgzip圧縮したら16KBしかありません)、Vueのvuexや、vue-routerのような付属の状態管理ライブラリーもアップデートされました。1つの記事ではと
お正月なので何か挑戦したいと思い Vue.js と サーバレスアーキテクチャを使った SSR 構成に挑戦してみました。 構想 Vue.js の SPA(SSR対応版)を サーバレスアーキテクチャで組み上げます。 基本となるSPAサイト(主にJSやCSS)はS3経由で、SSR 的なサーバサイドの描画が必要な箇所は、Serverless Frameworkを使用して Lambda + ApiGateway で構築します。 SSR的なHTML配信と静的なAssets配信は同じオリジンで行いたいので最終的には CloudFrontで両者をマージします。 普通にVue.jsでSPAを作る まずは兎にも角にも普通に Vue.js でSPAを作って行きます。 Vue.js の開発は Vue CLI を使えば高速に始められます。 SPAのルーティングは VueRouterで簡単に実装できますが、 Rout
ギークハウス Advent Calendar 2016の12月22日の記事です。 他の方とは、全然違う雰囲気になってしまいましたが、読んでいただけると幸いです。 なぜVue.js?? 普段の仕事では、Ruby/Railsなので、フロントエンド周りは、jQueryにCoffeeScriptで片手間感覚... ↓ しかし最近のフロントエンド界隈は、良くも悪くも盛り上がっていて楽しそうだなあと思う日々。 ↓ いろいろ、ググって調べてみると、ES6、Babel、Reactふむふむ...🤔 ん?? Webpack? JSX?? Flux?? Redux?? 「落ち着け!とりあえず日本語でOK」状態。。正にこの記事で書かれている状態そのものでした。 ↓ Reactとかでイケてるフロントエンド開発をちょっと試したいと思っても、BabelやWebpackの設定など環境構築でつまづき、肝心のアプリケーショ
Qwintryチームは最近、既存のすべてのプロジェクトのフロントエンドをVue.jsに移行しはじめました。新しいプロジェクトでもVue.jsを使います。 レガシーなDrupalのシステム(qwintry.com) ゼロから新しく書きなおすqwintry.comのブランチ Yii2で動くb2bシステム(logistics.qwintry.com) その他、比較的小さめのプロジェクト(ほとんどは、PHPとNode.jsでバックエンドを構築しているもの) プロジェクトの規模についていうと、 Qwintry は世界中で約50万人の顧客が使っています。アメリカとドイツに倉庫を持っていて、アメリカ国内 最大の郵送先 のひとつで、東欧や中東への出荷に注力しています。Qwintryは、アメリカのオンラインストアでグッズを購入する人たちのためのツールです。私たちの倉庫に届いた荷物をコントロールパネルで管理で
メリークリスマス!(昨日) これはVue.jsアドベントカレンダーの記事です。 代打です。 僕は初日にサーバーサイドレンダリングについて書きましたが 今回もサーバーサイドレンダリングです。 今回の内容は本当は初日に書きたかったのですがずっとうまくいかずに悩んでいたけどつい昨日できたGoサーバでのSSR(サーバーサイドレンダリング)です。 GoでSSRをするメリットとしてまず一つにポータビリティです。 Node.jsもポータビリティはありますが、Goであればアセットもワンバイナリにまとめることができるのでバイナリを配置するだけでWebUIがあるツールも作ることもできるかもしれません。 そして、僕にとって1番のメリットであるApp Engine(GAE)でSSRができるようになります! SSRについては初日の記事を見てください! サンプルの実行 https://github.com/k2wan
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く