<div id="app"> <input type="text" v-model="addText" placeholder="ToDoを入力"> <button v-on:click="addToDo()">追加</button><hr> <ul v-for="todo in list"> <li>{{ todo.id }}:{{ todo.text }}</li> </ul> </div>
はじめに 先月、フロントエンドエンジニア界隈ではリニューアルした日経電子版が高速すぎてヤバイ件に注目が集まりましたね。 今自分で注目しているVue.jsと、PWAでSPAをつくるためのことはじめを記事にしようと思います。 1. PWAとは PWA(Progressive Web Application)とは、一言で言えば「ネイティブアプリのような使い勝手を実現したWebアプリ」です。 Googleのコードラボを一通りやると全体像がつかめるかと思います。 PWAでできること ホームスクリーンへの追加(Add to homescreen) PWAで作られたWebアプリケーションにアクセスした際に、ホーム画面への追加を促すことができます。 条件は下記です。 - 必要な情報が記載されたマニフェストファイルが存在する - サイトにService Workerが登録されている - HTTPS経由で配信
以下は、THE COMPLETE GUIDE TO PROGRESSIVE WEB APPSの日本語訳です。 THE COMPLETE GUIDE TO PROGRESSIVE WEB APPS Progressive Web Apps (PWA)は、モバイルアプリ開発の最新トレンドで、2018年初頭ではAndroid端末にだけ対応しています。 WebKitはSafariとモバイルSafariの技術を元に、最近(2017年8月)Service Workerをブラウザに導入する作業を開始したと発表しました。 これは要するに、遅かれ早かれiOS端末にも搭載されるということを意味するので、Appleが決心しさえすればiPhoneやiPadでもPWAを使用できるようになるということです。 PWAは画期的な新技術というわけではなく、Webベースのアプリケーションを作成するための一連のテクノロジーを識
1. PWAとは? PWA(Progressive Web Apps)はGoogle Chromeエンジニア Alex Russell氏が2015年に考案した概念として知られています。特徴としてネイティブアプリのようなユーザー体験をWEBで提供するのが目的です。 PWAの特徴 FAST : パフォーマンスの良い、軽決な動作 Integrated : OSと統合されたユーザー体験 Engaging : アプリのような体験を提供 Reliable : オフラインでも動作する便利性 PWAを実現するAPI PWAを実現するために中心となる機能を提供するのが「Service Worker」です。 Service Worker Service Workerは「バックグラウンドで動作するプログラミング可能なネットワークプロキシ」のことです。Service Workerを利用するとWebページのオフライ
日常的にVueを使用している開発者が、Reactはどうなのだろうと思い、ReactとVueで全く同じアプリを作成した時のそれぞれの工程を比較して分かった相違点を紹介します。 I created the exact same app in React and Vue. Here are the differences. 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 隣の家の芝生は青く見える VueとReactで作成したアプリの見た目を比較 VueとReactはデータをどのように変更させるか アイテムの新規作成 アイテムの削除 イベントリスナーを渡す 子コンポーネントにデータを渡す 親コンポーネントにデータを戻す 終わりに 隣の家の芝生は青く見える 私は現在の職場でVueを使用しており、Vueがどのように機能するかかなり理解してい
Qwintryチームは最近、既存のすべてのプロジェクトのフロントエンドをVue.jsに移行しはじめました。新しいプロジェクトでもVue.jsを使います。 レガシーなDrupalのシステム(qwintry.com) ゼロから新しく書きなおすqwintry.comのブランチ Yii2で動くb2bシステム(logistics.qwintry.com) その他、比較的小さめのプロジェクト(ほとんどは、PHPとNode.jsでバックエンドを構築しているもの) プロジェクトの規模についていうと、 Qwintry は世界中で約50万人の顧客が使っています。アメリカとドイツに倉庫を持っていて、アメリカ国内 最大の郵送先 のひとつで、東欧や中東への出荷に注力しています。Qwintryは、アメリカのオンラインストアでグッズを購入する人たちのためのツールです。私たちの倉庫に届いた荷物をコントロールパネルで管理で
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く