任意のURLを入力するだけでCSSを解析し、品質をチェックしてくれるオープンソースのWebアプリ・「CSS Code Quality」
CSS Code Qualityは任意のURLを入力するだけでCSSを解析し、品質をチェックしてくれるオープンソースのWebアプリです。JavaScriptで書かれています。 解析したいCSSを利用しているWebサイトのURLを入力すると自動で解析し、メンテナンス性、複雑さ、パフォーマンスの3項目をそれぞれスコアリングし、その内訳レポートを提出してくれます。 大きくスコアを下げる要因は赤、出来るだけ改善すべき要因はオレンジのラインが引かれます。レポートはその場に表示されますがJSONでも提供してくれます。直接CSSコードを貼り付けてチェックする事も可能です。 CSSの最適化や改善作業などを手助けしてくれそうですね。ライセンスはMIT。 CSS Code Quality
HTMLの属性にディレクティブを指定してリアクティブな動作を実装できるJavaScriptフレームワーク・「Alpine.js」
Alpine.jsはHTMLの属性にディレクティブを指定してリアクティブな動作を実装できるJavaScriptフレームワークです vue.jsやreact.jsといったフレームワークのリアクティブ且つ宣言的な性質を低コストで提供してくれる、というもの 開発者はTailwind.cssのJS版のようなもの、と説明しています Alpine.jsでは13のディレクティブと、5のマジックプロパティと呼ばれるものを使う事が出来ます。Vue.jsとほぼ同じ機能を使える、という認識で良いと思います <script src="https://cdn.jsdelivr.net/gh/alpinejs/alpine@v1.10.1/dist/alpine.js" defer></script>↑ まずはスクリプトを読みこみます 試しに何か作ってみましょう <div x-data="{selected:null
ソートや検索、ページネーション等、基本的な機能を備えた非依存のデータテーブルライブラリ・「Vanilla-DataTables」
Vanilla-DataTablesはバニラなデータテーブルJavaScriptライブラリです。他ライブラリに依存せず単体で動作します 機能もデータテーブル系でよくある基本的な機能を備えています。データのソート、任意のキーワードで検索、データが増えた時でも省スペースで収まるページネーション、インポート/エクスポート機能などなど また拡張性もあり、プラグインに対応していますので足りない機能を自分で作って加える事も出来るようになっています。ライセンスはMIT Vanilla-DataTables
大学の学生や教授が共同で作った3000以上の絵文字を公開するオープンソースのemojiプロジェクト・「OpenMoji」
OpenMojiは学生53人と2人の教授が共同で進めているオープンソースの絵文字プロジェクトです。現在3000以上ものSVGアイコンが本プロジェクトのスタイルガイドに従い、一貫したスタイルで作成、公開されており、いずれもUnicode Emoji v12に準拠した仕様だそうです。イラストライクでとても使いやすそうな印象でした。 各絵文字は標準的なケースはもちろん、人種による肌色の差異やLGBTを含む様々な家族への配慮、多くの職業などへの配慮がなされていて、その全てが人の手で作られており、何度もテストされ、作り直しを経て、公開に至っているそうでプロジェクトへ本気で取り組んでいるのが伝わります。 日本独自の文化も Emojiはご存知のようにもともと日本を発祥とし、いつしかAppleやGoogleが各製品でサポート、働きかけた事でグローバルな文化に代わっていきました。現在では一般的に利用できるよ
オープンソースのBootstrap4テーマビルダー・「bootstrap.build」
bootstrap.buildはBootstrap4のテーマビルダーです。OSSとしてソースも公開されています。コアの設定だけでなく、各コンポーネントの設計も可能で、コンポーネントごとに設定ページも分けられているので作りやすい印象です。Googleフォントやカラーピッカー、SASS等もサポート。この性能でOSSは凄いですね。ライセンスはMIT。 bootstrap.build ご挨拶。本年の更新は以上となります。見てくださった方、ありがとうございました。 少しご意見も頂き、今年中に多少改善できたかなと思います。 なかなか時間が取れず淡々と更新する日々ですが、来年もなんとか暇を見つけて改善していきたいと思います。 新年は4か5日あたりから再開いたします。2018年もどうぞよろしくお願いいたします。
コンポーネントやプラグインを豊富に同梱したBootstrap 4ベースのフリー管理画面テンプレート・「Pike Admin」
Pike Adminはコンポーネントやプラグインを豊富に同梱したBootstrap 4ベースの管理画面テンプレート。MITライセンスで商用でも無料で利用可能です。ルーマニアの開発者さんのようですね。管理画面に求められがちな各コンポーネントやレーティング、カレンダー、デイトピッカー等のプラグインライトボックスやカルーセル等も同梱されています。有償版ではCMSの統合など、更なるカスタマイズがビジネスモデルのようです。かなり良いものなんですが、ダウンロードにはユーザー登録が必要です。Gmailお使いの方は迷惑メールに入るとフィッシング防止の為、認証用のリンクが非表示となる可能性があるのでご注意ください。 Pike Admin
ロゴを手軽に作成、購入出来るジェネレーター・「Logopony」
Logoponyはオンラインでロゴを作成、購入できるジェネレーターです。太古の昔から見かけるサービスですが、このサービスに限っては、ロゴのデザインクオリティと金額が個人的に納得できるものだったので備忘録として。作り方は従来のものと変わりません。ブランド名とキャッチコピーを入力すれば自動でロゴが作成されますので、色やアイコン、フォントを調整、その後に配置やジャンプ率などを調整すれば完成です。あとは購入するかどうか、みたいな流れ。出来るロゴはいままで紹介された類似サービスよりも高品質なデザインながら、小さいサイズで19$、大きいサイズでも49$と、なかなか手頃なお値段でした。スタートアップでデザイナーさんに頼む予算がない、なんて方も少なくない時代なのでこの手のものに頼るのもありかなぁと思います。ちなみに本記事はアフィリエイトでも広告でもないです。念のため。 Logopony
デザイナー向けリソースをコレクションしたキュレーションサイト・「Sans Francisco」
Sans Franciscoはデザイナー向けのリソースを厳選、コレクションしたキュレーションサイトです。大量に公開されているリソースから自分が求めているものを探すだけでも苦労するので、探す手間を省けるよう、ある程度厳選してコレクションするキュレーションが有用だろうと考えて公開したそう。リソースはツールとライブラリに分けられています。こういった個人のキュレーションサイトを参考にしつつ、自分用を作るのが理想かもしれませんね。 Sans Francisco
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
よく使用されている汎用的なレイアウトとUIパターンのCSSコードをコレクションしている・「CSS Layout」
WebアプリとAPIのスピーディーな構築をサポートするシンプルなマイクロPHPフレームワーク・「Leaf PHP」
BootstrapベースのシンプルなUIのオープンソース管理画面テンプレート・「tabler」
使いやすそうな太線のSVGアイコンのセット・「Heroicons UI」
CSSで作られた複雑なアニメーションエフェクトのスピナー集・「Epic Spinners」
Bootstrapでのtableにソートやページネーション、検索機能等を付与するスクリプト・「jQuery Bootgrid」
ReactやReact Nativeを使って作られたWebアプリをコレクションしている・「Made with React」
ブラウザで動作する軽量なベクタードローツール・「Inker」
Markdownで更新する軽量でシンプルなPHP製のCMS・「Sphido」
Bootstrap 4ベースのすっきりしたデザインな管理画面向けテーマ・「Modular Admin」
Webアプリの為に設計されたシンプル軽量なCSSフレームワーク・「Vital」
スタイリッシュなBootstrap向け管理画面テンプレート・「Blur Admin」
