際際滷

際際滷Share a Scribd company logo
Vue.js 0.12 to 2.0.0
に、笋┐茲Δ箸靴討修辰branchをした
about me
@nekobato
フロントエンドエンジニア
恷除はデザインO俐とプロトタイプ
Polidium
磯邑苧啝プレイヤ`
Davneko
webdavライクなオ`ディオプレイヤ`
Vue.js at g佞淋をします
訊抹です
アジェンダ
1. なぜこんなことに
2. 0.12 to 1.0.26
3. 1.0.26 to 2.0.0
彜r
on 劣かしポチポチゲ`Webviewゲ`ム
コ`ドはPerlのテンプレ`トエンジンとVue.jsが秘り岱れる岱弊
繍栖の瑤詫衄SPA
みなさんはVue.js 0.12ですか
なぜ書0.12なのか
是ってなかったから
なぜ書0.12なのか
畠隼0.12で是らない
- スピ`ドも}oい
- スケ`ルも}oい
- Vue.jsの嶄でflux flowが恬れる
- 仟しめのアプリ夛に\りWれるわけでもない
Announcing Vue.js 2.0
We are also not forgetting about 1.x!
壼く0.12から用竃しないと┰行鏝丕
s雰
Vue.js 0.12 ○ 書ココ
Vue.js 1.x Vue-Router
Vuex
Vue.js 2.0.0
Vue.js 0.12 to 1.0.26
功櫃Grep
v-on=¨click:function¨
v-el=¨name¨
v-repeat=¨¨
<content>
etc´
@click=¨function¨
:el=¨name¨
v-for=¨¨
<slot>
formをformというcomponentで
貧きしてたら鏑られた
[Vue warn]: Do not use built-in or
reserved HTML elements as component
id: form
すいませんでした
★ directiveに畠きQえ
湖
ほとんどそのまま咾
仝これ云輝はやっちゃダメだろうな々と房ってた侭は咾ない
Vue.js 0.12 to 1.0.26
?おわり?
vue@next
まだalphaだけどしたい欒屬
C
- サ`ビスと伉嶄するAngular 1.xのようになりたくない
- 奮らいついていきたい欒屬舛留軛
- 繍栖云輝に卞佩できるのかd龍ある
- SSRとかちょっとd龍ある
- 徭蛍のプロダクトが@nextに卞佩しつつある岑
- デバッグがS
おまけvue-loader@nextが宴旋
templateのVueにvするエラ`をトランスパイルのr泣で鷂罎靴討れる
Vue.js 1.0.26 to 2.0.0-rc
Vue.js2.0.0をしてみた狼の繁は冱う
仝ほとんどそのまま咾々
Vue.js2.0.0をしてみた狼の繁は冱う
仝ほとんどそのまま咾々
並念にVuex秘してたらな
VuexでBしていなかった鯵たちは
vm.$eventsと慌に棒ぬ
Y創に惄辰笋垢
2.0 Changes
https://github.com/vuejs/vue/issues/2873
晩云ZU
http://qiita.com/prismrism/items/66a9dfc31139326911d8
Vue 2.0 RC Starter Resources
https://github.com/vuejs/vue/wiki/Vue-2.0-RC-Starter-Resources
功櫃Grep
v-el:name, v-ref:name
this.$els.name
$vm.ready
v-for猟
etc...
ref= ̄name ̄
this.$refs.name
$vm.mounted
DOM撹がしくなってる
Component template should contain
exactly one root element
1コンポ`ネント = 1ノ`ドツリ`
コンポ`ネントの古廷を屎しくg廾していたら
蒙にやることはない
Filtersを$watchや$computedに
Qする恬I
- Filters can now only be used inside text interpolations ({{}} tags)
- Vue 2.0 will not ship with any built-in filters.
directive坪で}jなことするのやめる
@timeupdate='updateTime | debounce(300)'
匯桑の諒籾
とりあえずVue 2.0.0にはなるよver.
これを events: {
EVENT_NAME_1: function() {},
EVENT_NAME_2: function() {},
EVENT_NAME_3: function() {},
EVENT_NAME_4: function() {}
}
this.$dispatch('EVENT_NAME', function() {})
とりあえずVue 2.0.0にはなるよver.
まずこうして vue-event-emitter.js
import Vue from 'vue'
export default new Vue()
とりあえずVue 2.0.0にはなるよver.
こうする import ee from `../vue-event-emitter¨
created() {
ee.$on('EVENT_NAME_1', this.function1)
ee.$on('EVENT_NAME_2', this.function2)
ee.$on('EVENT_NAME_3', this.function3)
ee.$on('EVENT_NAME_4', this.function4)
}
ee.$emit('EVENT_NAME', function() {})
だいたいGrepだけで
咾い
屎櫃る
Y
- シンプルな何蛍はGrepで崔Q辛嬬
- カスタム勣殆は碧に栽わせるために富し^を聞う
- Vuex秘れてない繁はまずVuex秘れよう
- Vuexがoくても咾
Ad

