story-graph - プログラマブルに文章を作り上げる
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました 話をゼロから創作するというのは大変なことです。頭の中で世界を描き、それに合わせてキャラクターを動かしていきます。慣れると想像のキャラクターたちが自分で勝手に動き出すかも知れません。 そんなストーリーをプログラマブルに作れるのがstory-graphです。 story-graphの使い方 サンプルを実行します。実行するたびに内容が変わっているのが分かります。 $ node example.js The whisper passes through the sunlight. The whisper is illuminated by the sunlight. The ice joins with the sunlight for a moment. The ice does a w
base65536 - Base64ならぬ65536の文字種でエンコード/デコード MOONGIFT
バイナリデータをテキストフォーマットにする際に昔から使われているのがBase64です。メール添付や画像をHTMLに埋め込んだりする際にも使われているのがポピュラーなフォーマットです。 Base64の欠点として、エンコードするとバイト数が1.5倍くらいになってしまうというのがあります。もしかするとそれを解決できるかも知れない可能性をもったのがbase65536です。 base65536の使い方 base65536のでもコードです。まずは普通のBase64でエンコードします。 $ node > var buf = new Buffer("hello world"); // 11 bytes > buf <buffer 68 65 6c 6c 6f 20 77 6f 72 6c 64> > buf.length 11 hello worldが11バイトになります。続いてbase65536を使いま
Masato Kinugawa Security Blog: IE/EdgeのXSSフィルターを利用したXSS
English version: http://mksben.l0.cm/2015/12/xxn.html ------------------------------------------------ 2015年12月のMicrosoftの月例アップデートで修正された、Internet ExplorerとEdgeのXSSフィルターに存在した問題(CVE-2015-6144 および CVE-2015-6176)について書きます。 2015 年 12 月のマイクロソフト セキュリティ情報の概要 https://technet.microsoft.com/ja-jp/library/security/ms15-dec.aspx 修正された問題は、2015年10月に行われたセキュリティカンファレンスのCODE BLUEで詳細を伏せて発表した、IE/EdgeのXSSフィルターの動作を利用してXS
ResponsifyJS - 画像の表示をレスポンシブに変化
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました レスポンシブコンテンツの中で最も扱いづらいのは画像と言えます。バイナリファイルであるために画面の大きさに関わらず同じサイズですし、画面幅の変更に対してレスポンシブに変化することができません。 そこで使ってみたいのがResponsifyJSです。画像をレスポンシブにするjQueryプラグインで、単に縮小されてしまう表示とは一味違った演出が見ものです。 ResponsifyJSの使い方 ResponsifyJSを使った例です。これは普通の表示です。 画面幅を変えました。写真は小さくなりましたが、メインとおぼしき部分の大きさはほとんど変わっていません。 実際にブラウザのウィンドウを動かしてみると、画面幅に応じて画像の内容が若干動いているのが分かるはずです。 ResponsifyJSは画像
jQuery formBuilder - jQueryによる動的フォームが作成
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました マーケターの人たちはアンケートフォームを数多く作成します。そんな時に一回一回プログラマに依頼して作成してもらうのでは時間もかかりますし面倒です。 そこで使ってみたいのがjQuery formBuilderです。jQuery formBuilderを使えば自由にフォームが作れるので、後はそのデータを保存できるようにすればいいだけです。 jQuery formBuilderの使い方 jQuery formBuilderのデモサイトです。項目は自由にドラッグ&ドロップできます。 編集で細かいところを直せます。 リストなどは項目を設定できます。 実際のレンダリング結果を確認できます。 jQuery formBuilderは汎用的なフォームができますので、後はそのデータをJSONなりでまとめ
screenlog.js - console.log代替。画面上にログ出力 MOONGIFT
Webフロントエンドの開発時にDevToolsを開くことはよくあるかと思います。ただ、画面の大きさを結構とりますし、常に開いておくのが邪魔という方もいるでしょう。 そこで使ってみたいのがscreenlog.jsです。console.logのように使えて、画面上にログを出力してくれるソフトウェアです。 screenlog.jsの使い方 screenlog.jsを使っているのでところです。右上にデバッグメッセージが出ています。 自動的にメッセージが追記されていきます。 screenlog.jsはconsoleオブジェクトの代わりにscreenLogオブジェクトを使います。ログのクリアもできるので、デバッグに活躍してくれるのではないでしょうか。 screenlog.jsはJavaScript製、MIT Licenseのオープンソース・ソフトウェアです。 chinchang/screenlog.j
SSleuth - SSL/TLSの品質をチェックするFirefoxアドオン MOONGIFT
無料で使えるSSL/TLSのLet's Encryptが注目を集めていますが、その結果として有料のSSLとの比較が気になってくるでしょう。無料と有料で何が違うのか分からないと、無料に流れていってしまうことになりかねません。 まずSSL/TLSの違いが何なのか知る必要があります。そのためのFirefoxアドオンがSSleuthです。 SSleuthの使い方 例えばMozillaを見た場合。10点満点です。 次にDevRelを見た場合。9.0です。Extended ValidationがNoであることが原因のようです。 なお、SSleuthによるとGoogleにしても9.0でした。10点満点を取るのはかなり難しいと言えそうです。きちんとしたSSL/TLSが取れているか、SSleuthを使って確認しましょう。 SSleuthはFirefoxアドオンのオープンソース・ ソフトウェア（GPL v3）
Perfect - サーバサイドで動作するSwift！ MOONGIFT
ついにSwiftがオープンソース化されました。これによって起こる変化といえば、Mac OSX以外のプラットフォームでも活用できるようになることであったり、iOS/Mac OSX以外の環境での実行が可能になることでしょう。 その一つの形式として早速出てきたのがPerfectです。サーバサイドのPerfect実行環境です。 Perfectの使い方 Perfectには幾つかのデモアプリが入っています。Swiftで作られたHTTPサーバで動きます。 iOSアプリと連動するデモもあります。PerfectはMac OSXとLinuxで動作するとのことです。また、データベースはMySQL/PostgreSQL/SQLite/MongoDBがサポートされています。 まだまだプロジェクトははじまったばかりですが、iOSアプリとサーバサイドが同じ言語で書けるのは魅力的です。今後に期待したいプロジェクトでしょう
Instagram JS Filter - JavaScriptを使ったInstagram風フィルタ
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました Instagramの魅力と言えば撮影した写真に施す多彩なフィルタです。ネーミング含めて格好良く、写真を簡単に加工してくれます。単純に撮影しただけではなく、その後の加工が魅力を増してくれます。 以前にCSS3だけでのInstagram風フィルタを紹介しましたが、今回はJavaScriptも利用するInstagram JS Filterを紹介します。やはりそれだけ高度な表現が可能となっています。 Instagram JS Filterの使い方 まずはオリジナル。 Lark。 Amaro。 二値化したThrehold。 ネガポジ反転。 水平反転。 XYミラー。 Instagram JS Filterには他にもたくさんのフィルターが存在します。これらはすべてCanvas上で処理されており、
Booking.js - 空いている時間を表示するスケジュール管理 MOONGIFT
忙しくなってくるとミーティングなどの時間調整もままならなくなっていきます。なんとなく避けて提示した時間が相手にとってはピンポイントだったりして、いつまでも調整がつかないなんてこともあります。 そこで自分の予定をオープンにして、空いている時間を埋めてもらうのはいかがでしょう。Booking.jsはまさにそんなUIを提供します。 Booking.jsの使い方 Booking.jsのUIです。週間表示で1時間ごとに枠が決まっています。 空いている時間を選択すると予定を差し込めるようになっています。 こんな感じで自分の情報を入れればOKです。 複数のカレンダーにも対応。ビフの予定は入れたくないですね…。 Booking.jsは国に合わせて日付などの表記を変えたり、コールバックを受け取ることもできます。上司と面談する時間を各自で決めたり、弁護士などの仕業の方にとって便利なUIかも知れません。 Boo
採用プロセスを真剣に考えろという話
人材流動性の高まりを日々感じているみなさんこんにちは。 最近いろんな会社にお呼ばれしていて、その中でエンジニアの採用の話になることがとても多いのでちょっと整理しておきます。 ポイント▼「面白いプロダクトもないし、仕事内容は面白いとは思えないし、よい給与は払えないし、仕事環境にも自由はないけど、良い人雇いたいんだけど、どうしたらよいですか？」悪いが諦めろ。良い人は当然のことながら複数の会社が興味をもつことになるし、働く場所を自分で選択します。Pros/Consを見極めて選ぶことになるので、Prosがない場所で働く理由がありません…だとあまりに冷たいので、もしあなたが次に転職するとして、それでも今の会社に入るのであればあなたを惹きつける理由が何かあるはずで、それをアピールしよう▼「入社してから期待値にあっていないことが分かる、ってことが多いんだけどどうしたらよいですか？」期待値を明文化している
CentOS 7のシステム管理「systemd」をイチから理解する
CentOS 7のシステム管理「systemd」をイチから理解する：CentOS 7で始める最新Linux管理入門（2）（1/4 ページ） 「systemd」は、Linuxの起動処理やシステム管理を行う仕組みです。systemdはinitの限界を克服するために作られた新しいシステム管理アーキテクチャで、CentOS 7でも用います。では、何が違うのでしょう。これまで使われてきた「init」と比較しながら、基礎と課題を解説します。 連載バックナンバー 前回解説した「ここが変わった、CentOS 7のポイント」に続き、今回はより実務にLinuxの起動処理やシステム管理を行う「systemd」をあらためてイチから解説します。 CentOS 7では、これまで使われてきた「init」の限界を克服するために作られた新しいシステム管理アーキテクチャとして、このsystemdを使います。 まずはその特徴を
Free Icon Set for files - 60種類を越えるファイルアイコン
ユーザにファイルをアップロードしてもらう機能はよくあるかと思います。アップロードした後は画像であればサムネイルを表示すれば良いですが、他の画像フォーマットの場合は難しいでしょう。そこで分かりやすく区別するためにアイコンを使ったりします。 ファイルの種類はとても多いので、アイコンも多数のフォーマットに対応している必要があります。そこで使ってみたいのがFree Icon Set for filesです。 Free Icon Set for filesの使い方 Free Icon Set for filesで提供されている画像です。他にもPDFやIllustrator形式でも提供されています。 全部で63種類のアイコンが作成されています。 これだけの種類があれば大抵のファイル形式には対応できるのではないでしょうか。RubyやPHP、SQLもあるので（Perlがありませんが…）開発者向けにも利用で
CSS Gallery·これはすごい！スタイルシートだけで作られたイメージギャラリー MOONGIFT
ブログなどで画像を一覧で表示したり、記事中に写真を埋め込んでいるのはよく見る光景です。そんな時、画像をクリックするとフローティングで拡大表示されます。また、次の写真に移動することもできるでしょう。 そんな見せ方はCSSとJavaScriptを使ってこそできるものだと思っていましたが、CSS Galleryは違います。スタイルシートだけで実現してしまうのです。 CSS Galleryの使い方 CSS Galleryのデモです。写真の並び方も格好良いです。 クリックでモーダル表示。これもスタイルシートのみです。 次の写真に切り替えもできます。 写真のリスト表示もサポートされています。 リスト表示でもモーダル表示できます。 実際に操作しているところです。 CSS Galleryが良いのはJavaScriptがオフになっていても使えるということです。JavaScriptを使えば力技で解決できますが
Fluct - AWS Lambda × API GatewayによるWeb API作成を自動化 MOONGIFT
Amazon Web Servicesを使うと物理サーバを用意せずともWebサービスが作れますが、さらにAWS Lambdaを使えばインスタンスすら不要で処理を実行できるようになります。 個人的にはS3のファイル保存をトリガーとした処理くらいしか使ってこなかったのですが、Fluctはさらにすごい可能性を感じさせてくれます。 Fluctの使い方 Fluctの基本はチュートリアルを参考にしてもらうとして、ベースを作ったらあとはdeployを実行すれば良いだけです。なお、API GatewayのResourceを1つ作っておく必要があります。 $ fluct deploy Created zip: ./actions/list_users/lambda.zip Uploaded function: list_users Updated endpoint: GET /users Deployed:
オプティマイザトレースによるちょっとディープな快適チューニング生活
メリークリスマス！！今日はMySQL Casual Advent Calendar 2015の25日目をお届けするぞ！！ 前回のエントリでは、MySQL 5.7におけるオプティマイザの改良点や新機能についてのスライドを紹介した。MySQL 5.7のオプティマイザの良し悪しは、ぜひみなさんの手で確かめて頂きたい。ところで、オプティマイザといえばひとつ前のバージョンである、MySQL 5.6で追加されたオプティマイザトレースという機能がとても便利だ。使いこなせばクエリチューニングの強い味方になるので、ぜひまだ使ったことがないという方は、一度試してみて欲しい。本ブログではまだ紹介していなかったので、今日はその使い方と見方を紹介しようと思う。 オプティマイザトレースとは一体何か。ひとことで表せば、オプティマイザがどのような実行計画を検討・比較し、どの実行計画を選択したかということを、詳細に表示して
紹介！HTTP関連最新仕様！ | GREE Engineering
こんにちは、インフラストラクチャ部の後藤です。 このエントリは GREE Advent Calendar 2015の20日目の記事です。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
https://jsbundler.com/
GitHub - DIYgod/APlayer: :lollipop: Wow, such a beautiful HTML5 music player
How to Find Text on Web Page in Safari on iPhone & iPad with iOS 12, iOS 11, 10, 9