Web開発およびITの世界からの興味深い資料のダイジェスト、先週第197（2016年2月1〜7日）

役立つリソース、興味深い資料、ITニュースへのリンクを含むセレクションをご紹介します

ウェブ開発

CSS

Javascript

ブラウザ

設計

ニュース

おもしろい

ウェブ開発

• BEM方法論：すべてがどのように始まり、なぜすべてが必要なのか
• Web Standards Daysカンファレンスの記録-2015年モスクワ
• FrontendFellows Confからのビデオ
• JekyllおよびGitHubページを使用してブログを作成する
• Ilya KantorによるGulpスクリーンキャストの最初の8つの問題
• パフォーマンスウィークリー。 問題＃0 先週のWebパフォーマンスに関するニュースダイジェスト
• 技術サイト最適化中の間違いを避ける方法 。 初期設定ガイド
• Gruntへの初心者向けガイド
• フロントエンド Webフレームワークの選択方法
• Mobile Firstが古くなった理由
• Webpack入門パート1：Webpack、React、Redux、およびTDDを使用したフロントエンド開発の旅 （Webpackパート1を始めましょう）
• Webpackの解凍 。 プロジェクトの作成プロセスにおける新しいパラダイムの詳細な理解
• Tyler Sticka： SVGアイコン作成プロセス （ケーススタディ：SVGアイコンプロセス）
• svg-icon-system-boilerplate-スプライトでsvgアイコンを組み立てるためのシステム
• Service Worker Cookbook-Mozillaケーススタディコレクション
• Service Workerの作成：例 Lyza Danger Gardnerによる詳細な記事（サービスワーカーの作成：ケーススタディ）
• HTMLレターのタイポグラフィをマスターする （電子メールのマスターHTMLタイポグラフィ）
• 高速化されたモバイルページ
• HTML5 Elements テーブル
• コミットの芸術
• HTML 5ゲーム開発ビデオシリーズビデオシリーズ
• スマート自動トリミングを使用したレスポンシブ画像 （アート指向のレスポンシブ画像）
• 壮大なウェブ：
  
  • CSS / SVG / JS＃23の美しいエフェクトの毎週の編集
  • 音声認識 （Web Speech Demo）
  • アニメーションドラムマシン（SVG） （SVG Animated Drum Kit（Play Me！））
  • CSSとJavaScriptを使用してサイトをプレビューおよびデモするための効果的なツール
  
  

CSS

• グローバルCSSの時代の終わり
• 便利なSCSSユーティリティの選択
• Goldfish CSS3グリッドレイアウト（パート3）
• グリッドレイアウト（CSSグリッドレイアウト）に要素を配置する方法の詳細 。 css-live.ruコミュニティによる記事「 Deep Dive into Grid Layout Placement」の翻訳
• もう一度CSS浮動小数点について 。 css-live.ruコミュニティによる記事「 CSSを使用したフロートラベル パターンの再訪」の翻訳
• SVGマスク
• スクロールスナップポイントを使用したスマートスクロール
• background-clipプロパティに関する詳細な記事と例 （ `background-clip`プロパティとその使用例）
• CSS変数：なぜこれについて考える必要があるのですか？ （CSS変数：なぜ気にする必要があるのですか？）
• 最新のclearfixバージョンのリブート （最新のclearfixがリロードされました）
• Sass：コードの維持に役立つディレクトリ構造
• CSS3 Flexboxを使用した非常にレスポンシブなスプレッドシート 。 CSS3 Flexboxを使用した本当にレスポンシブなテーブル
• スクロール可能領域の使いやすさの改善に関する短いメモ
• フレックスボックスとキーボードナビゲーションの切断
• Flexboxによる星評価
• Foundation 6：The New Flex Grid （Foundation 6：The New Flex Grid）
• BigCommerceで「CSS」を使用する方法（ BigCommerceで「CSS」を使用する方法）
• trivagoでの大規模なCSSリファクタリング（trivagoでの大規模なCSSリファクタリング ）
• フォントを制御します：Google Fonts + Chrome =問題？ （タイプの制御：Googleフォント+ Chrome =トラブル？）
• TestMyCSS -CSSを分析するためのオンラインツール

Javascript

• Node.jsが公式に承認したChakra
• ES6：
  
  • ES6：内部からのシンボル （詳細なES6シンボルの翻訳記事）
  • ES6 Arrow Functions：JavaScriptの新しいファット＆簡潔な構文
  • ES2015プロキシの紹介（ ES2015プロキシの紹介）
  • 2016年のEs2015トレーリングコスト （コンパイルされたes2015のオーバーヘッドコストの調査）
  • ESの提案： 非同期関数 、 Object.getOwnPropertyDescriptors（）
  
  