Recommended

Jjugccc2017spring m6 javafx
Jjugccc2017spring m6 javafx
torutk
?
Electron, databases, and RxDB
Electron, databases, and RxDB
Ben Gotow
?
Electronで 啝ながらアプリを恬った
Electronで 啝ながらアプリを恬った
Hayato Koriyama
?
2024 Trend Updates: What Really Works In SEO & Content Marketing
2024 Trend Updates: What Really Works In SEO & Content Marketing
Search Engine Journal
?
Storytelling For The Web: Integrate Storytelling in your Design Process
Storytelling For The Web: Integrate Storytelling in your Design Process
Chiara Aliotta
?
Artificial Intelligence, Data and Competition C SCHREPEL C June 2024 OECD dis...
Artificial Intelligence, Data and Competition C SCHREPEL C June 2024 OECD dis...
OECD Directorate for Financial and Enterprise Affairs
?
How to Leverage AI to Boost Employee Wellness - Lydia Di Francesco - SocialHR...
How to Leverage AI to Boost Employee Wellness - Lydia Di Francesco - SocialHR...
SocialHRCamp
?
2024 State of Marketing Report C by Hubspot
2024 State of Marketing Report C by Hubspot
Marius Sescu
?
Everything You Need To Know About ChatGPT
Everything You Need To Know About ChatGPT
Expeed Software
?
Product Design Trends in 2024 | Teenage Engineerings
Product Design Trends in 2024 | Teenage Engineerings
Pixeldarts
?
How Race, Age and Gender Shape Attitudes Towards Mental Health
How Race, Age and Gender Shape Attitudes Towards Mental Health
ThinkNow
?
AI Trends in Creative Operations 2024 by Artwork Flow.pdf
AI Trends in Creative Operations 2024 by Artwork Flow.pdf
marketingartwork
?
Skeleton Culture Code
Skeleton Culture Code
Skeleton Technologies
?
PEPSICO Presentation to CAGNY Conference Feb 2024
PEPSICO Presentation to CAGNY Conference Feb 2024
Neil Kimberley
?
Content Methodology: A Best Practices Report (Webinar)
Content Methodology: A Best Practices Report (Webinar)
contently
?
How to Prepare For a Successful Job Search for 2024
How to Prepare For a Successful Job Search for 2024
Albert Qian
?
Social Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie Insights
Kurio // The Social Media Age(ncy)
?
Trends In Paid Search: Navigating The Digital Landscape In 2024
Trends In Paid Search: Navigating The Digital Landscape In 2024
Search Engine Journal
?
5 Public speaking tips from TED - Visualized summary
5 Public speaking tips from TED - Visualized summary
SpeakerHub
?
ChatGPT and the Future of Work - Clark Boyd
ChatGPT and the Future of Work - Clark Boyd
Clark Boyd
?
Getting into the tech field. what next
Getting into the tech field. what next
Tessa Mero
?
Google's Just Not That Into You: Understanding Core Updates & Search Intent
Google's Just Not That Into You: Understanding Core Updates & Search Intent
Lily Ray
?
How to have difficult conversations
How to have difficult conversations
Rajiv Jayarajah, MAppComm, ACC
?
Introduction to Data Science
Introduction to Data Science
Christy Abraham Joy
?
Time Management & Productivity - Best Practices
Time Management & Productivity - Best Practices
Vit Horky
?
The six step guide to practical project management
The six step guide to practical project management
MindGenius
?
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
RachelPearson36
?
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
Applitools
?

