Web開発とITの世界からの興味深い資料のダイジェスト、先週第183号（2015年10月26日-11月1日）

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

ウェブ開発

CSS

Javascript

設計

ニュース

おもしろい

ウェブ開発

• フロントエンドルーチンとの闘いを続けます
• <input>私はあなたを愛していますが、あなたは私を打ち破ります
• KeePassのWebバージョンの作成方法
• Mimic-類似の文字を置き換えて、デバッグを悪夢にするユーティリティ
• SDCastポッドキャスト＃31 ：アウェイマイクロソフトの戦略的技術のエキスパート、コンスタンティンキチンスキー
• 今週の週末にミンスクで開催されたWeb Standards Daysカンファレンスのビデオ： 1日目 、 2日目
• デバッグの技術
• アプリをより効率的に設計および構築するための13のヒント
• 画像を操作する：
  
  • BPGがGIFなどを置き換える理由 （BPGがGIFを置き換えるのはなぜですか？）
  • 今日のWebP画像の使用ガイド：ケーススタディ
  • srcsetを使用してレスポンシブイメージを構築する方法
  
  
• 壮大なウェブ：
  
  • CSS / SVG / JS＃10の美しいエフェクトの毎週の編集
  • カードスタックアニメーションの効果的なアイデア
  • Webサイトページの紹介セクションのアニメーション（アニメーション紹介セクション）
  • FCC Zipline：JS Calculator ：素晴らしいフォールアウトスタイルのJS計算機
  
  
• SVG：
  
  • SVGパスビルダー
  • 複雑なSVGアニメーションの作成（複雑なSVGアニメーションの設計）
  • SVGテキストを操作する方法（SVGテキストを操作する方法）
  
  
• FirebugとDevToolsの統合
• 古いプログラマが覚えておくべき5つのこと
• コメントアウトされたコードをコミットしないでください
• Googleフォントを最大限に活用するための4つのエキスパートヒント
• サイトのパフォーマンスを向上させるためのヒント
• HTML5で測定値を記録するための正しくマークアップ （ HTML5で測定値を正しくマークアップする ）
• ハロウィーンで怖い開発者恐怖の12

CSS

• スペースについて
• 猫と一緒に写真で説明されているCSSセレクター
• CSSを書くときに避けるべきこと（CSSを書くときに避けるべきこと）
• z-indexの仕組み （z-indexの仕組み）
• Webタイプの状態
• 少ない：最も誤解されているCSS プリプロセッサ （以下：世界で最も誤解されているCSS プリプロセッサ ）
• 実用的なCSS視差
• CSS Haiku
• Flexbox Mythsの破壊（Flexbox Myth Busting）
• Flexboxをビデオプレーヤーに適用する（Flexboxをビデオプレーヤーに適用する）
• サイトの背景としてカスタムジオメトリを使用して効果的なブロックを作成する方法に関する記事 （Background Image Shapes）
• Google Totally Toolingのヒントがリリースされました： クリティカルパスCSS（S2ミニヒント＃1）
• 「エキスパート」がお気に入りのCSSトリックを共有します （エキスパートの計量：お気に入りのCSSトリックは何ですか？）
• 15分でブートストラップグリッドを探索する
• 素晴らしいCSSのみのアコーディオンを作成する4つの方法
• PostCSS：
  
  • PostCSSクイックスタートガイド：Gruntの構成
  • BEMおよびSUIT方法論で PostCSSを使用する（ BEMおよびSUIT方法論で PostCSSを使用する）
  • PostCSSとSass、スタイラス、またはLESSの併用（PostCSSとSass、スタイラス、またはLESSの併用）
  • PostCSS Time Machine -CSSの作成中に行われ、CSSWGによって記述された間違いを修正するのに役立ちます。
  • mdcss -CSSおよびMarkdownのコメントを使用してスタイルガイドを作成および管理できるPostCSSのプラグイン
  
  
• JSのCSS：
  
  • BackstopJS -CSS回帰テスト
  • JSのCSS：それはトラップです！ （CSS In JS：それはrapだ！）
  • JavaScriptでReactコンポーネントをスタイルするべきではない理由
  
  

Javascript

• 約束には問題があります。
• 新しいリリース：
  
  • Node.js 5.0サーバー側JavaScriptプラットフォームリリース
  • Babel 6.0.0リリース
  • Babel 5.x-> 6.xのクイックアップデートのヒント
  
  
• ES6：
  
  • ES6の微妙さ：継承（部1）
  • ES2016からの非同期関数の実装による非同期JavaScriptコードの簡素化
  • ES6の詳細：再構築
  • ECMAScript 6（ES6）：JavaScriptの新バージョンの新機能 （ECMAScript 6（ES6）：JavaScriptの次のバージョンの新機能）
  • クイズ：ES6でオブジェクト指向JSを理解していますか？
  
  
