新しいパッケージの開発はVue 3で作ろう Vue.jsのエコシステムを構築するには
LINEが定期的に開催する技術者向けミートアップ「LINE Developer Meetup」の72回目は、Vue.js Communityと共同で開催。ここではLINEの花谷拓磨氏が「How to development library to Vue 3」というテーマで、Vue 3でパッケージを開発する上でのノウハウを共有しました。 LINEとしてVue.jsのスポンサリングを開始 花谷拓磨氏（以下、花谷）：「How to development library to Vue 3」という内容で登壇いたします。よろしくお願いいたします。私はLINE株式会社のFront-end Dev9 Teamに所属している、フロントエンドエンジニアの花谷と申します。Vue.jsのコミュニティとは3年ほど前からつながりがありまして、詳しくはスライドを参照してほしいのですが、それに付随してOSS開発なども行
ReactとVueの比較、全く同じアプリを作成してみて分かった相違点 2019年Edition
日常的にVueを使用している開発者が、ReactとVueで全く同じアプリを作成した時のそれぞれの工程を比較して分かった相違点を紹介します。 特に、Reactのフックについて具体的な使い方が解説されています。 I created the exact same app in React and Vue. Here are the differences. [2019 Edition] by Sunil Sandhu 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 本記事は以前翻訳した記事の2019年Editionで、Reactのフックが追加されています。以前の記事は下記をご覧ください。 ReactとVueってどう違う？全く同じアプリをReactとVueで作成してみて分かった相違点 隣の家の芝生は青く見える ReactとVueで作成し
次世代の管理画面を作るフロントエンドの取り組み - BASEプロダクトチームブログ
フロントエンドエンジニアの松原(@simezi9)です。BASEでは現在ショップ向けの管理画面をリニューアルするプロジェクトが進んでいて、UI/UXの更新と同時に創業当時から継ぎ足して作ってきたフロントエンドの技術スタックを一新しようとしています。この記事では、具体的にそのフロントエンドの更新でどのようなことに取り組んでいるのかをいくつかご紹介したいと思います。 Vue + TypeScriptを利用したMPA(multi page application)化 HTMLの構築をPHP(サーバーサイド)からJS(クライアントサイド)へ移行する 従来の「BASE」の画面ではPHPでHTMLの構築を行っていましたが、HTMLの構築をすべてPHPのコードから分離させて、Vueによるクライアントサイドでのレンダリングにしています。また管理画面の特性上（1ページあたりの閲覧時間が長く相対的にローディン
【Laravel 6 & PHP 7.4 対応】Vue + Vue Router + Vuex + Laravel チュートリアル（全16回）を書きました。 - Qiita
【Laravel 6 & PHP 7.4 対応】Vue + Vue Router + Vuex + Laravel チュートリアル（全16回）を書きました。LaravelチュートリアルVue.jsVuexvue-router 2020/1/5 更新 チュートリアルを Laravel バージョン6 & PHP 7.4 に対応し、加筆修正しました。 技術ブログに 『Vue + Vue Router + Vuex + Laravelで写真共有アプリを作ろう（全16回）』 を公開しました 出来るだけたくさんの方に見てほしいので宣伝エントリを書きます。 コンテンツ フロントエンドに Vue.js + Vue Router + Vuex と サーバーサイドに Laravel を使用して写真共有アプリを開発するという内容です。 こんなやつ ができます。 写真を投稿できます。 コメント投稿、いいね、ダウン
Weexを使ってnanaのログイン画面作ってみた - Qiita
初めまして。 nana musicでサーバーサイドエンジニアをやってる江原と申します。 普段サーバーチームに属してますが、最近はもっぱらフロントをメインで開発をやってます。（たまにAPI作ったりしてましたが最近もっぱらやってなくて寂しい） 自己紹介はさておき、アドベントカレンダー13日目はWeexというVue.js製のネイティブアプリ言語を使って弊社で開発してるnanaのログイン画面を作ってみようと思います。 Weexとは まずWeexってなんだよ！初めて聞いたよ！っておっしゃる方が大半だと思います。 Weexとは、世界的にで有名な企業のalibaba社が開発を行なっていたVue.js製のネイティブアプリ言語です。 Reactでいう、React Nativeに当たる言語です。 現在はApache Software Foundationというところに移管されたみたいです。 基本Vueベースな
Vuexによる状態管理を含む最高に快適な Vue.js + TypeScript の開発環境を目指す話 - Qiita
追記 2019/12/05 Vue 3.0 のリリースが現実的に近づいてきて色々と事情が変わっているので、話半分に聞いておいてください。 はじめに Patreon での支援募集をはじめました。この記事が良かった！という方は、今後の情報発信のためにもぜひぜひ支援お願いします。 https://www.patreon.com/potato4d Vue.js Advent Calendar 2018 年の管理役の potato4d です。昨年に引き続き、今年も Vue.js のアドベントカレンダーは他にもたくさんあるので、ぜひ #1 から追ってみてください。 12日目の今日は、 Vue.js + TypeScript での理想的な開発環境について考えてみたいと思います。 Vue.js における TypeScript 利用はまだまだ課題が多く、型の恩恵をうけるためのテクニックも複数存在しています。
「Vueコンサルが教えたくない７つの真実」を勉強してみた - Qiita
Vueの便利なテクニック７つ Youtubeで見つけたので勉強ついでにまとめてみる。 出展 Chris Fritz さん Youtube https://www.youtube.com/watch?v=7YZ5DwlLSt8 資料（Github） https://github.com/chrisvfritz/7-secret-patterns まとめ - 動画とはバージョン違い（英語） https://www.vuemastery.com/conferences/vueconf-2018/7-secret-patterns-vue-consultants-dont-want-you-to-know-chris-fritz/ Productivity Boost - 生産性向上 1. Smarter Watcher 元のコードはこれ。生成時になにかしてアップデート時にもなにかする。よくやる。
Vue.js プロジェクトの爆発させかた #ichigayageek / How to explosion Vue.js project
2018.06.26 に #ichigayageek で話したスライドです。 https://ichigayageek.connpass.com/event/87792/
Vue.jsで始めるPWA - Qiita
はじめに 先月、フロントエンドエンジニア界隈ではリニューアルした日経電子版が高速すぎてヤバイ件に注目が集まりましたね。 今自分で注目しているVue.jsと、PWAでSPAをつくるためのことはじめを記事にしようと思います。 1. PWAとは PWA（Progressive Web Application）とは、一言で言えば「ネイティブアプリのような使い勝手を実現したWebアプリ」です。 Googleのコードラボを一通りやると全体像がつかめるかと思います。 PWAでできること ホームスクリーンへの追加（Add to homescreen） PWAで作られたWebアプリケーションにアクセスした際に、ホーム画面への追加を促すことができます。 条件は下記です。 - 必要な情報が記載されたマニフェストファイルが存在する - サイトにService Workerが登録されている - HTTPS経由で配信
なぜプロダクトに Vue.js を採用したのか? 運用してみてどうっだった? という話 | Nagisaのすゝめ
2018年2月6日 なぜプロダクトに Vue.js を採用したのか? 運用してみてどうっだった? という話 余り知られていませんが Nagisa ではアプリだけでなく Web のプロダクトやサービスもあります。マンガZERO や UPTOON! や 月刊コミックジヘン 辺りがそうです。 何れも Vue.js で作られている SPA で、社内・外両方から “なんで Vue.js なの?” とかよく聞かれます。そこで、今回はどうして Vue.js を選択したのか、Vue.js の何がいいのか、Vue.js で運用してみてどうだったかの話をしたいと思います。 はじめに Vue.js を導入する前のマンガ ZERO Web は 2.0系の Riot で作られていました。今ある SPA のような形ではなくサーバサイド (Go) にてメタタグを生成、空のマウントポイント <div id="app"><
Vue.js + Nuxt.js + GraphCMSでHPリニューアルしました - ShoYamane.me
Vue.js + Nuxt.js + GraphCMSでHPリニューアルしました 今年2回目となりますが、HPをリニューアルしました。以前は普通にWordPressで作ってたんですが、Nuxt.jsがV1のRCリリースされてたので本格的に触ってたら題材がないのでHP作り変えるかって感じですね。 Nuxt.jsはVue.jsで作ったSPAをSSR（サーバサイドレンダリング）してくれるやつで大変便利なのですが、サーバーサイドというかnode.jsでゴニョゴニョやってるところもあるみたいでそのへん意識してコード書かないといけないので最初は理解が大変でした。ググっても情報も少ないのでGithubで色んなひとのコードを貪るように読みました。 せっかくなのでサーバーレスでいきたいのとCMSどうするかというところで色んなサービス触ったのでその辺の選定を書いてみたいと思います。Vue.js + Nuxt.
VueをSSRに乗せると容易にXSSを生み出す場合がある件について - Qiita
はじめに 最近Vue.jsを頻繁に使用するのですが、他のSSR(サーバーサイドレンダリング)の仕組みと組み合わせる場合、容易にXSSを生み出してしまうケースが存在するので、注意喚起も兼ねて事例を紹介させていただきます。 9月7日 追記を追記しました 前提 サーバーサイドで動的に要素をレンダリングするシステムとVue.jsを組み合わせた場合 この記事はrailsのSSRとの組み合わせで解説しますが、プレーンなPHP等、動的にHTMLをレンダリングシステムとの組み合わせでも発生します。 サンプルコード まず、こちらのコードをご覧ください。 user.erb <div id="app"> <div class="user"> <%= @user.name %> </div> <button v-on:click="registerFavorite" data-user-id="<%= @user
Vue.jsのコンポーネント詰め合わせ「Element」がスゴかった | 綺麗に死ぬITエンジニア
JavaScriptのフレームワークである「Vue.js」、皆さんは使ってますでしょうか。 学習コストの低さ、小規模案件での導入のしやすさ、大規模案件にも対応できる拡張性の高さから、最近はVue.jsばかりいじっています。 今回は、そんなVue.js上で、すぐに高機能なUIパーツが使えるようになるコンポーネント詰め合わせライブラリ「Element」が予想以上にスゴかったので、紹介したいと思います。簡単に高機能なUIが実装できるので、Vue.jsを使ったことがない人も、一読していただき、「Vue.js使ってみよう！」となってくれると、嬉しい限りです。 Vue.jsとは知らない人のために、Vue.jsの紹介をしておきます。 Vue.jsはJavaScriptフレームワークの一つです。 他の一枚板のフレームワークとは異なり、初めから少しづつ適用していけるように設計されています。他のライブラリや既
実況中継シリーズ Vue.jsで実現するMVVMパターン Fluxアーキテクチャとの距離 - Re.Ra.Ku アドベントカレンダー day 13 - Re.Ra.Ku tech blog
前説 丸山です。Re.Ra.Ku. アドベントカレンダー13日目の記事です。前日はiOSアプリのUIをコードで書いてみる話でした。明日はおそらくScalaの話になると思います。 さて、以前も話題にしましたが、builderscon2016が先日開催されました。チケットは3hでSOLD OUT。プラチナチケットと化した参加権ですが、発表する側ならば実質無料で参加し放題！これはいっそ申し訳ないレベルでは！？ というわけで、せっかく発表したのでその内容をなるべく多くの手段で共有したい。そう思い、今回も実況中継シリーズを弊社テックブログで行います。実況中継シリーズというのは、プレゼンをブログで再現するアレです。なお、実際のプレゼンは動画になってYoutubeにアップロードされております。builderscon公式サイトのセッション詳細ページからもご覧いただけますので、よろしければそちらも合わせてご
Vue.js Tokyo v-meetup="#3" に参加してきました - tacamy--blog
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 に祝福を！
Vue.js Tokyo v-meetup="#3" での発表資料です。
Vue.jsで実現するMVVMパターン Fluxアーキテクチャとの距離
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Vue.jsの勉強にもいい！UIコンポーネントやインタラクションを実装するチュートリアルがまとめられた -Vue.js Examples | コリス
やわらかVue.js
Nuxt 2 - The Intuitive Vue Framework ドキュメント
