Webデザイナーおよび開発者向けの新鮮なリソース(2018年8月)
ここ数カ月の間にたくさんの新しいツールがリリースされたので、開発コミュニティは最近もっと活発になっているようです。連載のこの回では、言及に値するツールをいくつか紹介します。.
ツールのリストの中には、 ダミーデータを生成するJavaScriptライブラリ、ローカルネットワーク内でファイルを共有するためのツール, また、ターミナルセッションをSVGアニメーションに記録できるようにするものもあります。かっこいいね?以下の全リストをチェックしましょう.
Pushbar.js
スライド式の引き出しを作成するためのJavaScriptライブラリです。通常、スライドドロワーはサイトメニューのナビゲーションを表示するために使用されますが、このライブラリを使用してサイトに適したものを表示できます。 Pushbar.jsは 完全にカスタマイズ可能で依存関係がない、jQueryは不要.

Carbon Now CLI
Carbon CLIはNode.jsパッケージです。 コードスクリーンショットを生成する コマンドラインインターフェイスを通して美しく。このツールはcarbon.now.shからヒントを得たもので、ブラウザ上の素晴らしいGUIを通して同じことができます。.

Faker.js
JavaScriptライブラリ ダミーデータを作成する. 名前、住所、会社名、電話番号、日付など、大量のデータの生成をサポートします。これらすべてのデータは非常に役立ちます。 Webアプリケーションをテストする.

TermToSVG
TermToSVGは Linuxターミナルレコーダー それはあなたのコマンドラインセッションをSVGアニメーションにレンダリングします。チュートリアルを書くための開発者にとって便利なツールです。.

データベースバックアップマネージャ
これはPHPライブラリで、その名前が示すように、一連の機能を提供します。 データベースのバックアップと復元を処理する. このライブラリは、Dropbox、Amazon S3、FTP、SFTP、Rackloud Cloudなど、バックアップを送受信するためのさまざまなサービスをサポートしています。.

反応ビット
React.jsのテクニック、ヒント、コツを集めたReact Bitsは、一般的なデザインパターン、スタイル、パフォーマンスに関するヒントを網羅しています。これは本当に あなたのReact.jsスキルをレベルアップするための素晴らしいリソース.

DSSの言語
DSSは、新しいCSSオーサリングツールであるDeterministic StyleSheetsの略です。それはどのように機能し、これはどのように私の日々の仕事に適用することができますか?私は正直なところこれまで見当がつかない。しかし、それはクールに見え、それは新しいので、それはリストに載っています。ありがとうございました!

PurgeCSS
PurgeCSSはNPMパッケージです。 CSS出力を最適化する 使用していないものを削除して、Webアプリケーションに追加します。このツールには、Gulp、Grunt、Grunt、Webpack、PostCSSなど、さまざまな組み込みツールのサポートが含まれています。 プロジェクトに統合する 直ちに.

RFS
RFSはResponsive Font Sizeの略で、Web上で最も難しいことの1つに取り組むための興味深いプロジェクトです。 フォントサイズをレスポンシブにする, サイズがデバイスのビューポートサイズにうまく従うように。 RFSはNPMとして利用可能です

SimpleBar
カスタムスクロールバーを作成するためのJavaScriptライブラリ、SimpleBarを使用すると、スクロールのスタイルを変更できます。 他のHTML要素と同じようにCSSを使用してサイトのスタイルを一致させる サイトに。プラットフォームとブラウザの制限により、ブラウザのスクロールバーのスタイル設定は複雑でしたが、SimpleBarは本当にシンプルにしました。.

ララスタン
ララスタンはのラッパーです。 Laravel用PHPStan. PHPStanは単体テストを書く必要なしにあなたが潜在的なエラーのためにあなたのコードをチェックすることを可能にするツールです。呼び出されたメソッドや関数の存在、プロパティに割り当てられた型、Classコンストラクタに割り当てられた数と型、phpDocsの検証など、さまざまなことをチェックします。.

PWMメトリック
PWMetricsは、Paul Irishによって開発されたコマンドラインインターフェイスを介してProgressive Web Appsのメトリックを収集するツールです。このツールはLighthouseを搭載しており、NPMパッケージとして入手可能です。それはにたくさんのオプションを提供します メトリクス、テストパフォーマンスを設定する, そしてあなたがテスト外で達成したいと思うこと.

パックス
PaxはJavaScriptのバンドル担当者です。 JavaScriptモジュールをブラウザで使用可能なファイルにコンパイルする. パックスはスピードを約束します。それはいくつかの他のバンドラーより速くコンパイルします。 ES6に完全対応 インポート
そして 輸出する
構文とCommonJSシンタックス インポート
. 違います pax
Rustで書かれていて、Cargoと呼ばれるRustパッケージレジストリを通して利用可能です.

SustyWP
SustyWPは より良い原因を目指したWordPressテーマ;そのサイズを可能な限り小さくすることによってカーボンフットプリントを減らすこと。ブラウザにロードされたときそれはわずか7〜6キロバイトの重量です。それは 速くて軽い, その見返りに、それはサイトに負荷をかけるためにより少ない資源(例えば電気)を消費する。この記事でJack Lenoxによるテーマの裏話をチェックしてください.

落書き図書館
A 落書き図面のコレクション, 落書き図書館はコレクションにたくさんのドローイングを持っていて、それらはいくつかのカテゴリーに分類されています顔、場所、動物など. 図面はSVG形式で利用可能です そしてCreative Common Attributions 4.0の下で配布されています

Tilt.js
へのjQueryプラグイン 空想を作成 傾ける 効果 我々がApple TVで見るそれらのプレビューサムネイルに似ています。追加のCSSは必要ありません。彼らはまたこのページで実装のいくつかのサンプルを提供するので、それを使うことは非常に簡単です。あなたを確認してください グレア効果をチェックする;本当にかっこいい.

ファイルルーム
FileroomはのためのWebアプリケーションです。 同じネットワーク内でのピアツーピアファイル共有. OSに関係なく、ドラッグアンドドロップでファイルを同僚と簡単に共有できます。 Windows、macOS、Linuxで動作します.

かっこいい
Coolhueを使用すると、PhotoshopやSketchアプリのカラーパレット見本を簡単に選択できます。 プロジェクトにインストールする 使う ower
または 午後
. これはあなたの今後のウェブサイトの色を拾うためにあなたに時間を節約するはずです.

リーフ
UIを作成するための単純なJavaScriptライブラリであるReefは、React.jsやVue.jsのようなより大きなライブラリからのすべての鐘と笛を持っているわけではありません。しかし必要なのは データ入力だけでUIをレンダリングする そしてテンプレートReefは素晴らしい代替手段になるでしょう。それはちょうど2キロバイトの重さです

常緑樹
Segment.ioからのUIコンポーネントのコレクション。コンポーネントはかなり多様です。ボタン、アイコン、テキスト入力のようないくつかの通常のコンポーネントの他に、トースター、サイドシート、そしてコーナーダイアログのような私が常緑樹に特有であると思う少数があります.