• Pigeonは、Javascriptで記述されたHTMLプリプロセッサです。
• SpotifyデスクトップアプリでJavaScriptはどのように使用されますか？ （Spotifyデスクトップアプリケーション内でJavascriptはどのように使用されますか？）
• ソースマップを使用した実稼働環境でのデバッグ可能なJavaScript）実稼働環境でのJavaScriptのデバッグ
• ServiceWorkerとプログレッシブネットワーキング
• Service Workerでサンドボックス化されたHTTPリクエストをキャッシュする
• W3CプッシュAPIでプッシュを続ける
• JavaScriptを使用して選択したテキストを読み取り、クリップボードにコピーする
• JSの関数型プログラミングの概念の紹介 （JavaScriptの関数型プログラミングの概念の紹介）
• JavaScriptビルドツールの選択-Babel、Browserify、Webpack、Grunt、Gulp
• ツイートに収まるJSモジュールマネージャー （ ツイートに収まる JavaScriptモジュールマネージャー）
• フレームワーク
  
  • 0から1まで。Reduxについて
  • React v0.14.1のチートシート
  • ReactRally YouTubeチャンネル
  • ngUpgradeを使用したアプリのAngular 2へのアップグレード（ngUpgradeを使用したアプリのAngular 2へのアップグレード）
  • ngclipboard -clipboard.jsのディレクティブ（clipboard.jsのAngularjsディレクティブ）
  
  
• 教訓：
  
  • レッスン：React with Webpackの使用（React Using Webpackチュートリアル）
  • Three.jsを使用した簡単なデモの作成 （ Three.jsを使用した基本的なデモの構築）
  • Node-WebkitとAngularJSを使用してタブ付きブラウザーを作成する
  • Instagram APIを使用したリアルタイム写真更新アプリの作成 （ Instagram APIを使用したリアルタイム写真更新アプリの構築）
  • 独自のGruntプラグインの作成と公開
  • Emscripten入門：C / C ++からJavaScript / HTML5への変換 （Emscripten入門：C / C ++からJavaScript / HTML5への変換）
  • jQuery、JSON、およびDataTablesを使用したSCRUDシステムの作成（jQuery、JSON、およびDataTablesを使用したSCRUDシステムの作成）
  
  
• プラグイン
  
  • Protip-ほとんどすべての状況に対応する別のjQueryツールチッププラグイン！）
  • クイル -リッチテキストエディター（IE9 +）
  • canvid.js -HTML5キャンバス要素でビデオを再生するためのライブラリ（キャンバス要素でビデオを再生するための小さなライブラリ）
  • セグメント -SVGパスストロークのレンダリングとアニメーション化のための小さなJS（依存関係なし）
  
  

興味深いデザインと機能を備えたサイト

• 日本製サイト
• 水平レイアウトの22の近代的なサイト
• カスタムナビゲーションを備えた25のサイト
• モダンなウェブサイトのデザインの例（モダンなデザインのウェブサイトショーケース-39の例）
• ginventory.co-クールなスクロール効果のあるサイト
• frightgeist.withgoogle.com-一連のGoogle実験のマルチメディアサイト
• georgeleonardo.com-きれいなページ遷移とプリロード効果のあるサイト
• deuxhuithuit.com-デザインのサイトカスタムエフェクト
• ボンドインタラクティブフリート
• whatisburningman.org-菱形のサイト
• jwt.amsterdam-背景動画付きの質の高いプロモーションウェブサイト
• andreo.li-視差とスクロールアニメーションを備えたサイト
• merixstudio.com/frontend-バックトゥザフューチャースタイルのインタラクティブマルチメディアサイト

設計

• デザイナートレロ。 自動化を使用したアイコンの問題の解決方法
• 毎日のデザイン：便利な薬用スプーン
• エキサイティングなパッケージデザインイラスト。
• 3億ボタン（$ 3億ボタン）
• 現在と未来のための12のモバイルWebデザインのヒント
• デスクトップサイトをモバイルに変換するための基本的なヒント
• 2種類の人々 （2種類の人々）の視覚化
• 優れたユーザーエクスペリエンスを生み出すものは何ですか？ （優れたユーザーエクスペリエンスとは何ですか？）
• 読むべきUIデザインブック
• 本棚には何がありますか？ パート2 （本棚には何がありますか？パート2）
• ビデオ：ロゴデザイン- 忘れてはならない経験則（ウォッチ： 忘れてはならないロゴデザインルール）
• フォワードスラッシュ：MassimoGuzmánがシンプルなロゴをチャンスのブランドに変えた経緯）
• 使用中のフォント - フォントの使用例と写真のコレクション
• インタラクションデザインの完全な初心者向けガイド
• 日常生活における5つの方法UXマター（日常生活における5つの方法UXマター）
• 回避すべき10のモバイルUX悪夢（回避すべき10のモバイルUX悪夢）
• ライターとの連携：デザイナーが知っておくべきこと
• 再設計：
  
  • Studioは新しいブランドNetflixを示しました
  • Goodreadsの親愛的なデザインアプローチ
  • Netflixブランディング （Netflixブランディング）
  • ニューヨーク市地下鉄マップの再設計
  
  
