タグ

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

  • DBeaver - 多彩なデータベースに対応した管理UI

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

    DBeaver - 多彩なデータベースに対応した管理UI
  • Gitea - Go製のGitリポジトリ管理サーバ

    Gitリポジトリは分散型ではありますが、一つ信頼できるサーバがある方が便利です。そこでGitHubやBitBucketなどが使われるわけですが、企業によってはセキュリティ上の理由で使えないこともあるでしょう。 そんな方に使ってみて欲しいのがGiteaです。日語化も行われているGitサーバです。 Giteaの使い方 トップページです。Goで書かれているのでサーバのOSを選ばず実行できるのが特徴です。 登録しました。個人のリポジトリはもちろん、組織にも対応しています。 新しいリポジトリを作りました。この辺りはGitHubに似ていますね。 ちゃんと日語化されています。 自分に割り当てられている課題があれば、ここで一覧表示されます。 プルリクエストです。 履歴です。 GiteaはWikiの機能があったりと、基的にはGitHubと同じような機能が並んでいます。さらに課題をプロジェクトを横断して

    Gitea - Go製のGitリポジトリ管理サーバ
  • DevOOPS - 多数のパターンを用意したBootstrap管理画面

    デザインでシステムの品質が決まるわけではありません。しかし、それでも全くデザインされていないシステムよりも見た目が整っている方が安心して使えるでしょう。それは管理画面でも同様です。 通常、管理画面は利用者が限定的なため、デザインが適当になってしまいます。そんな寂しい管理画面もDevOOPSを使えば一気に見た目が向上するでしょう。 DevOOPSの使い方 DevOOPSには多くのテンプレートが用意されています。これらを組み合わせるだけで格好良い管理画面ができあがりそうです。Bootstrapベースなので、カスタマイズもそれほど難しくはないと思います。 DevOOPSはHTML5/JavaScript製、GPL v3のオープンソース・ソフトウェアです。 devoopsme/devoops

    DevOOPS - 多数のパターンを用意したBootstrap管理画面
  • ECharts - 多種多様な表現に対応したグラフ/チャートライブラリ MOONGIFT

    Webは表現力がそれほど高くないのが常に問題視されています。特に業務系システムではグラフ/チャートを使ってデータを可視化する必要があります。最近ではビッグデータが話題にあがっており、大量のデータを効率的に描画しなければならなくなっています。 そこでEChartsを紹介します。ビッグデータモードまで用意された多種多様なパターンの用意されたチャートライブラリです。 EChartsの使い方 今回はその多様なグラフ、チャートを紹介します。 曲線のグラフ。 積み上げグラフ。 棒グラフ。 エリアグラフ。 曲線。かなり複雑です。 こちらもユニークです。途中で途切れています。 棒グラフですが、範囲が指定できています。 左右の比較グラフ。 複数グループの棒グラフ。 散布図。 こちらも散布図。 画像も合わせた表示。 散布図と色の組み合わせ。 ローソクチャート。 円グラフ。 より描画にこだわった円グラフ。 レー

    ECharts - 多種多様な表現に対応したグラフ/チャートライブラリ MOONGIFT
  • Suave UI – AngularJSと組み合わせて使いたいUIフレームワーク

    JavaScriptを活用したWebアプリケーション開発の流れが広まっています。JavaScriptアプリケーションが大型化すれば、自然とフレームワークを欲するようになります。AngularJS、Ember、Backboneあたりが有名でしょうか。 今回はAngularJSをターゲットにしたプロダクト、Suave UIを紹介します。AngularJSと組み合わせて使うと便利なUIフレームワークになります。 Suave UIの使い方 Suave UIAngularJSに対応した部分において、su-*というプリフィックスを持っています。スタイルシートについてもsu-*をつけて使います。UI周りで従来のライブラリを使うと、そこだけAngularJSと違う書き方になって浮いてしまうことがあります。Suave UIを使ってUIとスクリプトが親和性高い状態を維持しましょう。 Suave UIはJav

    Suave UI – AngularJSと組み合わせて使いたいUIフレームワーク
  • kuromoji.js - Webブラウザ上で分かち書き! MOONGIFT

    テキストから意味を読み取るというのは非常に難しく、そのための専用ソフトウェアが存在するほどです。そしてテキスト解析手法の一つとして知られているのが分かち書きです。日語であればChasenがよく知られています。 kuromoji.jsはそんな分かち書き処理をJavaScriptで行ってしまおうというソフトウェアになります。KuromojiというApache財団のオープンソース分かち書きエンジンをJavaScriptにポーティングしています。 kuromoji.jsの使い方 こちらはデモです。Webブラウザベースで動作しています。nodeでも使えます。 適当な文章をリアルタイムに分かち書きできます。 kuromoji.jsは辞書ファイルをAjaxで取得しています。そのためサイズは大きくなりますが、分かち書きの精度はとても高くなります。サーバサイドで辞書を用意したり分かち書きエンジンを用意する

    kuromoji.js - Webブラウザ上で分かち書き! MOONGIFT
  • Bootstrap Admin Theme - Bootstrap3に対応した管理画面テンプレート

    これは知っておいて損はないでしょう! Bootstrapの便利な使いどころとして管理画面があります。管理画面は限られた関係者しか使いませんのでBootstrap臭がしても気にすることはありません。それなりの表示がすぐに実現できるのは使い勝手を向上します。 しかしそんな適当な範囲を超えて実用性のある管理画面を実現できるBootstrapテンプレートがBootstrap Admin Themeです。Bootstarp 3系に対応していますので最新のウィジェットもばりばり使えるでしょう。 Bootstrap Admin Themeの主なページとしては、 ログイン ダッシュボード カレンダー グラフ ボタン/アイコン WYSIWYGエディタ フォーム/ウィザード テーブル その他ウィジェット が用意されています。これだけあれば後は組み合わせるだけで(Bootstrap来の機能も使いつつ)リッチな

    Bootstrap Admin Theme - Bootstrap3に対応した管理画面テンプレート
  • Dat·データ版Git。データを分散管理、解析 MOONGIFT

    GitHubは各自がリポジトリを持つ分散型ソースコード管理システムになっています。そして各自が差分を受け取ることでコラボレーションを実現しています。 同じような仕組みをデータについても行おうとしているのがDatです。まだはじまったばかりのプロジェクトではありますが非常に興味深いソフトウェアになります。 インストールはnpmを使って行いますので簡単に完了します。 $ npm install dat -g インストールが完了したら、最も基的な使い方を試してみます。 $ mkdir foo $ cd foo $ dat init これで初期化が終わります。Gitに似ていますね。次にデータを追加します。 # 一例 $ echo '{"hello": "world"}' | dat --json # CSVからも可能 $ cat some_csv.csv | dat --csv データの読み込みは

    Dat·データ版Git。データを分散管理、解析 MOONGIFT
  • Kraken - PayPal製のnode用MVCフレームワーク

    MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました nodeの世界もどんどん充実してきていますね。 開発言語のトレンドは年々変わってきています。業務レベルではまだ使われることは少ないもののnodeのシェアも増えつつあります。そしてさらなる拡大のために必要になるのが優秀なフレームワークでしょう。 コミュニティベースでも幾つも出てきていますが、今回はPayPalが開発したnode用フレームワーク、Krakenを紹介します。 インストールは簡単でnpmコマンドで終わります。 $ npm install -g generator-kraken 終わったらYeomanのyoコマンドを実行します。ここが格好いいですね。 $ yo kraken プロジェクトが生成されたらnpm startでWebサーバが立ち上がります。 $ npm start

    Kraken - PayPal製のnode用MVCフレームワーク
  • watson·開発効率アップ!コードの中に書き込む課題管理 MOONGIFT

    これはGitHub/Bitbucketユーザは使うべき! ソフトウェアの問題はその殆どがプログラムコードにあります。そのためGitHubの課題管理においても要望は幾つかあるものの殆どはバグやコードに関連した事柄が多いのではないでしょうか。 そんな課題を都度Webブラウザを立ち上げてGitHubに書き込むのでは効率的とは言いがたいです。そこで使ってみたいのがwatson、コードに記述する課題管理です。 まずはインストールします。Rubyの他、Perlライブラリもあります。 $ gem install watson-ruby まずはヘルプ。 $ watson --help Usage: watson [OPTION]... Running watson with no arguments will parse with settings in RC file If no RC file exi

    watson·開発効率アップ!コードの中に書き込む課題管理 MOONGIFT
  • シンプルで美しいnode製のブログエンジン·Ghost MOONGIFT

    Ghostはnode/JavaScript製のオープンソース・ソフトウェア(MIT License)です。 今はソーシャルの時代であえてブログを書く人は少なくなっています。確かにソーシャルに投稿するのに比べると幾分面倒な感じがします。しかしシンプルなブログであればきっと使いたくなるはずです。それがGhostです。 最初にサインアップします。 管理画面です。投稿が一覧表示されています。 編集画面です。Markdownで記述します。右側にライブプレビューが表示されます。 コンテンツは自由に追加できます。 日語も問題ありません。 設定画面です。 プロフィール画面。こちらもすっきりとしたデザインで格好いいですね。 公開画面。デザインはかなりシンプルです。Tumblrのようですね。 記事詳細。こちらもとてもシンプルです。 GhostはKickstarterのキャンペーンで見事に目標を達成して開発さ

    シンプルで美しいnode製のブログエンジン·Ghost MOONGIFT
  • HTTP負荷テストをしよう·Vegeta MOONGIFT

    VegetaはGo製のオープンソース・ソフトウェア(MIT License)です。 HTTPの負荷テストツールは幾つかありますが、今回は最も新鋭と思われるVegetaを紹介します。コマンドラインで動作するのでインストールも簡単ですぐに使い始められます。 オプションです。基的にはアクセス先のURLをファイルに記述するのみです。 実行例。デフォルトで10秒間に500リクエスト行います。 アクセス先のURL指定はメソッドとURLを指定します。GETはもちろんPOSTやHEADアクセスによる負荷も計測可能です。レポートはテキストの他、SVGでの出力もできます。VegetaはGoで作られており、Goのプログラム中でライブラリとして呼び出して使うこともできます。 MOONGIFTはこう見る WebサービスがメディアであればGETリクエストが最も多くなります。コミュニティサービスであればGETはもちろ

    HTTP負荷テストをしよう·Vegeta MOONGIFT
  • Web上でインタラクティブな図を描く·JointJS MOONGIFT

    JointJSはJavaScript製のオープンソース・ソフトウェア(Mozilla Public License)です。 Web上で図を表示したいと思うことは多々あります。そんな時に画像を使うのは最も知られた方法ですが、再利用性や修正コストが大きくなります。図にもよりますが、JointJSがカバーできる範囲は大きいのではないでしょうか。 こんな複雑な図の描画も行えます。 マウスオーバーで線の削除ができます。 線のポイントを変更して曲がり方を変えることもできます。 組織図。こちらも移動ができます。 ER図。リレーションの関係も表せています。 DEVSの図とのこと。 チェス。オブジェクトの動きはチェス盤上に固定されます。 アニメーション付きの図です。 リンクの表現も多様です。 UMLのクラス図。 ステートチャート図。 JointJSでは多様な図を描くことができます。図はドラッグして動かすこと

    Web上でインタラクティブな図を描く·JointJS MOONGIFT
  • ローカルで編集すると即座にSCPでアップロード·sync MOONGIFT

    syncはPython製、MIT Licenseのオープンソース・ソフトウェアです。 Dropboxは便利ですが、それに慣れてしまうと独自のサーバにコンテンツをアップする時に不便に感じた経験はないでしょうか。そこで使ってみたいのがsync、SCPを使ったファイルアップロードツールです。 実行しました。実行の際にはローカルとリモートのディレクトリパスを指定します。 ファイルを作成しました。自動的にアップロード処理が開始されます。 syncはシンプルなツールで、ローカルでファイルを修正したり作成したりすると自動的にアップロード処理を行ってくれます。名称はsyncですが、リモート側での変更、追加は感知してくれませんのでご注意ください。 MOONGIFTはこう見る 最近はセキュリティ上の理由でFTPは解放しなくなってきています。そうなると使われるのがSCPです(SFTPもありますが多くないように思

    ローカルで編集すると即座にSCPでアップロード·sync MOONGIFT
  • Bootstrapベースの管理画面用テンプレート·Charisma MOONGIFT

    CharismaはHTML5/JavaScript製のオープンソース・ソフトウェア(Apache Licnese 2.0)です。 Webシステム開発において意外と不遇なのが管理画面です。内部の人が使うものなので適当に作られるケースが多くなります。そこで使ってみたいのがCharismaです。リッチな管理画面をBoostrapをベースに作り上げる事ができます。 ウィジェットがついた、リッチな管理画面です。ここまで恵まれているケースは早々ないでしょう。 ドラッグ&ドロップによる配置変更もサポート。 折り畳んで隠す事もできます。 グリッドは細かくサポートされています。 カレンダー。システム内部のデータをマッピングすると見通しが良くなりそうです。 メンバー一覧。検索やラベルもあって便利そうです。 ギャラリー。サムネイル写真をきれいに並べています。 タイポグラフィ。様々なタグをサポートしているので奇麗

    Bootstrapベースの管理画面用テンプレート·Charisma MOONGIFT
  • Googleアナリティクスを使ったA/Bテストを簡単に実現させる MOONGIFT

    easyABはjQuery/JavaScript製、MIT Licenseのオープンソース・ソフトウェアです。 ボタンの色が赤であるべきか、青であるべきか、キャッチコピーはどちらの方が良いか。そんなことは正直試してみないと分かりません。そこで必要なのがA/Bテストで、easyABを使えばGoogleアナリティクスを使って容易に測定できます。 使い方です。スロットと呼ばれるのがテスト設定になります。A/Bの2パターンに限らず多数の値で試す事ができます。 テストコードです。valueがGoogleアナリティクスで取得できる値になります。 easyABを使えばGoogleアナリティクスへ渡すデータと、そのデザイン上の変更ポイントを簡単に管理できるようになります。JavaScriptでの指定なので画像を変えてみたり、ラベルを変えたりと様々な項目を変更した結果をテストできるでしょう。 MOONGIF

    Googleアナリティクスを使ったA/Bテストを簡単に実現させる MOONGIFT
  • JavaScriptによる自動振仮名入力·autokana MOONGIFT

    autokanaはjQuery/JavaScript製のオープンソース・ソフトウェア(MIT License)です。 フォーム入力というのはユーザにとって相当なストレスになります。ちょっとでも面倒だと思うと諦めてしまいます。そこでなるべくユーザのストレスを減らして入力できるライブラリを用意すべきです。今回はフリガナ入力補助ライブラリautokanaを紹介します。 “な”と入力すると、ふりがなの欄に“ナ”と自動入力されます。 続けて入力して変換。ナカツガワときちんと入力されました。 例えばミスしてバックスペースを押せば、フリガナもその部分が削除されます。 振仮名ではひらがな、片仮名の両方が利用できます。KeyDownのイベントを使っていますので、コピー&ペーストされた文字列に対しては動作しません。また、現時点ではローマ字には非対応とのことです。 MOONGIFTはこう見る 入力フォームは総じ

    JavaScriptによる自動振仮名入力·autokana MOONGIFT
  • iOSアプリのデザインをスタイルシートで行う凄い技術·Pixate MOONGIFT

    PixateはMac OSX用のソフトウェアです。 iOSアプリのデザインはXcodeを使って行うのが一般的です。しかしWebデザイナーや開発者にとっては思い通りにいかなくてやきもきするときがあるかも知れません。そこで注目したいのがPixateです。何とスタイルシートと同じ記述で画面を作成できます。増資し、フリーになりました。 ボタンのデザイン。確かにスタイルシート調です。 記述を変えればダイナミックに描画が変わるのも特徴です。 SVGの表示も行えます。 さらにタップすると線だけに。 こちらはプレイグラウンド。様々な表示例があります。 ラベル。テキストエリアの部分は変更できます。 こんな感じにダイナミックに文字サイズを変更できます。 地図のポインター部分の大きさを変更。 当に数多くのデモがあります。 検索ボックス。 セクション付きのテーブルビュー。 様々なテキストビュー。 Pixateは

    iOSアプリのデザインをスタイルシートで行う凄い技術·Pixate MOONGIFT
  • node.jsを組み込んでローカルアプリケーション風に動作·node-webkit MOONGIFT

    node-webkitWindows/Mac OSX/Linux用のオープンソース・ソフトウェア(MIT License)です。 nodeは一般的にサーバサイドの技術で、サーバを立ててその上で実行されます。しかしnode.jsを使ってクライアント向けのアプリケーションが作れたらとても便利そうです。そんな夢を実現してくれるのがnode-webkitです。 こちらはデモアプリ。ブラウザはChroniumになります。 こんな感じでHTML/JavaScript/CSSで作ったアプリケーションを実行できます。 実行結果です。面白いのはJavaScriptではなく、node.jsのライブラリを組み込めることでしょう。 node-webkitはnpmで組み込む類のソフトウェアではありません。Chroniumをベースにnodeを動かせるように組み込んだソフトウェアです。Windows/Mac OSX/

    node.jsを組み込んでローカルアプリケーション風に動作·node-webkit MOONGIFT
  • ソートやフィルタにも対応したレスポンシブなテーブル·FooTable MOONGIFT

    FooTableはレスポンシブなテーブルデザインを行うライブラリです。 レスポンシブWebデザインにおける最大の難関はテーブルかも知れません。PCならば幅広く表示できたカラムがスマートフォンではうまく表示しきれません。そこで使い勝手を維持しつつ見栄えもいいテーブル表示にFooTableを使ってみましょう。 PCで表示したテーブル。 スマートフォン向けに縮めた場合。+記号が表示されています。 +記号をクリックすると、追加情報が表示されます。 HTMLを組み合わせた行。 こちらでもスマートフォンで表示できます。 タブレットでも調整されて表示されます。 ソート機能版。 もちろんスマートフォンでもソートが使えます。 フィルタリング。インクリメンタルに適用されます。 PCでももちろん使えます。 ソートとフィルタリングは同時に使えます。 FooTableを使う際にはタブレットやスマートフォンで表示する

    ソートやフィルタにも対応したレスポンシブなテーブル·FooTable MOONGIFT