Chrome62からHTTPページのinputタグに警告が表示されるようになるらしい
はじめに
Web系Developerの方々にGoogleさんから悪魔のメッセージがきてるみたい
Twitterで結構話題になってた
Chrome62でHTTPページのフォームにテキストを入力すると、 「保護されていません」という警告が表示されるようになります。 また、シークレットモードを使用している場合は、 HTTPページにアクセスするだけで「保護されていません」と表示されます。 長期的には、HTTPで配信されるすべてのページを「保護されていません」と明示することを計画しており、 この新しい警告はその一環です。
Flashなくすぞ！Flashなくすぞ！Flashなくすぞ！
の次はHTTPSにするぞ！を本格的に開始するみたい
inputの警告が出るってことは、ほとんどのサイトをSSLに対応させなきゃいけないから結構面倒だね
小学校時代の同級生は、投稿した記事のFacebookのいいねが全部消えてしまうのを残念がっていた
まぁ対策はあるみたいだけど、結構面倒みたい(鼻ほじ)
感想
僕がこの流れを見て思ったことは、SSLって安全なの？ってこと
GoogleさんはHTTPSへの流れにもってこうとしてるけど、
前に僕が研究室友達に聞いた話だと、
『SSLには重大な脆弱性がありTLSへの移行の流れが来てる』っていう話を前に聞いた
僕はSSL/TLSとかのセキュリティ関係は詳しくないので、よくわかりませんが
『SSLに移行させておいて、すぐにTLSに変えてね！』とかになったら面倒だろうな
(SSLからTLSに変えるのが難しいのかもよくわかってない)
誰か詳しい方いらしたら教えてください！笑
AdminLTEってのを触ってみたよ
はじめに
今日はネイティブアプリを管理するためのWeb管理画面の機能追加がお仕事
まずは前回構築したLaradockを起動しよう！
$ docker-compose up -d apache2 postgres
エラーが出た
ERROR: Couldn't connect to Docker daemon. You might need to start Docker for Mac.
Docker for Macってインストールしたらパソコン起動時に勝手に起動するのかと思ってた
自動起動の設定があると思うけど、家に帰ってから調べることにしよう
Laradockの起動もできたし、URLにアクセスしたらちゃんと表示される
これで準備完了！
けど、今回のシステムの情報を全く知らないからドキュメントを読んでいこう
社員さん曰く、できるだけパーツ化してやって欲しいとのこと
見た目はAdminLTEを使っているらしい(初めて聞いた)
表が多いためうまくパーツ化できていないらしい
(現在はテーブルで実装)
テーブルはあまり好きじゃないからFlexかGrid Layoutを使いたいところ
(前勉強したけど、その後使ってないから使ってみたい笑)
MacでDocker構築・laradockを使ってみる
はじめに
３ヶ月ぶりにバイトに来た
(１ヶ月ぶりだと思ってたけど、社員さんに３ヶ月ぶりだねと言われて時の流れの早さに驚愕した)
(それだけ卒業研究に集中していた証拠だろう)
久しぶりすぎなので、まずは環境構築からしてほしいとのこと
今作っているものは、Dockerでやることになったみたいなので、Dockerの構築をまずはしてほしいみたいなので
ここに書いていこうと思う
(リモートの人が２日前にこのシステムを作り、社員さん１人が手順書を見て環境構築に成功させた。)
(成功した社員さんは今日出社しておらず、他の社員さんに情報共有はされておらず。)
(自分以外の数人も同時に環境構築に取り掛かる)
Docker構築手順
まずは下記のリンクにアクセスして、これの手順に 従っていくみたい
docs.docker.com
英語やんけー
英語は苦手なんですよね
Docker for MacはMacで実行するために必要なものが全部入っているみたい
安定verと開発中のやつ(次期搭載機能)？があるみたい
Mac OS X El Capitan 10.11以上でMMU仮想のサポートが必要みたい(4GB以上のRAMが必要)
HEIFという画像フォーマットが今後主流になるらしい！？
今回もTwitterを見ていたら、HEIFがすごいぞ！ってつぶやきがあったので、調べてみた
HEIFとは？
High Efficiency Image File Formatの略
(エイチ・イー・アイ・エフ、ヒーフって呼ぶらしい)
MPEGによって開発された画像フォーマットの標準規格
- MPEG
-
Moving Picture Experts Groupの略
ビデオとオーディオに対して符号を付与する基準の開発責任を負ったISO/IECのワーキンググループ
JPEGに変わるかもしれないものらしい
JPEGと比較しての利点
- PEGのおよそ半分のサイズ
- 解像度が高い
- 画像の色は最大１６ビットカラー(JPEGは８ビットカラー)
- 一連の画像にすることができる(GIFの代わりになる可能性も)
- 透明度サポート
- いつでも編集を元に戻すことができる(画像を変更したり再保存することはない)
なぜ話題になった？
WWDC2017(Worldwide Developers Conference)のiOS11から画像の保存をJPEGからHEIFにする！
って言ったことで話題になったみたい
Appleの最新のiDevicesにはHVEC、つまりHEIFのためのハードウェアサポートが組み込まれている
だからシステムやバッテリーに負荷をかけずに画像を超高速でエンコードしてデコードできる
参考資料
「HEIF」ってなに？高画質で軽量化！iOS11から変わるiPhone写真の保存形式を調べてみた | さくっとふぉとらいふphotolog.aiko15.com
floatもflexも古い？Grid Layout Moduleの時代が来るらしい
はじめに
大学３年生の時に、小学校の同窓会に行ったらWeb系の会社をやっている人間がいて、
数件の案件を手伝わせていただいたときがあった
その時にレイアウトの指導をしてもらった際、
自分はfloatを使っていた
『やっぱりfloat使うよね。時代はflexなんだよ。float使っているのはださいよ』
と言われ、flexを教えていただき自分はflexの魅力にやられ信者になった
それからサイトを見てflexで書かれたコードを笑い、flexを崇める日々が続いた
(おしゃれなサイトは大体flexを使ってる)
そんな僕がTwitterを見ていると、『flexは古い。時代はGrid Layoutだ』みたいな記事を見たので
1時間ほど調べた情報を書いていこうと思う
利点
・聖杯レイアウト問題というのを解決できるらしい
(Web業界にいたことはないので、初めて聞いた)
聖杯レイアウト問題とは
List ApartにMatthew Levine氏がIn Search of the Holy Grailというコラムを発表したらしい
彼が発表したのは
ヘッダ、フッタ、メインコンテンツ、両側のサイドバーの４つのセクションで構成された３カラムレイアウト
- 中央のコンテンツは可変、両側のサイドバーは固定の幅
- マークアップではコンテンツは、2つのサイドバーより上に記述される
- コンテンツとサイドバーはそれぞれの内容にかかわらず、同じ高さ
- 最小限のマークアップしか必要にならないこと
- コンテンツの量が少なかったとしても、フッターはページの下部に固定されること
下記の画像がわかりやすい？
http://coliss.com/wp-content/uploads-201602/2016040912-02.gif
・アイテム間の余白調整が手軽
・簡潔に書ける
対応ブラウザ
- Chrome 57 (2017年3月)
- Firefox 52 (2017年3月)
- Safari 10.1 (2017年3月)
- iOS Safari 10.3 (2017年3月)
- Internet Explorer 10 (2017年3月)
- Edge 12 (2017年3月)
2011年頃？に生まれ技術らしい
だが、最近にモダンなブラウザが一気に採用し、
使っても大丈夫な感じになった
(これから流行っていくのかな？)
【アスペクト指向JavaScriptフレームワーク】Cerny.jsの英語ドキュメント翻訳
Cerny.jsを翻訳した
Qiitaにあげたのだが、最近ガイドライン系で問題になっていて、消されてもおかしくない内容なのでこちらでもあげることにした
概要
導入
Cerny.jsは大規模な開発チームのJavaScriptプロジェクトの開発を容易にすることを目的としてJavaScriptライブラリ
以下の解決を提供する目標を達成しようとする
- メソッド呼び出しをインターセプションする
- 関数呼び出しの引数と戻り値の型チェック
- 依存関係の管理
- ロギング
- スキーマに対するオブジェクトの検証
- プログラミングの規約
- 辞書
- JSONをテキストやHTML形式で表示
- 簡単な設定
- 良いドキュメント