• グラフィックエディター：
  
  • スケッチソースをZeplinにエクスポートする
  • SketchとAtomic.ioを使用してエレガントな（ただしシンプルな）アニメーションを作成します
  • Adobe Illustratorのエラー：鉛筆ツールのプレビューが消える
  • Photoshopをストーリーテリングに使用できますか？ （Photoshopを使用してストーリーを伝えることはできますか？）
  • 新機能の視覚化Sketch 3.4 （Sketch 3.4の新機能の視覚化）
  • 15のトップスケッチプラグイン
  
  
• インタビュー
  
  • Google UXデザイナーの仕組み
  • デザイナーJean-Marc Denis（Google、Inbox、Gmail、およびSparrow）へのインタビュー （AMA：Jean-Marc Denis）
  
  
• 教訓：
  
  • Adobe Illustratorで西の邪悪な魔女を作成する
  • Adobe Illustratorでビンテージの活版印刷のイラストポスターを作成する方法
  • ドットをつなぐ：Basecampのロゴに笑顔を付ける方法）
  • CarenZorgt Webサイトの設計プロセス
  
  

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

• SEO |ベクトルイラストSEO
• あなたのデザインのスタイリッシュなフレーム。
• 最高のレタッチ操作（写真レタッチ作業のためにダウンロードするPhotoshopのトップ80アクション）
• SmartyBundles Cookieパッケージ （無料ダウンロード：SmartyBundlesのデザインバンドル）
• Tシャツデザインモックアップ（15の無料の高解像度Tシャツモックアップテンプレート）
• AlienValley Cookieセット （ AlienValleyの景品バンドル）
• 厳選されたマイクロアイコン（PSD） （200個の手作りの無料マイクロアイコン（PSD））
• クレアティコン-食べ物や飲み物のベクトルアイコン（AI、EPS、SVG、PNG） （クレアティコン無料-フード＆飲料のベクトルアイコン（AI、EPS、SVG、PNG））
• 人気ブランドのSVGアイコン（無料ダウンロード：人気ブランドの134 SVGアイコン）
• モバイルおよびWebアプリケーション用の天気アイコンのセット （景品： モバイルおよびWeb用天気アプリアイコンセット）
• bitIcon-一般的なプログラミング言語とテクノロジーのロゴが付いたアイコンフォント
• 2015年秋の百を超える最高のフォント （101最高の無料フォント、2015年秋）

ニュース

• Opera 33ブラウザリリース
• EU、ネットワーク中立性とモバイルローミングを放棄
• 2015年のEスポーツ現金売上高は7億4,700万ドルに増加
• 1億2000万台のデバイスにインストールされたWindows 10、計画-10億
• MicrosoftはWindows 10の配布条件を変更しました
• Twitterのオーガニック検索トラフィックは、Googleとの取引後に20％増加
• Twitterの株式は2015年第3四半期の財務報告で13％減少しました
• Chrome OSは2017年に廃止されます
• 2016年、GoogleはインドネシアでProject Loonをテストします
• 2015年の第3四半期のYandexの純利益は43億ルーブルに達しました。
• ビル・ゲイツが60歳に
• 記録的なコンピューター販売はAppleに年間最大の収益をもたらします

おもしろい

• 評価：平均給与が12万ドルを超える米国のIT企業26社
• MITの科学者がWi-Fiを使用して壁越しに見ることを学ぶ
• コグニティブコンピュータが私たちの未来を変える方法
• 10の意見：最初に学ぶプログラミング言語
• デジタルヒューマニズムのビッグデータ
• 小さい、はい 。 ほとんどが考えさえしない時代に世界を変えようとしている若い起業家の興味深い話。
• Megauploadの創設者であるKim Dotkomは、スマートフォンベースの代替インターネットプロジェクトについて語りました
• （ほぼ）Robocar：Tesla Motorsのオートパイロットアドベンチャー
• コードとは何ですか？ ジャーナリストおよびプログラマーのポール・フォードの「コードとは何か」の翻訳ブルームバーグビジネスウィークに掲載された記事
• おばあちゃんプログラミング 。 マーガレット・ハミルトンは現代のプログラミングの先駆者と見なされており、彼女が書いたコードのおかげで、アメリカ人は月に飛びました。
• 数学が人々の生活にどのように役立つか
• Pornhub、Google、Uber、Mail.ru Groupおよびその他のブランドがハロウ​​ィーンにどのように反応したか
• 別のインターネットまたは仮想世界の隠されたネットワーク
• 火星クレーターのバーチャルツアー
• 全員を無視 （ 全員を無視）
• NASAは、60年前にVoyagerと連携する言語でプログラミングするプログラマを探しています。

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

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