More Related Content

Featured (20)

Everything You Need To Know About ChatGPT
Everything You Need To Know About ChatGPT
Expeed Software
?
Product Design Trends in 2024 | Teenage Engineerings
Product Design Trends in 2024 | Teenage Engineerings
Pixeldarts
?
How Race, Age and Gender Shape Attitudes Towards Mental Health
How Race, Age and Gender Shape Attitudes Towards Mental Health
ThinkNow
?
AI Trends in Creative Operations 2024 by Artwork Flow.pdf
AI Trends in Creative Operations 2024 by Artwork Flow.pdf
marketingartwork
?
Skeleton Culture Code
Skeleton Culture Code
Skeleton Technologies
?
PEPSICO Presentation to CAGNY Conference Feb 2024
PEPSICO Presentation to CAGNY Conference Feb 2024
Neil Kimberley
?
Content Methodology: A Best Practices Report (Webinar)
Content Methodology: A Best Practices Report (Webinar)
contently
?
How to Prepare For a Successful Job Search for 2024
How to Prepare For a Successful Job Search for 2024
Albert Qian
?
Social Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie Insights
Kurio // The Social Media Age(ncy)
?
Trends In Paid Search: Navigating The Digital Landscape In 2024
Trends In Paid Search: Navigating The Digital Landscape In 2024
Search Engine Journal
?
5 Public speaking tips from TED - Visualized summary
5 Public speaking tips from TED - Visualized summary
SpeakerHub
?
ChatGPT and the Future of Work - Clark Boyd
ChatGPT and the Future of Work - Clark Boyd
Clark Boyd
?
Getting into the tech field. what next
Getting into the tech field. what next
Tessa Mero
?
Google's Just Not That Into You: Understanding Core Updates & Search Intent
Google's Just Not That Into You: Understanding Core Updates & Search Intent
Lily Ray
?
How to have difficult conversations
How to have difficult conversations
Rajiv Jayarajah, MAppComm, ACC
?
Introduction to Data Science
Introduction to Data Science
Christy Abraham Joy
?
Time Management & Productivity - Best Practices
Time Management & Productivity - Best Practices
Vit Horky
?
The six step guide to practical project management
The six step guide to practical project management
MindGenius
?
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
RachelPearson36
?
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
Applitools
?
Everything You Need To Know About ChatGPT
Everything You Need To Know About ChatGPT
Expeed Software
?
Product Design Trends in 2024 | Teenage Engineerings
Product Design Trends in 2024 | Teenage Engineerings
Pixeldarts
?
How Race, Age and Gender Shape Attitudes Towards Mental Health
How Race, Age and Gender Shape Attitudes Towards Mental Health
ThinkNow
?
AI Trends in Creative Operations 2024 by Artwork Flow.pdf
AI Trends in Creative Operations 2024 by Artwork Flow.pdf
marketingartwork
?
PEPSICO Presentation to CAGNY Conference Feb 2024
PEPSICO Presentation to CAGNY Conference Feb 2024
Neil Kimberley
?
Content Methodology: A Best Practices Report (Webinar)
Content Methodology: A Best Practices Report (Webinar)
contently
?
How to Prepare For a Successful Job Search for 2024
How to Prepare For a Successful Job Search for 2024
Albert Qian
?
Trends In Paid Search: Navigating The Digital Landscape In 2024
Trends In Paid Search: Navigating The Digital Landscape In 2024
Search Engine Journal
?
5 Public speaking tips from TED - Visualized summary
5 Public speaking tips from TED - Visualized summary
SpeakerHub
?
ChatGPT and the Future of Work - Clark Boyd
ChatGPT and the Future of Work - Clark Boyd
Clark Boyd
?
Getting into the tech field. what next
Getting into the tech field. what next
Tessa Mero
?
Google's Just Not That Into You: Understanding Core Updates & Search Intent
Google's Just Not That Into You: Understanding Core Updates & Search Intent
Lily Ray
?
Time Management & Productivity - Best Practices
Time Management & Productivity - Best Practices
Vit Horky
?
The six step guide to practical project management
The six step guide to practical project management
MindGenius
?
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
RachelPearson36
?
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
Applitools
?

Vue.js 0.12 to 2.0.0 gotanda.js #5