Upgrade to Pro — share decks privately, control downloads, hide ads and more …

単一ファイルコンポーネントは動かない

 単一ファイルコンポーネントは動かない

2019/07/26開催
https://vuejs-osaka.connpass.com/event/136805/
VueJS Osaka #2 で発表した内容の公開版です。

覆面くん Deprecated

July 26, 2019
Tweet

More Decks by 覆面くん Deprecated

Other Decks in Technology

Transcript

  1. 初心者です やりたかったこと vueがあるわ、たぶんできるやろ 関数とかないの?たぶんできるやろ えっ全部まとめて? すごいじゃん! •なぜなのか? •エピローグ ゆかいなフロントエンド劇場 単一

    コンポーネントは動かない もしくは、 フロントエンド カジュアル勢の安全生息圏について 何とかならないの? Vueをはじめて3週間、Linuxひとすじ300年の人の日記より抜粋 #VueJSOsaka 2019年7月26日 ファイル
  2. 初心者です やりたかったこと vueがあるわ、たぶんできるやろ 関数とかないの?たぶんできるやろ えっ全部まとめて? すごいじゃん! なぜなのか? エピローグ 2019年7月26日 #VueJSOsaka

    2 今日のお話 ・初心者です・ ・やりたかったこと・ ・Vueがあるわ、たぶんできるやろ・ ・関数とかないの?たぶんできるやろ・ ・えっ全部まとめて? すごいじゃん!・ ・なぜなのか・ ・エピローグ・
  3. 初心者です やりたかったこと vueがあるわ、たぶんできるやろ 関数とかないの?たぶんできるやろ えっ全部まとめて? すごいじゃん! なぜなのか? エピローグ 2019年7月26日 #VueJSOsaka

    3 初心者です • Vueを使いはじめて早3週間。 • Linuxとオープンソース・ソフトウェアを 使って働いているプロの自営業です。 • 香川高専の研究室が手がけているプロジェクトにUI改善の担 当者として参加する事になり、そこでVueを使ってみまし た。 • 趣味は読書です
  4. 初心者です やりたかったこと vueがあるわ、たぶんできるやろ 関数とかないの?たぶんできるやろ えっ全部まとめて? すごいじゃん! なぜなのか? エピローグ 2019年7月26日 #VueJSOsaka

    4 • Vueを使いはじめて早3週間。 • Linuxとオープンソース・ソフトウェアを 使って働いているプロの自営業です。 • 香川高専の研究室が手がけているプロジェクトにUI改善の担 当者として参加する事になり、そこでVueを使ってみまし た。 • 趣味は読書です 趣味は読書です https://jumpbookstore.com ※注 これは個人の趣味 についての話です。
  5. 初心者です やりたかったこと vueがあるわ、たぶんできるやろ 関数とかないの?たぶんできるやろ えっ全部まとめて? すごいじゃん! なぜなのか? エピローグ 2019年7月26日 #VueJSOsaka

    5 • Vueを使いはじめて早3週間。 • Linuxとオープンソース・ソフトウェアを 使って働いているプロの自営業です。 • 香川高専の研究室が手がけているプロジェクトにUI改善の担 当者として参加する事になり、そこでVueを使ってみまし た。 • 趣味は読書です 趣味は読書です https://jumpbookstore.com ※注 これは個人の趣味 についての話です。
  6. 初心者です やりたかったこと vueがあるわ、たぶんできるやろ 関数とかないの?たぶんできるやろ えっ全部まとめて? すごいじゃん! なぜなのか? エピローグ 2019年7月26日 #VueJSOsaka

    6 • Vueを使いはじめて早3週間。 • Linuxとオープンソース・ソフトウェアを 使って働いているプロの自営業です。 • 香川高専の研究室が手がけているプロジェクトにUI改善の担 当者として参加する事になり、そこでVueを使ってみまし た。 • 趣味は読書です 趣味は読書です https://jumpbookstore.com ※注 これは個人の趣味 についての話です。
  7. 初心者です やりたかったこと vueがあるわ、たぶんできるやろ 関数とかないの?たぶんできるやろ えっ全部まとめて? すごいじゃん! なぜなのか? エピローグ 2019年7月26日 #VueJSOsaka

    7 • Vueを使いはじめて早3週間。 • Linuxとオープンソース・ソフトウェアを 使って働いているプロの自営業です。 • 香川高専の研究室が手がけているプロジェクトにUI改善の担 当者として参加する事になり、そこでVueを使ってみまし た。 • 趣味は読書です 趣味は読書です https://jumpbookstore.com ※注 これは個人の趣味 についての話です。
  8. 初心者です やりたかったこと vueがあるわ、たぶんできるやろ 関数とかないの?たぶんできるやろ えっ全部まとめて? すごいじゃん! •なぜなのか? •エピローグ 2019年7月26日 #VueJSOsaka

    12 やりたかったこと このへんを foreachしたい・・・ foreachとは この foreach は、PHPで配列を反復処理す るための便利な方法です。 実在の人物、団体などとはいっさい関係あ りません。
  9. 初心者です やりたかったこと vueがあるわ、たぶんできるやろ 関数とかないの?たぶんできるやろ えっ全部まとめて? すごいじゃん! •なぜなのか? •エピローグ 2019年7月26日 #VueJSOsaka

    15 !? Vue があるわ、 たぶんできるやろ 一般的な社会人が持つVueの印象 ※当社しらべ 印象1: すごい! 印象2: かんたん! 印象3: かっこいい!
  10. 初心者です やりたかったこと vueがあるわ、たぶんできるやろ 関数とかないの?たぶんできるやろ えっ全部まとめて? すごいじゃん! •なぜなのか? •エピローグ 2019年7月26日 #VueJSOsaka

    19 やりたかったこと このへんを foreachしたい・・・ foreachとは この foreach は、PHPで配列を反復処理す るための便利な方法です。 実在の人物、団体などとはいっさい関係あ りません。
  11. 初心者です やりたかったこと vueがあるわ、たぶんできるやろ 関数とかないの?たぶんできるやろ えっ全部まとめて? すごいじゃん! •なぜなのか? •エピローグ 2019年7月26日 #VueJSOsaka

    24 関数とかないの? たぶんできるやろ コンポーネント化されたHTML。 もう怖くない。 「えっ? BootStrapのカラム増やしてもいいのか?」 「ああ、しっかり書け」 コンポーネントを呼び出すとこ
  12. 初心者です やりたかったこと vueがあるわ、たぶんできるやろ 関数とかないの?たぶんできるやろ えっ全部まとめて? すごいじゃん! •なぜなのか? •エピローグ 2019年7月26日 #VueJSOsaka

    27 えっ全部まとめて? すごいじゃん! これが 単一ファイル コンポーネントだ HTMLタグと JavaScriptとCSSを 一つのファイルにまとめて コンポーネント化できるぞ ※意訳:覆面くん
  13. 初心者です やりたかったこと vueがあるわ、たぶんできるやろ 関数とかないの?たぶんできるやろ えっ全部まとめて? すごいじゃん! •なぜなのか? •エピローグ 2019年7月26日 #VueJSOsaka

    29 えっ全部まとめて? すごいじゃん! おもむろに コンポーネントを ファイル化するのだ はぁはぁ... vueファイルを インポートするのだ
  14. 初心者です やりたかったこと vueがあるわ、たぶんできるやろ 関数とかないの?たぶんできるやろ えっ全部まとめて? すごいじゃん! なぜなのか? エピローグ 2019年7月26日 #VueJSOsaka

    39 単一 コンポーネントは動かない なぜなら我々は、 フロントエンド カジュアル勢の安全生息圏で働いているのだから。 ファイル