サーバ監視に超使える〜topコマンドのまとめ:phpspot開発日誌
サーバ監視に超使える〜topコマンドのまとめ サーバを運用しているとよく使うtopコマンドですが、標準のtop以外にも色々便利なものがあるのでまとめてみました。 ボトルネックといえば、ネットワーク、ディスクIO、スワップ、CPU、メモリといったものが関連しますが、ツールで視覚化することでより分かりやすい対策がとれますね。 htop こちらも、通常のtopよりもさらに多数の情報を表示してくれるツール。 CPUやメモリの状態が視覚的にグラフで表示されていたり、複数CPUがある場合もそれぞれに利用率を表示してくれてわかりやすいです。 pstreeで表示するようなツリー+topコマンドのような表示も t を押せば切り替えられます。 公式サイト上にある128コア積んだマシンのhtop結果が面白い。 次のようにすべてグラフで表示されているため、128コアあったとしても瞬時に負荷が把握できますね。 io
PHPベースの使いやすそうなAjaxファイルマネージャ「PGRFileManager」:phpspot開発日誌
PGRFileManager - Manage your files easily PHPベースの使いやすそうなAjaxファイルマネージャ「PGRFileManager」。 ブラウザ上から認証して、ファイルの追加、移動、リネーム、削除、フォルダの作成といった一連のファイル操作が可能。 画像だったらちゃんとサムネイル化してくれる上に、CKEditorによってその場で編集することも出来ます HTMLなんかはその場で編集できます。 なかなか便利そうですね。 関連エントリ まるで何かのOSに搭載されているようなブラウザベースの高機能ファイルマネージャ「elFinder」 PHP+MySQLで作成されたAjaxベースのWeb2.0ファイルマネージャ:Relay PHPとAjaxを使ったWEBベースのファイル管理ツール「PHP Navigator」
PHPで書かれた次世代のショッピングカートシステム「TomatoCart」:phpspot開発日誌
TomatoCart- New Generation Ecommerce PHPで書かれた次世代のショッピングカートシステム「TomatoCart」。 ショッピングカートといえばosCommerceが有名ですが、TomatoCartはosCommerceからブランチしてweb2.0的な仕組みを取り入れたり、ExtJSを導入したりしていて、なかなか便利そうです。 ショッピングカートを実装する必要にかられたときに１つの選択肢として覚えておいてよさそうです。 管理画面がすごくて、Windowsのデスクトップ風UIで超リッチで直感的に使えるものになっています。 アイコンごとに機能が分かれていて、クリックするとアプリケーションが立ち上がるイメージで機能を利用できます。 管理画面のアイコンで立ち上がるアプリケーションっぽいものはExtJSを使って作られていて、使いやすさもなかなかよさそう。 SEOフレ
PHP、Perl、Ruby、C、C++等40以上の言語をブラウザで実行できるようになるjQueryプラグイン「Run This」:phpspot開発日誌
PHP、Perl、Ruby、C、C++等40以上の言語をブラウザで実行できるようになるjQueryプラグイン「Run This」 2010年03月11日- Run This! PHP、Perl、Ruby、C、C++等40以上の言語をブラウザで実行できるようになるjQueryプラグイン「Run This」。 ブラウザ内の<pre>コードで記述した部分を、その場でそのまま動かすことができ、うまくサイトに組み込めばより訪問者にとってわかりやすいページを作ることが出来そうです。 例えば、PHPの入門サイトなんかでは挙動を一瞬で確認できてしまいます。 具体的には以下の言語に対応しています。 Ada, Assembler, AWK, Bash, bc, Brainf**k, C, C#, C++, CLIPS, Clojure, COBOL, Common Lisp, D, Erlang, Forth
ブラウザが落ちてもフォーム内容が消えないようにするjQueryプラグイン「jQuery autosave」:phpspot開発日誌
ブラウザが落ちてもフォーム内容が消えないようにするjQueryプラグイン「jQuery autosave」 2010年01月19日- rikrikrik.com - jQuery autosave plug-in ブラウザが落ちてもフォーム内容が消えないようにするjQueryプラグイン「jQuery autosave」。 データを編集中にフォームに書き込んでいて、ブログ記事などが消えたりするとても悲しい気持ちになりますが、このプラグインを使えばデータをブラウザのクッキーに保存してくれて、次にアクセスした時にリストアできるという素晴らしいプラグインです。 クッキー保存のため、サーバに保存する必要はないですし、手軽に使うことができそうです（ブラウザごとにクッキーに依存した文字数制限などは存在すると思います） こういうことを１からやろうとすると結構大変ですが、毎度のことながら、jQueryプラグ
ブラウザ上でC#やPHP5を動かせて遊んで学べる「CodeRun」:phpspot開発日誌
ブラウザ上でC#やPHP5を動かせて遊んで学べる「CodeRun」が凄いです。 最初アプリケーションかなと思ったのですが、全てブラウザ上で動作するので、学習用やちょっとした動作確認に使えます。 ブラウザ上でコーディング 次のように、IDEアプリケーションのようなUIで、C#やPHP5.1を、ブラウザの上で動かすことが出来ます。 プロジェクト作成 New → Project を選ぶと、C#やJavaScript、PHPの色々なプロジェクトが作れることがわかります。 PHPのHellow World のソースが入ったコードがエディタに表示されました。このソースをいじって直接動かせます。 コードを動作テスト 次のようなコードを書いて「Run」ボタンを押してみます。 以下、出力例です。ちゃんと動きました。 c2d6c077f524683db2f00c0e975766810 1 2 3 4 5 6
JavaScriptコーディングに関するテクニックやパフォーマンス等のリファレンス集:phpspot開発日誌
最近発見した、JavaScriptコーディングに関するテクニックやパフォーマンス等の参考になりそうなエントリをリファレンスをまとめてみました。 Avoiding Problems With JavaScript’s getElementById Method in Internet Explorer 7 | Impressive Webs IE7のgetElementByIdで起こる問題を避けるためのTIPS集。 How to add a CSS Link programmatically using JavaScript <link>タグをJavaScriptによって動的に作成してCSSを動的に設定するコード例 JavaScript CSS Selector Benchmarks CSSセレクタでDOMにアクセスする際の各フレームワークでの速度ベンチマーク比較 6 Ways To Wor
JavaScriptによって動的にアンチエイリアス化＆選択してコピーも可能な仕組み「TypeSelect」:phpspot開発日誌
JavaScriptによって動的にアンチエイリアス化＆選択してコピーも可能な仕組み「TypeSelect」 2009年07月13日- TypeSelect - Javascript-based Selectable Typefaces JavaScriptによって動的にアンチエイリアス化＆選択してコピーも可能な仕組み「TypeSelect」のご紹介。 以前、JavaScript を使い、Canvasを使ってアンチエイリアスがかかった綺麗な文字にする typeface.js という仕組み紹介しました。 これにより、文字は簡単に綺麗になったのですが、テキストのコピーペーストが出来ないという問題がありました。 選択してコピーしても文字にはならない。 TypeSelect なら、１文字ごとに選択することが可能で、コピーすることも出来ます。 綺麗にレンダリングされた文字を選択している図 内部的にはt
iPhoneスタイルのチェックボックスをjQueryで簡単実装:phpspot開発日誌
Introducing iPhone-style Checkboxes iPhoneスタイルのチェックボックスをjQueryで簡単実装。 次のようなiPhoneに使われているようなUIのチェックボックスを実装するライブラリが公開されています。 使い方は次のように、$(エレメント).iphoneStyle() という風に初期化するだけという簡単さです。 <script type="text/javascript" charset="utf-8"> $(document).ready(function() { $(':checkbox').iphoneStyle(); }); </script> 微妙にアニメーションする部分も芸が細かくていいです。 関連エントリ iPhone/iPodTouch風のON・OFFスイッチをJavaScriptで作成しよう iPhoneのロック解除の際のあのUIを
WEBアプリ開発に便利な機能＆負荷テストツール集:phpspot開発日誌
15 Free Functionality And Load Testing Tools For Web Applications WEBアプリ開発に便利な機能＆負荷テストツール集。 プログラム変更後の品質チェックを行える機能テスト・ユニットテスト、負荷に耐えられるか確認するために負荷テストツール、で品質向上に役立てられます。 Selenium等の定番以外にも沢山の機能テストツールや負荷テストツールがあるみたいです。 機能テストツール集 Seleniumのようなブラウザを自動で直接動作させて表示結果を確認するツール うまく運用すれば、機能を変更した際の正常動作確認に神経をすり減らすことがなくなります SeleniumHQ おなじみのテスト自動化ツール テストケース定義で自動でブラウザ上でテストしてくれます Watir Rubyのブラウザ自動化ライブラリだそう。 Windowsだと、IE、F
クールな名刺を作る際のチュートリアル集:phpspot開発日誌
11 Tutorials for Business Card Design | Vandelay Design Blog クールな名刺を作る際のチュートリアル集が公開。 かなり奇抜なデザインが多く、デザイナーの方なんかが持っておくとデザインのスキルをアピールを出来るだけでなく、覚えてもらえそうな名刺を作れそう。 Design a Print Ready Business Card for Designers Making a Grungy Business Card Making a Print-Ready Business Card Using Only Photoshop 全部見る 最近は家庭用プリンタでもきちんとした印刷が出来るのでありがたいですね。 関連エントリ 凄くクールな名刺を作成するPhotoShopチュートリアル
ますますクールになったJavaScript用UIライブラリ「Ext3」:phpspot開発日誌
Designer.2 ますますクールになったJavaScript用UIライブラリ「Ext3」。 次のように、ますます美しくなったデザインのExt3が2009年を目処にリリースされる予定です。 ムービーが見れます これは楽しみですね。 関連エントリ Ext2.0を便利に使うためのIDE集 PHPからExtJSを簡単に使えるラッパー「PHP-Ext」 パスワードの強度を示してくれるJS「Ext.ux.PasswordMeter.js」
自サイトの画像の保存をプロテクションする仕組み:phpspot開発日誌
MooTools 1.2 Image Protector: dwProtector Image protection is a hot topic on the net these days, and why shouldn't it be? 自サイトの画像の保存をプロテクションする仕組み サイトの画像は、次の方法で保存できますが、それを全部禁止する方法です。 ・右クリック→名前をつけて保存 ・デスクトップにドラッグ＆ドロップで保存 ・右クリックで名前をつけて背景を保存 ・背景画像を表示 dwProtect.js をダウンロードして、JavaScriptで以下のように書くだけです。 window.addEvent('domready', function() { var protector = new dwProtector({ image: '/blank.gif', elements:
デスクトップ操作をビデオにするソフトやサービスx１１個:phpspot開発日誌
デスクトップ操作をビデオにするソフトやサービスx１１個。 ソフトの紹介や、サイトの使い方の紹介するのはビデオ化するのが一番分かりやすいですね。 操作録画のためのソフトはどういうものがあるのか、調べてみました。 Wink - Windows, Linux対応の録画ソフト。ムービーへの注釈などの挿入も簡単。 Jing - Mac, Windows 対応の録画ソフト、サイトでの共有機能あり freescreencast.com - Windows向け(.Net必要)の録画ソフト、サイトでの共有機能あり TipCam - Windows向けのPC操作録画ソフト。Facebookにてシェア可能 DesktopCam - デスクトップ上の動きをWMV形式で高品質に録画できるキャプチャソフト Istanbul - Linux向け。Ogg Theora Video形式などに保存できるみたい AviScre
CSSのOverflowを応用して画像を綺麗にリサイズ表示するサンプル:phpspot開発日誌
Create Resizing Thumbnails Using Overflow Property | Css Globe This tutorial is aimed at controlling the size of the thumbnails appearing on your page. CSSのOverflowを応用して画像を綺麗にリサイズ表示するサンプル。 次のように、CSSで画像を固定サイズにトリミング表示できます。 更にマウスオーバーで画像を元サイズに。 実装について見ていきましょう マークアップが次のようにあったとします <p class="thumb"><a href="http://cssglobe.com/"><img src="image.jpg" /></a></p> そして、次のＣＳＳを適用。 p.thumb{ float:left; margin:.5
オンラインで動作するPowerPoint風プレゼンテーションアプリ13選:phpspot開発日誌
Forget PowerPoint: 13 Online Presentation Apps オンラインで動作するPowerPoint風プレゼンテーションアプリ13選が紹介されていました。 知らない間に沢山できているものですね。 Google Documents - ご存知、Google Docsの一部。 ＵＩが綺麗で使いやすく使用感がよい。検索機能も後々使えるので沢山ドキュメントを作っても安心ですね。 Preezo.com - PowerPointライクでなかなか使いやすいものになってます。 再利用、コラボレーション、共有機能付き SlideShare.com - スライドショーをyoutubeみたいに公開できるサービス。サイトにスライドの埋め込みも可能。 PowerPointやOpenOfficeのドキュメントをアップロードすることも出来ます。 日本でも発表資料でチラホラみられますね。
テキストをXHTMLに変換するJavaScript製「Markdown」ライブラリ:phpspot開発日誌
Showdown - Markdown in Javascript テキストをXHTMLに変換するJavaScript製「Markdown」ライブラリ。 次の画像を見てください。左の入力欄にテキストを入力すると、リアルタイムで右のウィンドウにHTMLに変換されたページが表示されます。 要は、Markdownとは、WIKIのような文字列変換を行うもののようですね。 ライブラリ自体はダウンロードして自分のツールに独自に組み込んだり出来そうです。 JavaScriptで出来ているということで、サーバに依存せず、アイデア次第で面白いもの/便利なものが作れるかもしれませんね。
色に関する便利WEBサービスいろいろ:phpspot開発日誌
COLORS TOOLBOX: 20 Tools For Working With Colors Sometimes all you need to get inspired to build a site is picking a color scheme, or even if you get stuck later in development you need some color help. 色に関する便利WEBサービスいろいろ。 WEBデザインに色は重要ですが、その色をWEB上でブレンドしたり、探したり、色合いをまとめたサイトなど便利なサイトがいろいろあります。 Color Blender - 2種類の色をブレンドできるサービス。色と色の間の色を調べる場合に便利。 Color-Inspirator - ランダムな色合いの生成が可能。共有することもできます。 colordb -
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
2chのdat落ちしたスレを右クリックで即座に蘇生させられるFirefoxアドオン「fire2chDat」:phpspot開発日誌
iPhoneで動くドラムアプリを作成する分かりやすいチュートリアル:phpspot開発日誌