• フレームワーク
  
  • Angular 2とAureliaを並べて比較
  • MVCフレームワークを使用しなくなった理由（ MVCフレームワークを使用しなくなった理由）
  • 反応：
    
    • canvas要素でのReactの使用について
    • すべての開発者がReactを学ぶべき10の理由）
    • Reactjs Sasha Aickin トーク-サーバー側レンダリングの高速化
    • Reactによる生産的開発 （ Reactによるパフォーマンスエンジニアリング（部1））
    • React Universal Blogアプリの構築：Fluxの実装
    • React入門：Hello Worldデモの作成
    • Reactアプリケーション開発を学習するための5つのステップ（Reactアプリケーション開発を学習するための5つのステップ）
    • react-designer-構成が簡単で、簡単で編集可能なベクターグラフィックスをreactコンポーネントで使用
    
    
  • 角度：
    
    • Angular 1.5.0リリース
    • KarmaとJasmineを使用したAngularJSコントローラーの単体テスト
    • Angular を使用したマルチプレイヤーゲームの作成 （Angular を使用したマルチプレイヤーゲームの構築）
    • Angular 2コンポーネント：入力と出力
    • Angular 1.x ng-repeatからAngular 2 NgFor with Componentまで）
    • Angular 2コンポーネントおよびプロバイダー：クラス、ファクトリー、および値）
    
    
  • Meteorがスタートアップに理想的な5つの理由
  
  
• 新世代の再利用可能なJavaScriptモジュールをECMAScript 6で作成します （ ECMAScript 6で次世代の再利用可能なJavaScriptモジュールを作成 ）
• HTMLパズルの JavaScript AI（HTMLスライドタイルパズルのJavaScript AI）
• 例によるJavaScriptの学習 （ 例による JavaScript）
• Javascriptを修正する方法...多分）
• JavaScriptで防弾関数ラッパーを作成する方法
• 2016年にJSに期待すること-ブラウザー外 （2016年にJavaScriptに期待すること-ブラウザーを超えて）
• JavaScriptの非同期待機を理解する（ JavaScriptの非同期待機を理解する）
• MediaRecorderでオーディオとビデオを記録 （ MediaRecorderでオーディオとビデオを記録）
• JavaScriptのレベルアップ
• プラグイン
  
  • jQuery Select Boxコンポーネント-選択済みvs Select2 （jQuery Select Boxコンポーネント-選択済みvs Select2）
  • samsaraJS-アニメーション化されたインタラクティブインターフェイスを作成するためのライブラリ
  • Gridifier-並べ替え機能を備えた適応グリッド
  • Instadate-高性能の日付ライブラリ
  • Multi-Screen.jsは、ページをさまざまな方向のアニメーションナビゲーションの複数の画面に変換するシンプルなjQueryプラグインです。
  • Whitestorm- Three.jsテクノロジーに基づくWebGLエンジン（物理学およびポストエフェクトを含むThree.jsテクノロジーに基づくWhitestorm Modern WebGLエンジンの紹介）
  
  

ブラウザ

• 2016年の開発者向けMicrosoft Edge：ES2016モジュール、フェッチAPI、Web通知、ビーコンAPI、WOFF 2.0、高解像度時間レベル2など
• Microsoft Edgeの拡張機能はインサイダーがまもなく利用可能になり、Windowsストアを通じて配布されます。
• Firefox Developer Edition 46：メモリツール、 メディアサイドバーなど
• Firefox 45-betaおよびFirefox Developer Edition 46のテスト
• Firefoxがリリーススケジュールのフローティングに移行
• GoogleはマテリアルデザインのスタイルでChromeをリリースする予定です
• Chrome 49でのスムーズなスクロール
• Chrome 49ベータ版：カスタムCSSプロパティ、サービスワーカーとのバックグラウンド同期、および新しいES2015機能
• Chrome 49でのAPIの廃止と削除
• Googleは不正なプログラムダウンロードボタンでサイトをブロックし始めます
• Opera 35リリース
• ブラウザの動向2016年2月：モバイル市場の減少？ （ブラウザの動向2016年2月：モバイル市場の衰退？）

設計

• 新しいインターフェースはインターフェースの欠如です
• フードデザインダイジェスト、2016年1月
• コンテンツ戦略の完全な初心者向けガイド
• グラフィックエディター：
  
  • Photoshop、UI / UXデザイナー向けのスケッチツールキット：インターフェイスデザインに選択すべきもの
  • スケッチチュートリアルシリーズ（5/4）：タブレットとモバイルの設計
  • スケッチチュートリアルシリーズ（パート5/5）：開発者へのデザインの転送
  • Git-sketchプラグイン。 これは、Sketchに直接組み込まれたGitクライアントです。
  • SketchのiOSアプリ設計に関する詳細なチュートリアル：パート1/3
  • PhotoshopからSketchへの切り替え
  • チームをSketchに移行する方法
  • 便利なスケッチのヒント（5つの非常に特別な、10の便利なスケッチのヒント）
  • InVision LABS Craft Plugin in Sketchを使用した動的コンテンツデザイン （Holy Sh！T〜Sketch in InVision LABSによるCraftによるデザイン）
  
  
