Vue.jsの日本最大級カンファレンス「Vue Fes Japan Online 2022」、10/16にYouTube Live上で開催 | gihyo.jp
Vue.jsの日本最大級カンファレンス「Vue Fes Japan Online 2022」、10/16にYouTube Live上で開催 日本最大級のVue.jsカンファレンスであるVue Fes Japan Online 2022が、10月16日（日）にオンラインにて開催されます。 本カンファレンスでは、セッションやライトニングトーク、さらには様々な企画が開催されます。今回はYouTube Liveでの開催なので、ぜひ気軽にご参加ください。 キーノート キーノート（基調講演）には、Vue.jsの開発者であるEvan Youがライブ配信にて登壇します。キーノート後には、Evan Youが質問に答えてくれる「Evan Youに聞こう」という企画も用意されています。直接質問できる貴重な機会ですので、Evan Youに質問してみたいことがある方は、ぜひ#vuefes_qaのハッシュタグをつけて
「Vue.js」入門～JavaScriptフレームワークをTypeScriptで学ぼう
本連載では、JavaScriptフレームワーク「Vue.js」を、型定義が利用できるようJavaScriptを拡張した言語「TypeScript」で活用する方法を、順を追って説明していきます。初回となる今回は、簡単なサンプルを通して、Vue.jsとTypeScriptの概要と機能を紹介していきます。 はじめに Webフロントエンド開発の分野では、JavaScriptを利用して動的なWebページを構築できるライブラリーやフレームワークがいくつかあります。Googleが中心となって開発しているAngularやその前身であるAngularJS、Facebookが中心となって開発しているReactなどが有名です。 本連載で取り上げるVue.jsも、そのようなフレームワークの一つです。JavaScriptを利用して、データとWebページの内容を結び付けて（バインディングして）表示したり、Webページ
Vuestic UI — Vue.js 3.0 UI Framework
Vuestic UI is an OpenSource Vue 3 based UI framework. It is a MIT-licensed UI framework that provides ready-to-use frontend components that are easily configurable and speed up development of responsive and fast-loading web interfaces. It was initially released in May 2021 by Epicmax and that is what Vuestic UI today.
スクラッチからVue.jsで作る自作ガントチャート | アールエフェクト
Vue.jsを利用してスクラッチからガントチャートを作成する方法を解説しています。JavaScriptのガントチャートを検索するとライブラリの利用方法を解説している記事がほとんどで作成方法を公開している記事を見つけるのは困難です。 本文書では有償・無償を問わずガントチャートのライブラリは一切利用しておらず、Vue.jsを利用してスクラッチからガントチャート の作成を行っています。 内容が比較的多いので3回に分けて文書を公開していますが、最終的には下記のようなガントチャートを作成することができます。 完成時のガントチャート 【実装するガントチャートの主な機能】 タスクバーは横方向にドラッグ&ドロップで移動することができ、移動が完了すると日付も一緒に更新されます。タスクバーの両側についている四角いボタンをドラッグ&ドロップすることでタスクの期間を変更することができ、日付も一緒に更新されます。タ
Vue.js + Vuexでデータが循環する全体像を図解してみた - Qiita
2019年の2月まで表参道のプログラミングスクールでVue.js(+Nuxt.js)を教えていました。 とある生徒に「Vue.jsとVuexの関連がわからないので図解して欲しい」と頼まれてホワイトボードにサクッと書いて説明してみたらわかりやすいと大好評。 しかもその生徒が私のラフ図をキレイな動画に作り直してくれたのでカットごとの紹介記事を書くことにしました。 この記事でわかること state/mutations/commit/actions/dispatchの違いがわかるようになります。 getterやsubscribeについては扱いません。 実際のコードの書き方にも触れません。 Vuexを使ってはいるけど理解できなくて苦しんでいる方向けの内容です。 なぜVuexを使うのか Vuexの図解に入る前に、私がVuexを使っている理由を説明しておきます。 Vuexのメリットが明確でないと図があっ
Vue.js で Moment.js を使ってお手軽に日付フォーマットする - Qiita
Vue.js のフィルタでフォーマット Moment.js を使ったフィルタを用意すると以下のようにお手軽に日付のフォーマットが可能です。 JavaScript の日付処理は罠が多い Date#getYearで1900年からの経過年数が返る Date#getMonthで 0 ～ 11 が返る。 JavaScript の日付処理ライブラリである Moment.js を使えばそういった罠を回避し、お手軽に JavaScript の日付を扱うことができます。 現在、Github のスターは 40000 を超え JavaScript の日付処理ライブラリでは最もメジャーなものの一つです。 フィルタの作り方 サンプルプロジェクトを作成します。 既存のプロジェクトに組み込む場合、ここは必要ありません。 # Vue CLI のインストール ※すでにインストール済みなら必要なし $ npm install
「Nuxt.js」で作ったWebページをインターネットで公開する方法
本連載では、Webページのユーザーインタフェース（UI）フレームワーク「Vue.js」と、Vue.jsを利用してWebページを作成できるフレームワーク「Nuxt.js」の活用方法を、サンプルとともに紹介します。前回は、Nuxt.jsの非同期データ機能について説明しました。今回は、Nuxt.jsを利用して作成したWebページをインターネット上に公開する方法を紹介します。 はじめに Nuxt.jsは、Webページのユーザーインタフェース（UI）フレームワークであるVue.jsに、Webページの作成に必要なUI以外の追加機能をまとめて提供するフレームワークです。 Nuxt.jsでは、作成したWebページをインターネット上に公開するための機能が提供されています。この機能を利用すると、Node.jsが実行できないWebサーバー向けに静的ファイルを生成できます。また、Node.jsが実行できるWebサ
Vue.js、Nuxt JSを学習するときにやったこと
2021年7月11日 JavaScript, Nuxt JS, Vue.js 以前「WebデザイナーのためのVue.js事始め」という記事でVue.jsについて触れたのですが、それから今まで、どんな手順で勉強してきたのかを紹介してみます。途中ReactやGatsbyを取り入れたりもしていたのですが、結局 .vueファイルでの単一ファイルコンポーネントが楽だなーと思い、今はVue.jsに全振り中です。これから勉強してみたい方の参考になれば幸いです。 ↑私が10年以上利用している会計ソフト！ 1. Vue.js公式Webサイトを確認 まずはVue.jsの公式Webサイトを確認。日本語にも対応しています。ここで基本的な使い方、文法、何ができるのかなどをざっくり学習しました。 サンプルコードがある箇所は実際にCodePenを使ってコードを記述し、動作確認します。公式は今後何度も繰り返しチェックする
15 of the Most Interesting Vue UI Component Libraries for 2024
15 of the Most Interesting Vue UI Component Libraries for 2024by Shaumik DaityariFebruary 3, 2024Web & App Frameworks “Why bother with Vue UI component libraries?” Well, Vue, or Vue.js, is a popular JavaScript library you can use to create dynamic applications on the front end. Vue, the progressive JavaScript framework, has emerged as the main competitor to Angular and React, and one of the reaso
Vue.js初心者でも書ける！ゼロから始めるVuexのテスト入門編その１(vue-test-utils) - 虎の穴開発室ブログ
みなさん、いかがお過ごしでしょうか。今年の7月からラボのマーケチームに加わったY.I.です。 好きな作品は「ゆるキャン△」です。お盆休みには「ゆるキャン△」舞台の富士山周辺でキャンプツーリングをしてきました。 ゆるキャン△に関しては熟知している私ですが、技術的にまだまだ未熟な開発者です・・・。活躍できるよう頑張っていきますので、どうぞよろしくお願いします。 さて、今回はVue.jsのテスト、とくにVuexのテストについて書いていきたいと思います。 0. この記事を読んでわかること 本連載では「ゼロから始めるVuexのテスト入門編」と題して、これまでVuexのテストを書いたことがない方を対象に、全2回に渡ってVuexのテストの詳細を書いていきます。 今回は連載の第一回目として、下記の構成でお送りします。テストの必要性やポイント、またVuexのテストがどのようなものになるのか感じ取っていただけ
『まず触ってみて』Vueで使えるCSSアニメーションまとめ１１０選！【完全オリジナルだからコピペOK】 - Qiita
『まず触ってみて』Vueで使えるCSSアニメーションまとめ１１０選！【完全オリジナルだからコピペOK】CSSアニメーション初心者Vue.jsフロントエンド コピペだけで作れるマテリアルデザインを個ご紹介します。 box-shadow, filter, transform,などをふんだんに使っており、transitionで滑らかな動きが表されています コードには説明もわかりやすく書いてあるのでかなり参考になります Webデザイン初心者の方はもちろんですが、バックエンドエンジニアの方にもとても助かる内容になっています １. シンプルなスライダーマテリアルデザイン３選 そのまま使えるスライダーアニメーションのマテリアルデザインとなっています transition-durationを使っていてわかりやすく説明もされているのでかなり重宝します ２. filterとopacityを使いこなすスライダー
サーバーサイドエンジニアがじっくり学ぶVue.jsチュートリアル【2. Introduction】 | DevelopersIO
こんにちは。DA事業本部の春田です。 普段の業務では全く扱わないフロントエンドの世界に飛び込んでみたいと思います。最近3系が登場しましたがまだ情報が少ないので、2系のチュートリアルを進めていきます。サンドウィッチマンでいう「ちょっと何言ってるかわからない」ポイントは、その都度調べていきます。英語版の公式ドキュメントがベースです。 今回はIntroduction編です。 Vue.js とは？ Vue.jsは、ユーザーインターフェース（UI）を構築するためのプログレッシブ・フレームワークです。 Unlike other monolithic frameworks, Vue is designed from the ground up to be incrementally adoptable. このモノシリックなフレームワークが何を指しているかといえば、例えばAngular.jsです。モノシリ
【Vue.js】Composition API時代の便利ライブラリ「VueUse」を使ってみた - Qiita
Vue Composition API によって Vue.js にも React Hooks のようなロジックの再利用性の高い開発体験がもたらされようとしています。 しかし、まだ「Composition API の良さをわかっていない」という方や「Composition API をうまく利用した書き方がわからない」という方も多いかと思います。 本記事では Composition API 時代の便利ライブラリ VueUse を用いた実装例や、 VueUse 自体の実装がどのようなものか紹介します。 Composition API の良さや雰囲気もキャッチアップしていただければ幸いです。 VueUse とは？ VueUse は Anthony Fu さん1が中心に開発しているライブラリで、Composition API を用いた便利系関数を数多く集めたライブラリです。 例えば、ブラウザ上のマウ
Vue.jsの基本からよく見かけるUIの実装方法まで、JavaScriptが苦手な人向けに解説した入門書 -Vue.jsの教科書
Vue.jsの基本から、Webページやスマホアプリでよく見かけるUIの実装方法まで、やさしく丁寧に解説した入門書を紹介します。 HTMLとCSSはできるけどJavaScriptはいまいち、Vue.jsってよさそうだけど何から始めればよいか分からない、そんな人にぴったりの一冊です。Vue.jsの解説書にはJavaScriptの基礎知識が前提のものが多いですが、本書は異なります。 本書はある程度HTMLとCSSが使用でき、JavaScriptはちょっと苦手という人にお勧めです。特に、Vue.jsに一度挑戦してみたけど、JavaScriptがいまいちの私には無理だった、、、と挫折してしまった人に特にお勧めです。
今からVue.jsを始める人のための「知るのを後回しにしてよい」n個のこと - Qiita
＊この記事は2020年3月頭に書かれている記事です どうも、Vueはいいぞおねーさん(自称)です。 Vue.jsは私に言わせるととてもよいフロントエンドフレームワークであり、その理由の一つにプログレッシブフレームワークである(段階的に利用する機能を増やしていくスタイルにマッチしている)ものとして、フロントエンド初学者の皆さんにもおすすめしたい代物です。 しかし、現在までに様々なプラクティスが考案されたがゆえに、「最初からベストな方法で始めたい」という思いから一度にたくさんのことに挑戦してしまいたくなりがちです。 そしてそれはプログレッシブという思想に反するもので、結果として挫折を生んでしまっているのではないかと思いました。 そこで今回は「知るのを後回ししてよいこと」として、Vue.jsへの入門する方へのアドバイスを独断と偏見で不要度という指標でまとめてみました。 不要度というネガティブな指
Vue.js: The Documentary
by honeypot.io | What began as a side project of a Google developer now shares the JS leaderboard with #React and #Angular... With the help of Sarah Drasner, Taylor Otwell, Thorsten Lünborg and many others from the Vue.js community, Evan You tells the story of how he fought against the odds to bring #Vuejs to life. Check out the home for untold developer stories around open source, careers and al
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Vue.jsのdatepickerは「vuejs-datepicker」がおすすめ！ | カバの樹
「Vue.js」でWebページを作成できるフレームワーク「Nuxt.js」最初の一歩
Top 5 CSS frameworks for your Vue.js project (2021) – Renat Galyamov
Vue.js を vue-cli を使ってシンプルにはじめてみる - Qiita
