タグ

ブックマーク / www.moongift.jp (9)

  • Dynamics.js - 物理系アニメーションライブラリ MOONGIFT

    アニメーションは何の意味もなく動かしても面白くありません。一回転させたり、ひっくり返ったりと現実世界を投影するような動きは目を引きやすく、表現としても分かりやすいです。 そこで使ってみたいのがDynamics.jsです。物理系の動きを再現するJavaScript/CSSアニメーションライブラリになります。 Dynamics.jsの使い方 Dynamics.jsには多数のパターンで動きが作られています。 スプリングという名前のアニメーションです。 バウンド。 強い重力。 この他にもいくつものパターンでアニメーションが作られています。さらにパラメータを変更することで動きを調整できるようになっています。Dynamics.jsを使ってリアルな物体感を感じさせるアニメーションを実現してください。 Dynamics.jsはJavaScript製、MIT Licenseのオープンソース・ソフトウェアです

    Dynamics.js - 物理系アニメーションライブラリ MOONGIFT
  • Mavo - Webアプリケーションを作る新しいアプローチ

    MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました 最近、ReactVueなどのビューエンジンに人気が集まっています。双方向更新が可能で、データをアップデートすれば自動的にUI側も更新されます。これにより、DOM周りのステータス管理から解放されるようになります。 今回紹介するMavoもビューエンジンですが、半分ロジックも加わったような作りになっています。 Mavoの使い方 基JavaScript/スタイルシートを読み込むだけです。 <script src="https://get.mavo.io/mavo.js"></script> <link rel="stylesheet" href="https://get.mavo.io/mavo.css"> サンプルです。以下のようなコードを書きます。 <main mv-app="p

    Mavo - Webアプリケーションを作る新しいアプローチ
  • Gixy - nginxの設定ファイルを静的解析して改善提案

    MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました HTTPサーバとしてnginxを使っているケースは多いかと思います。しかし設定に関する情報はまだまだ多くはなく、動くように設定はしても、それがベストなのかどうか判断できない方も多いのではないでしょうか。 そんな方にお勧めなのがGixyです。nginxの設定ファイルを解析して改善案を提示してくれます。 Gixyの使い方 Gixyのインストールは pip でできます。 pip install gixy 後はnginxの設定ファイルを指定するだけです。 $ gixy /path/to/nginx.conf ==================== Results =================== Problem: [host_spoofing] The proxied Host h

    Gixy - nginxの設定ファイルを静的解析して改善提案
  • DBeaver - 多彩なデータベースに対応した管理UI

    データベースを使った開発や運用時においてGUIの管理インタフェースが欲しいと思うことは多々あります。特にプロジェクトによってデータベースの種類が違ったり、接続先があちこちに存在するとそう感じるはずです。 そこで使ってみたいのがDBeaverです。多彩なデータベースに対応した管理UIです。 DBeaverの使い方 接続先の選択画面です。PostgreSQL/MySQL/MariaDB/DB2/Oracle/SQL Serverなどの基に加えてMS Access、infomix、MongoDB、Firebirdなども選択できます。 SSHトンネルに対応しているので番環境のデータベースも確認できるでしょう。 接続しました。 テーブルの一覧です。 データも確認できます。 ダイアグラムはリレーションなどの関係が分かるようになっています。 DBeaverを入れておけば、大抵のデータベースには接続で

    DBeaver - 多彩なデータベースに対応した管理UI
  • scrollMonitor - 大量のデータもスムーズにスクロール

    MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました Web上で大量のDOMを表示するのは自殺行為です。Webブラウザの動きがガクガクになったり、フリーズしてしまったりします。そのためページネーションが使われるのですが、業務要件として全データの表示を求められることは多々あります。 そんな時にはscrollMonitorを使ってみましょう。大量のデータであってもスムーズなスクロールが可能になります。 scrollMonitorの使い方 利用例です。実際に表示されているのはこの見えている部分だけで、黄色と紫色の部分は消えたり、新しくDOMに追加表示されます。 見出しを残してスクロールもできます。 scrollMonitorではデータはメモリ上にありますが、それをスクロールにあわせて描画しています。また、不要になった部分は破棄しています。こ

    scrollMonitor - 大量のデータもスムーズにスクロール
  • Reframe.js - iframeを自動リサイズするJavaScript MOONGIFT

    iframeを使ってWebサイトのコンテンツを埋め込めるサービスが増えています。特に多いのがYouTubeやVimeoなどの動画共有サイトです。埋め込むのは簡単なのですが、厄介なのはコンテンツがレスポンシブでないことです。 ブログなどをスマートフォンで表示すると動画の分だけ表示がはみ出てしまいます。そんな状態を改善するのがReframe.jsです。 Reframe.jsの使い方 Reframe.jsを実行するのは簡単です。以下のコードだけで使えます。 reframe('selector'); デスクトップサイズの場合。 幅を縮めても問題ありません。 Reframe.jsの特徴としては外部のJavaScriptライブラリに非依存ということでしょう。特にブログなどで活躍するのではないでしょうか。またハイブリッドアプリでも使えそうです。 Reframe.jsはJavaScript製のオープンソー

    Reframe.js - iframeを自動リサイズするJavaScript MOONGIFT
  • StubOnWeb - 自由に設計できるWeb APIスタブサーバ

    最近はAPIファーストと言われる言葉が聞かれるようになっています。スマートフォンアプリが隆盛になり、それに合わせてまずWeb APIを優先して開発していこうという考え方です。 しかしWeb APIがすぐに開発できるわけでもありません。そこで使ってみたいのが仮の値を返してくれるサーバです。今回はその一つ、StubOnWebを紹介します。 StubOnWebの使い方 StubOnWebのデモサイトです。 レスポンスに関する設計を行います。遅延する秒数も設定できます。 そしてアクセスすると設計した通りの値が返ってきます。 StubOnWebはURLが自動生成になるので決め打ちでクライアントを作るのを防げるかも知れません。自然と使っているWeb API一覧もできます。ローカルで立てればオフラインでも使えるのでサーバへ負荷を考えずに済みますし、テストもしやすくなるでしょう。 StubOnWebはEl

    StubOnWeb - 自由に設計できるWeb APIスタブサーバ
  • WebViewのJavaScriptからObjective-Cのメソッドを実行·WebViewJavascriptBridge MOONGIFT

    WebViewJavascriptBridgeはWebViewのJavaScript側からObjective-Cのメソッドを呼び出すモックアプリです。 iOSアプリで画面に柔軟性を持たせるためにWebViewでサーバサイドを読み込ませたりするのはよくあることです。しかしそうすると表現力が乏しくなってしまうのが欠点です。そこで使ってみたい手法がWebViewJavascriptBridgeです。WebViewのJavaScriptからObjective-Cのメソッドを呼び出すサンプルです。 iPhone側の表示です。ボタンを押します。 Xcodeのコンソールです。JavaScriptからメッセージを受け取ったとあります。 こちらがObjective-C側のコードです。メッセージを受け取って出力しているだけです。 こちらはJavaScript側のコードです。sendMessageでメッセージを

    sinfd
    sinfd 2012/03/13
  • Google Chrome用Tombloo互換拡張·Taberareloo MOONGIFT

    TaberarelooはGoogle Chrome向けのオープンソース・ソフトウェア。Webブラウザで色々なサイトを閲覧していて、メモしたりブックマークしたいと思う時がある。この時、多少なりとも面倒な手順や数ステップが必要では折角のチャンスを逃してしまう。 Google Chrome用Tombloo ワンクリックで各サービスにポストする所までたどり着けなければいけない。そのためのソフトウェアとしてTomblooが知られているが、こちらはFirefoxアドオンだ。対してTaberarelooはGoogle Chrome上で動作するスクラッピングソフトウェアだ。 現状ではリンクポストのみ対応となっている。対応サービスはTumblr/Delicious/はてなブックマーク/Livedoorクリップ/Yahoo!ブックマーク/FriendFeed/Twitter/Googleブックマーク/Inst

    Google Chrome用Tombloo互換拡張·Taberareloo MOONGIFT
  • 1