前週のフロントエンドの世界からの新鮮な材料のダイジェストNo. 301（2018年2月5日〜11日）

フロントエンドエリアとその周辺の新しいマテリアルへのリンクを含むセレクションをご紹介します。

メディア | Web開発 | CSS | Javascript | ブラウザ | おもしろい

---

メディア

• フロントエンドウィークエンドポッドキャスト＃39-サンフランシスコでの生活と仕事、フロントエンドダイジェスト、FRPについてのGrigory Shehet

• Podcast Web Standards、Issue No. 107： ChromeのJS用CSS、HTTPSおよびSEO、Safariのサービスワーカー、CSSマーケティング、インタビューの実施方法および合格方法。

• Devschachtポッドキャスト： Night Front End ＃21-Rolling Scopes Day One

• Angular Five Minute Podcast ＃9-Angular Msk、Pipeable Operators、Clarity UI、CLI 1.7.0 Beta 3、Ng 6.0 Beta 2

• ポッドキャスト「Drinkcast」、 ＃25-「これらのJavaフロントエンド」

• 「すべてのHTML」＃35： 「Wordpressミニサイトを1時間でゼロから作成」

• 2月3日にモスクワで開催されたWSD会議の記録

• MITAP by BEM。 基本からReact.jsまで。

• @SmashingConf Londonのすべてのビデオ

• よ！ ロブ・ホープからの最新のデザインとウェブ開発のニュースを含む新しいショー

ウェブ開発

• フロントエンドフレームワーク：カスタムとすぐに使えるソリューション

• noopenerを使用するもう1つの理由は、レンダリングプロセスの分布を深く掘り下げることです。

• Web Assembly Studio - Web Assemblyを探索するためのオンラインサンドボックス

• 性能：
  
  
  
  • webpackによるWebパフォーマンスの最適化：フロントエンドコードのサイズを縮小し、その速度を監視します 。 developers.google.comのIvan AkulovとEddie Osmaniからの新しいガイド
  
  • SEOの人々がGoogleライトハウスから利益を得る方法-Webパフォーマンスメトリック
  
  • プログレッシブ画像とユーザーエクスペリエンスの現在の状態を見る
  
  • サイトのパフォーマンスとクロールの予算
  
  • ページの読み込みをさらに高速化した方法
  
  • パフォーマンスを向上させるためにMP4ビデオを最適化する
  
  

• AMP / PWA：
  
  
  
  • デスクトップ上のPWA
  
  • サービスワーカー：プログレッシブWebアプリの背後にある小さなヒーロー
  
  • Google AMPとWordPress：知っておくべきこと
  
  • Microsoft EdgeおよびWindows 10でPWAを紹介します 。 マイクロソフトがプログレッシブWebアプリの実装戦略を概説
  
  

• ツール：
  
  
  
  • Webpackでのルーティング、バンドル、遅延ロード
  
  • hreftools-作業を高速化するオンラインWebツールのコレクション
  
  • SEO監査の新しいカテゴリがChromeサイト分析セクションに登場しました。
  
  • WebpackからParcelへ：create-react-app migration
  
  

• アクセシビリティ：
  
  
  
  • aria-labelは外国人嫌い
  
  • アクセシビリティの旅：この間に学んだこと
  
  • 面接に関するアクセシビリティの質問
  
  • WCAG 2.1の簡易ガイドライン
  
  

• 効果：
  
  
  
  • CSS / SVG / JS＃69の美しいエフェクトの毎週の選択
  
  • 純粋なCSSアニメーションキューブ
  
  • 無限CSSラダー
  
  • スライスリバイラー スライダーバーの壮大なアニメーション
  
  • カーソルの方向に応じたホバー効果
  
  • JSでのWinamp2-jsの実装
  
  

CSS

• 恐竜用の最新のCSS

• 最新のWebアプリケーションのリンクとボタン

• 「デッド」CSSの検索

• CSSにより、機密性の高いユーザーデータを収集できます 。

• 2018年のレスポンシブデザインにメディアクエリを使用する