• Uberは新しいロゴと新しいアプリケーションアイコンを導入しました
• 「私たちは私たちが誰であるかを理解します」：Uberブランディングの作成方法
• 社内で行われたUberの新しいロゴとIDYour Identity is Arriving）
• バドワイザーの再設計の背後にあるものは何ですか？ （バドワイザーの新しい外観の背後には何がありますか？）
• 微小相互作用：悪魔は細部に宿る
• 見出しを次のレベルに引き上げるクールなタイポグラフィ （タイトルを次のレベルに引き上げる素晴らしいタイポグラフィ）
• Dream Crewの設計方法（Dream Crewの設計方法）
• UIアニメーションの設計方法 （ユーザーインターフェイスアニメーションの設計方法）
• Webで読書を再考する
• デザイナー向けパーソナルブランディングガイド
• さまざまなモバイルアプリケーションでユーザーを引き付けることでインスピレーションを得るためのビデオギャラリー（モバイルオンボーディングデザインインスピレーションのためのビデオギャラリー）
• アルバムオブザイヤー （ALBUM COLORS OF THE YEAR）
• freelancigへのラブレター
• すべての広告ユニットサイズ （究極のソーシャルおよびデジタル広告サイズガイド！）
• 国際アーティスト：ロシア （国際アーティスト特集：ロシア）
• デジタル遊牧民が私を非常にやる気のあるデザイナーに変えた方法
• デザインの工業化（またはシリコンバレーがUXデザイナーを必要としなくなった理由）
• 一貫した設計の価値
• アプリのUX設計のヒント、パート2
• 60秒でのIllustrator ：カラースウォッチの作成およびエクスポート方法：カラーセットの作成およびエクスポートに60秒
• ペンツールとライブトレース： 詳細な比較 （ペンツールとライブトレース：大きな比較）
• これは最高の保存アイコンですか？ （これは完璧な保存アイコンですか？）
• サンフランシスコに到着（ サンフランシスコに到着）

無料のデザイナーCookieのセレクション

• バレンタインベクトルセット
• 無料のUIキット
• Craft-SketchおよびPhotoshopのプラグイン （Craft-実際のデータを活用したSketchおよびPhotoshopのUIデザインプラグイン）
• 未来的なインターフェイス要素で設定された Photoshopブラシ（これまでに作成された25の最高の技術インターフェイスPhotoshopブラシ）
• 無料のグラフィックとフォントを含むHellena Scriptフォントセット （無料ダウンロード：バレンタインデーの落書き、グラフィック、ブラシスクリプトフォント）
• デザイナー向けの最高の水ベースのブラシ （ デザイナー向けトップ無料Photoshop水彩ブラシ）
• クールなテキスト効果を備えた最高のスマートPSD （簡単なテキスト効果を作成できる30の無料のスマートPSD）
• SVG形式のフードアイコン （[景品]フードアイコン）
• バレンタインデーのアイコンのパッキング （無料のバレンタインデーアイコンパック+その他の素敵なリソース）
• AI形式のロゴ（プロジェクト用の無料ロゴデザイン、毎週火曜日に追加）
• Pacha-装飾フォント （Pachaはラテンアメリカの古代文化に触発された素朴でエスニックなデザインのディスプレイ書体です。）
• Fibon Sans-Thin Sans Serifフォント （Fibon Sans-通常のウェイトフリー）
• 15個の美しく不完全なフリーブラシフォント

ニュース

• アルファベットは現在、世界で最も高価な公開会社です
• Visaは、サードパーティの開発者向けにテクノロジーAPIを公開しました
• Yandexは、「非モバイル」サイトの発行を減らし始めます
• Odnoklassnikiには送金機能があります
• Facebookは6つのハンドシェイクの理論をテストしました（実際には3つ半あります）
• VKontakte新記録：1日あたり50億メッセージ
• Facebookには2030年までに50億人のユーザーがいます
• FacebookがParse開発者向けのクラウドサービスを1年で閉鎖
• Googleはレビューと製品のマイクロマークアップのJSON-LDサポートを拡張します
• Googleは2016年にマイクロマーキングのサポートを拡大します
• Google：HTMLの妥当性はランキング要因ではありません
• Mozillaは、スマートフォン用のFirefox OSを殺し、「モノのインターネット」に注力しています
• LinkedInの値は、2016年の負の予測の後、100億ドル減少しました
• Windows 10はWindows 8.1およびXPよりも優れていた
• BlackBerryはAndroidを支持して独自のOSを放棄します

おもしろい

• ドメインネームシステム -簡単な言葉で説明される複雑な技術
• Gmailは10億のユーザーマークを破る7番目のGoogleサービスです
• 最高の従業員をインタビューして選択する方法は？
• フレキシラミカ-プリント基板用の新素材
• 中国は月面着陸後にカラー写真を投稿しました
• 今日のビデオ：拡張現実ヘルメットMicrosoft HoloLensの機能の印象的なデモンストレーション
• なぜブロックチェーンは状態を破壊できるが、それはできないのか
• ブラウザマーケティング：プッシュ通知とは何か、そしてそれらから利益を得る方法
• Google Earthマップで最も奇妙なオブジェクト
• スラックになる：グリッチの息子の物語
• 私の浴室の鏡はあなたよりも賢い
• nest - 100.com -Webの異常な視聴覚体験

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

先週のダイジェスト 。
dersmollとalekskorovinが作成した資料。