PWAのメリットが強くなる時ってどんなときか考えた。 今回はネイティブアプリの代わりにPWAで頑張る話したけど、ネイティブアプリのありなしに関わらずWebを良くしていきたい。 紹介した自作PWA - http://ease.netlify.com/ (TODOリスト) - http://mottox2.com/ (ブログ)
![ネイティブアプリの代わりにPWAで戦う選択肢 / pwa-instead-of-native](https://cdn-ak-scissors.b.st-hatena.com/image/square/ebd3e04c8df97b558e895ad67a9a69bf6ae70147/height=288;version=1;width=512/https%3A%2F%2Ffiles.speakerdeck.com%2Fpresentations%2Fb175461575ba43b39c962562825f67dc%2Fslide_0.jpg%3F10085015)
PWAのメリットが強くなる時ってどんなときか考えた。 今回はネイティブアプリの代わりにPWAで頑張る話したけど、ネイティブアプリのありなしに関わらずWebを良くしていきたい。 紹介した自作PWA - http://ease.netlify.com/ (TODOリスト) - http://mottox2.com/ (ブログ)
※ この記事はポエムです。 先日、 アイドルマスター シャイニーカラーズ がリリースされました。 僕自身はアイマスはちょっとアニメを見る程度で熱心なファンというわけではないのですが、こちらのゲームはゲーム内容だけではなく別の側面でも注目されていると思います。 それは、ブラウザ上で動くゲームであるというところです。ブラウザゲーム自体は古来から存在するものですが、このゲームが挑戦的なのは、「PWAであるブラウザゲーム」であるところであると思います(PWAであるかどうかは後述します)。 少し触ってみて「これは昨今のソーシャルゲーム的ゲームをPWAとしてアプローチしたとても挑戦的なプロダクトだ」と自分の中で盛り上がっているので、なぜ盛り上がっているかを冷めないうちに書いてみようと思います。 シャニマスはPWA? そもそもPWAとはなんであったか PWA という言葉はGoogleが提唱して以降よく耳
NGINX Unitが正式リリース。PHP、Go、Pythonなどに対応した軽量アプリケーションサーバ オープンソースで開発されている軽量なアプリケーションサーバ「NGINX Unit」の正式版がリリースされました(「Announcing NGINX Unit 1.0 | NGINX」)。 NGINX Unitは、軽量なWebサーバとして知られるNGINXの開発者であるIgor Sysoevが設計し、NGNIXのソフトウェア開発チームが実装を担当したもの。昨年の9月にパブリックプレビュー版が登場しており、今回それがバージョン1.0に到達しました。 参考: 日本Nginxユーザ会が発足。開発者Igor Sysoev氏が語る、Nginxが生まれ、商用化された理由 - Publickey NGINX Unitの主な特長は、動的制御が可能なためコンフィグレーションやアプリケーションの入れ替え、バー
bonfire frontendで発表した今後のフロントエンドの話です。
修士以降の学生で研究に取り組んでいると、自分のプロジェクトやpublicationをまとめたシンプルなウェブページが欲しくなってくる。Wordpressやstrikinglyみたいなサービスが出ているが、オリジナルのWebページを作りたいときには制約が多かったり、機能が多すぎたりすることがある。 HugoはGo言語で記述された、 スゴイハヤイ静的ウェブジェネレータである。 記事やプロジェクトなどを Markdown記法 で記述することで投稿したり更新したりできるため、普段mdでノート取ってる方やQiitaの諸兄・諸姉には非常に使い勝手のいいWebジェネレータであると思う。 今回は Academic テーマをベースにオリジナルページを作成してみた。 ウェブサイトはこちら : web 使い方(初めての人へ) https://gohugo.io/getting-started/quick-sta
HTML5 Conference 2017.9.24 1. “モダン”ウェブアプリケーション ∼アメブロ5ヶ年計画∼ HTML5 Conference 2017.9.24 原 一成 @herablog 2. アメーバブログ 2004年開始のブログサービス 芸能人の利用が多い 芸能人以外とそれ以外のPVは半々 3. 2015 バックエンドシステムの刷新 2017 2016 Isomorphic JavaScript AMP https Code-splitting Node.js v8 React 16 PWA 4. 5年かけて“モダン”な状態にする 5. “モダン”であること エコシステムとつながっていること 6. “モダン”であること エコシステムからの恩恵 エンジニアの流動性 ! " 7. エコシステムからの恩恵 最新技術を取り込みやすい 世界中のエンジニアと協力できる ! 8. エン
民法債権法改正が国会で成立し、品質保証が請負やサービスなど、全てに適用されるようになります。私達が、普段、商品や食品に対して品質保証を求めるように、Webサイト制作や、Webサービスにも品質保証が要求されるのです。「自分達を損害賠償から守るために品質保証をしなくては」というよりも、「自分達の仕事の価値、提供するサービスの価値を高め、差別化するための品質保証」として積極的に活用しませんか?今まで、「テクニック」として語られる事が多かった「Webパフォーマンス」ですが、「品質管理」として本気で取り組みませんか? このセッションでは、Webサイト制作や、Webサービスの現場で、DevOpsの三本柱の一つである「品質保証」を実行していくために必要な、Webパフォーマンス管理・改善に必要な基礎知識を解説します。 HTML5 Conference 講演資料
CSS (Cascading Style Sheets) is the styling language that gives web pages their cozy appearance. While creating web pages with plain HTML is a relic of a bygone era, using CSS to design websites is a constantly evolving practice. It’s tough to picture how web pages would look without CSS — modern application, web, and software design as we know it today wouldn’t exist without this styling language
2015年3月18日 CSS 2011年に「少しのコードで実装可能な20のjQuery小技集」という記事で数々の便利な制作技を紹介したのですが、時は流れ、今ではCSSのみで表現できるものが多くなってきました。という事で今回はその記事内で紹介した技を中心に、かつてはJavaScriptを利用していたものの、今ではCSSのみで実装できる小技を紹介します。 ↑私が10年以上利用している会計ソフト! 目次 Div全体をクリックできるようにする テーブルの偶数・奇数の行の色を変える フォームにテキストを入れておき、フォーカスで消す(文字色も変更) ラジオボタンとチェックボックスを装飾する スライドパネル アコーディオン ツールチップ 言語によってスタイルを変更 横並びのdivの高さ揃える ボックスを上下左右中央に配置する それでは実際にどんな事ができるのか見てみましょう!サンプルも作ったのでコードと
こんにちは。Typetalkチームの永江です。今回は4月にリリースした、BacklogとTypetalkの連携機能である「Backlogカード」の実装の際に行った クリックジャッキング対策 について説明します。 Backlogカードとは Backlogカードは、Typetalkのトピック内にBacklogの課題やコメントをカード形式にして表示する機能です。Backlogの課題キーや課題のURLを貼り付けるだけで、以下の画像のように表示できます(※詳しいご利用方法についてはこちらの「Typetalkのトピック上で課題の詳細を見られる Backlogカード をリリースしました!」をご参照ください)。 Backlogカードの実装は、TypetalkからBacklogに用意した埋め込み用の課題ページを<iframe>で表示するというものです。このような実装にしたのは、もともとBacklogに<if
You should write your next web server in Go. Yes, you! Compared with Ruby, PHP, Python, or Javascript, you're going to get great memory and latency performance, and libraries that do what you expect. The standard library can be a bit lacking though, if you are used to developing with a tool like Rails. I found myself adding the same helpers to every web project that I started in Go, so I compiled
3行で要約 golangでwebアプリを作り始めた golangは好きだけど、今回求める要件に合わないことに気付いた 途中まで書いたコードを捨ててRailsで書き直した 私のGoスキル A Tour of Goを途中まで みんなのGo言語を読んだ スターティングGo言語を読んだ スクレイピングしてDBに保存する簡単なバッチをGoで書いた 背景 とあるtoB向け受発注のWebアプリを作ることにしました。 開発者は私1人。私が目指した基準は以下のものです。 少なくとも3年はメンテできること 未来の自分(他人)が読んでも理解できること このアプリとガッツリ付き合う予定ではなく、出来れば保守は違う人に回したいし機能追加とかも控えめにしたい(重要) デプロイとか運用の手間を簡単にしたい ついでに、学んでおくことが有益になりそうな言語がいい これらを踏まえ、以下の理由からGoを選択しました。 シングル
WebアプリにしろWebサイトにしろパフォーマンスはとても重要です。どんなに高機能であっても、どんなにデザインが良くても、パフォーマンスが悪ければユーザーは離れてしまいます。 とは言え現場はキツキツのスケジュールで、パフォーマンスにまでこだわる余裕がないよ!パフォーマンスはひとまずできる限りのところまで頑張るよ!となってしまうこともあるかと…。 この問題の解決の糸口はパフォーマンスを良くする手段をどれだけ知っているかです。仕様を決めるとき、デザインを決めるとき、実装するとき、それぞれのフェーズでパフォーマンスを常に意識していると自ずとハイパフォーマンスに近づきます。 というわけで今回はフロントエンドの観点から、イマドキのパフォーマンス改善手法をまとめてみました。イマドキと謳っておきながら2年前くらいの技術が出てきたりして最新の話題でもないのですが。 ちなみに、本題に入る前にWebパフォーマ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く