タグ

vueに関するtekgraphixxのブックマーク (5)

  • Vue.js からみた AtomicDesign

    この記事はVue.js #3 Advent Calendar 2017の13日目の記事です Atomic Design自体の記事は色々ありますので、この記事ではAtomicDesignで設計したコンポーネントをVue.jsで実際に運用してみて感じた事をまとめてみました 実際にどんな感じになるか結論から言うと、AtomとMoleculeにStoreを持たせず。 OrganismsとTemplateあたりの粒度でStoreを利用するとIA的にも収まりがいい様に思えます。是非デザイナーにツッコミ入れましょう。 VueコンポーネントをAtomicDesignで実装するとだいたいこんな感じになります。Atomの役割色・タイポ・ボタン固定文言など 直接描画要素にデータをレンダリング描画要素のイベントを発行親要素からのデータ受け取り登場箇所がすごく多いのでステートレスを徹底するStoreみちゃダメ絶対!

    Vue.js からみた AtomicDesign
  • フロントエンド開発に迷ったら「Vue.js入門」を読もう - JavaScript関連の書籍とかまとめてみた - Lean Baseball

    先日のPyCon JP 2018の野球の話にてVue.js(Nuxt.js)の話をした結果、技術評論社様のご厚意により、一冊頂戴いたしました. Vue.js入門 基礎から実践アプリケーション開発まで 作者: 川口和也,喜多啓介,野田陽平,手島拓也,片山真也出版社/メーカー: 技術評論社発売日: 2018/09/22メディア: 単行(ソフトカバー)この商品を含むブログを見る 正に欲しかった類ので大変助かりました、ホントありがとうございます! 結論から言うと、 Vue.js(またはNuxt.js)で開発するなら一冊持っておけ!(ただし他のFWにもいいがある) っていうくらい素晴らしい書籍でした、自信を持ってオススメができるレベルです. このエントリーでは、 「 Vue.js入門 基礎から実践アプリケーション開発まで」の簡単な感想 私がフロントエンド開発するまでにやってきたJavaScri

    フロントエンド開発に迷ったら「Vue.js入門」を読もう - JavaScript関連の書籍とかまとめてみた - Lean Baseball
  • 基礎から学ぶ Vue.js

    どんな? 機能ごとに解説している Vue.js 入門書です。これからはじめる方にも、すでに Vue.js をお使いの方にも、楽しんでいただける内容になっています。 しっかり学習できる! Vue.js は直感的に使える機能が多く、雰囲気で使ってしまいがちです。どんなメリット&デメリットがあるかも解説しているため、しっかりと学習できます。 「Vue.js が楽しい!」ウェブフロントエンド界隈でこの言葉を耳にすることが増えました。 フロントエンドを取り巻く技術の進化によって、フロントエンドの役割は増え、フレームワークもより身近なものになっています。 このでは「Vue.js ってなに?」「フレームワークってなに?」という基礎概念と導入からプロダクトに役立つ情報までを体系的に解説しています。 これから JavaScript のフレームワークを始める方にはもちろん、すでに Vue.js をお使いの

    基礎から学ぶ Vue.js
  • Vue.jsでTableをソートしたり検索したりしてみる

    Vue.jsでTableをソートしたり検索したりしてみる Vue.js 2.0 を使用してTableで並べたリストの検索フィルターとかソートなどをやってみます。 投稿日2017年01月16日 更新日2017年01月16日 データをテーブルに表示する 最初に表示するデータを作成して、tableにシンプルに表示してみましょう。 大まかにデータを入れる(data)、ボタンクリック時などに実行される(methods)、フィルター処理を記述する(computed)を作成していきます。 JavaScript var app = new Vue({ el: '#app', data: { }, methods: { }, computed: { } }); ではdataに表示するデータを記述していきましょう。 今回はタスクリストを想定して作成してきます。 JavaScript data: functio

    Vue.jsでTableをソートしたり検索したりしてみる
  • グリッドコンポーネント — Vue.js

    グリッドコンポーネント の例 最終更新日: 2017年6月26日 これは再利用可能なグリッドコンポーネントを作成して外部データでそれを利用した例です。

    グリッドコンポーネント — Vue.js
    tekgraphixx
    tekgraphixx 2018/07/13
    ソート
  • 1