• 円錐グラデーションとCSS変数を使用して、範囲入力用の円グラフを作成する

• CSS変数を使用したサイトのテーマ

• CSSカウンターとCSSグリッドを使用した計算

• modern-normalize-ブラウザーでのモダンスタイルの正規化手法

• 3つのFlex-Box超能力-フレックスベース、フレックスシュリンク、フレックスグローの仕組み

• Internet Explorerはまだ存在しています。 CSSグリッドを使用しますか？

Javascript

• 1000以上のJavaScriptプロジェクトの上位10個のエラーとそれらの除去に関する推奨事項

• JSの仕組み：Web Workersと5つの使用シナリオ

• JavaScript / Reactコードで赤旗を定義する方法を学びます。

• 2018年のJavaScriptテストの概要

• GraphQLアプリケーションの5つの一般的な問題（およびそれらの修正方法）

• 数字で見るJavaScriptフレームワーク-2018年冬

• 角度5対 React vs. Vue

• ES6：
  
  
  
  • EcmaScript6のキャンセル可能な約束
  
  • JavaScript ES6-スプレッド文の構文（...）
  
  • JavaScript ES6：拡張演算子
  
  • ES6でデフォルトオプションを使用する
  
  • JavaScriptのプライベート変数
  
  

• 反応：
  
  
  
  • React 16.3の新機能（.0-alpha）
  
  • React Endless Scrolling Techniques
  
  • 反応パターン
  
  • React Scopeプレゼンテーション -Reactコンポーネントを視覚化し、アプリケーションとの対話方法を示すツール。
  
  • Reactの新しいコンテキストAPI
  
  

• VueJS：
  
  
  
  • Vue.jsとKairosを使用した簡単な顔認識アプリケーションの作成
  
  • 2018年のVue-Vue.jsの著者であるEvan Youへのインタビュー
  
  

• 角度：
  
  
  
  • AngularJSからAngularへの移行： 要素を転送するための目標、計画、規則（1/3） 、 ハイブリッドモードの問題と解決策（2/3） 、 AngularJS後の生活（3/3）
  
  • ブラウザでAngular CLI担当者を直接実行する
  
  • Angular SDKの使用を開始する
  
  

ブラウザ

• Firefoxより高速で、更新されたデザイン：Opera 51ブラウザが導入されました

• Firefox 59のURLから個人情報を削除する機能を発表

• GoogleはChrome 65のベータ版をリリースしました 。 開発者はポップアップブロッカーを改善し、Android用のビデオプレーヤーを更新し、いくつかの新しいAPIを導入しました。

• 7月から、Google ChromeはすべてのHTTPサイトを安全でないものとしてフラグを立てます

• Google Chromeでの広告ブロッカーの仕組み

おもしろい

• 決して死ぬことのない15のSEO神話

• WordPressの新しいバージョンにより、エンジンの自動更新機能が破損しました

• 激しいゲームセッション中にGoogleがAIマルチタスクを教えた

• ほぼすべてのサイトをWordPressエンジンに「置く」ことができる脆弱性が発見されました。

• MozillaがInternet of Things Gatewayを導入

• 宇宙ビジネスで何が起こっているのか：民間宇宙探査の有望な分野のレビュー

• Schrödingerブロックチェーン：ビットコインのコアにあるテクノロジーがどのように有用かつ危険であるか

• GitHubプロジェクトの2018年の主な傾向が特定されました

• 「個人的に、私たちの機械の君主を歓迎します」：AIについて世界をリードする科学者の意見

• 欲、脆弱性、不透明度、ペティネス：ディープラーニングに基づくAIの何が問題なのか

• プログラマーは2015年のパズルを解き、ビットコインで5万ドルを受け取った

入力ミスやリンクの破損/重複をおaびします。 あなたが問題に気づいた場合-個人的なメールに書いてください、私たちはすぐにそれらを修正しようとします。

→ 先週のダイジェスト

ダースモールとアレクスコロビンが作成した資料