OSSでソースコードも公開されているJavaScript製のシンプルで使いやすいフローチャート作成Webアプリ・「Drawflow」 | かちびと.net

2020/09/08 10 users ドラッグ 左ペイン チャート 依存 オープンソース

Drawflow DrawflowはJavaScript製のシンプルで使いやすいフローチャート作成Webアプリです。オープンソースとしてソースコードも公開されています。他ライブラリへの依存もありません。 左ペインにあらかじめ用意された項目をドラッグでチャートエリアに持っていき、チャートを作成していく、というシンプルな流れ。 項... 続きを読む

JavaScript + PlayCanvasの公式サンプルを使って、モバイル・デスクトップで動く一人称視点の空間を作る - Qiita

2020/06/18 8 users WebGL Qiita PlayCanvas FPS視点 空間

JavaScript製のゲームエンジンPlayCanvasを使用して、FPS視点の空間を作る方法を解説します。 大体１５分程度でできる内容です。 完成品のプロジェクトはこちらになります。 https://playcanv.as/p/ygI1bj7M/ PlayCanvasとは? PlayCanvasはWebGLでのゲーム開発をするためのツールです。ソースコードはオープンソースで開... 続きを読む

JavaScript製のオープンソースなCMS・「CMS.js」 - かちびと.net

2016/01/27 36 users CMS net ソース

Web制作の話題を中心に、便利なWebサービスやリソースなどを紹介 Kudos for About This Web制作に役立つTips、チュートリアル、、マーケティングに役立つ情報などのリソースをほぼ毎日配信しています。宜しければメモ代わりにご利用下さい。詳しい情報はAbout me または humans.txt をご覧下さい。 Kachibito.net is a community-base... 続きを読む

【やじうまWatch】ブラウザー上でOSが動く、JavaScriptだけで書かれたOS「OS.js」が面白いと評判 -INTERNET Watch

2016/01/18 35 users API やじうまWatch INTERNET Watch

やじうまWatch ブラウザー上でOSが動く、JavaScriptだけで書かれたOS「OS.js」が面白いと評判 （2016/1/18 06:00） JavaScript製のOSが公開され、一部で話題になっている。「OS.js」と名付けられたこのOSは、JavaScriptだけで書かれており、ブラウザー上で動作することが特徴。オープンソースである本OSはAPIも提供されており、さまざまな連携プログ... 続きを読む

QuaggaJS - JavaScript製のバーコードリーダー MOONGIFT

2014/12/17 38 users quaggaJS バーコードスキャナー スキャナ 伝票 手法

コンピュータと現実世界との間で情報をやりとりする方法はいくつかあります。目で見てキーボードで入力するのも一つですが、非常に面倒くさいです。昔からある手法として知られているのがバーコードです。 バーコードスキャナーを使うことで伝票や商品に印字されたバーコードを読み取れます。しかしいくつかのバーコードを読み取るだけでスキャナを購入したくないという方はQuaggaJSを使ってみてはいかがでしょう。 Qu... 続きを読む

今どきのGruntを使ったフロントエンド開発（HTML/CSS編） — MOL

2013/12/01 353 users りんど Sass CSSプリプロセッサ MOL コンパイル

SassなどのCSSプリプロセッサを使うWebデザイナが増えてきました。Sassをコンパイルするだけなら黒い画面（ターミナル）を使わずともGUIアプリからの利用で問題ありません。が、ここは一歩踏み込んでGrunt（JavaScript製のタスクランナー）を使って、Sass以外のコンパイルやライブリロード、画像最適化、CSSのリントやスタイルガイド生成など、あらゆる作業をGruntに任せてより効率的... 続きを読む

ハロウィンなのでHTMLをぶるぶる震わせてみました - ✘╹◡╹✘

2013/10/29 80 users ハロウィン HTML jRumble CSS チャット

2013-10-29 ハロウィンなのでHTMLをぶるぶる震わせてみました 使い方 ぶるぶる震える ↑このリンクをブックマークに登録して使ってください 説明 適当なJavaScript製のHTML-Lintを実行して、検知されたHTML要素をCSSでぶるぶる震わせます。 チャットで雑談してたら急に震わせたくなって10分ぐらいで作ったのでだいぶ雑です。 実装 jQuery + jRumble + cu... 続きを読む

シンプルで美しいnode製のブログエンジン「Ghost」|オープンソース・ソフトウェア、ITニュースを毎日紹介するエンジニア、デザイナー向けブログ

2013/10/28 71 users Ghost node MIT License ソーシャル 最初

Ghostはnode/JavaScript製のオープンソース・ソフトウェア（MIT License）です。今はソーシャルの時代であえてブログを書く人は少なくなっています。確かにソーシャルに投稿するのに比べると幾分面倒な感じがします。しかしシンプルなブログであればきっと使いたくなるはずです。それがGhostです。 最初にサインアップします。 管理画面です。投稿が一覧表示されています。 編集画面です。... 続きを読む

没頭注意！あの名作をWebベースでリアルに再現「Full Screen Mario」|オープンソース・ソフトウェア、ITニュースを毎日紹介するエンジニア、デザイナー向けブログ

2013/10/24 9 users Full Screen Mario 名作 エンジニア 再現

Full Screen MarioはJavaScript製、Creative Commonsのオープンソース・ソフトウェアです。今でも世界中で人気のあるスーパーマリオブラザーズ。あのゲームをWebブラウザで、それもHTML5で再現してしまった作品がFull Screen Marioです。 いつも通りのマリオブラザーズの画面です。 ゴール！ 4-2。ここから豆の木でワープします。 8-3。再現性はと... 続きを読む

CSVデータをベクターグラフィックスで表現「Raw」|オープンソース・ソフトウェア、ITニュースを毎日紹介するエンジニア、デザイナー向けブログ

2013/10/21 32 users ベクターグラフィックス LGPL raw グラフィカル 一例

RawはJavaScript製のオープンソース・ソフトウェア（LGPL）です。表計算で作ったデータというとグラフで表すのが普通だと思います。しかしそれをさらに一歩越えてグラフィカルに表現してくれるのがRawです。 一例です。上がデータ部、下にあるツリーマップがそれを描画したものです。 グラフは色々と用意されています。こちらはバブルチャート。 このような進化図っぽいものもあります。 さらにグラフィカ... 続きを読む

HTMLコーディングの問題点を浮かび上がらせてくれるブックマーク「DiagnostiCSS」|オープンソース・ソフトウェア、ITニュースを毎日紹介するエンジニア、デザイナー向けブログ

2013/10/20 183 users MOONGIFT HTMLコーディング ソフトウェア ソース

DiagnostiCSSはJavaScript製のオープンソース・ソフトウェア（MIT License）です。Webブラウザはよく出来ていて、Web標準に沿っていなくともそれっぽく表示してくれます。しかしそれに安穏としているとレガシーなブラウザなどで表示が失敗したり、意図した動作にならないことがあります。そこでDiagnostiCSSを使ってチェックしてみましょう。 MOONGIFTで実行しました... 続きを読む

すごい！JavaScriptでMS Wordファイルを生成「DOCX.js」|オープンソース・ソフトウェア、ITニュースを毎日紹介するエンジニア、デザイナー向けブログ

2013/10/13 83 users zipファイル 生成 エンジニア 圧縮 ソフトウェア

DOCX.jsはJavaScript製のオープンソース・ソフトウェア（MIT License）です。Microsoft Officeのファイル形式は〜x形式になって以降、XMLファイルのZipファイルの圧縮であることはよく知られています。しかしだからといってOfficeファイルをWebベースで生成できるようになっているとは思いませんでした。それを可能にするのがDOCX.jsです。 テストページ。R... 続きを読む

Googleマップ上に任意の画像を表示「GMap-JSlicer」|オープンソース・ソフトウェア、ITニュースを毎日紹介するエンジニア、デザイナー向けブログ

2013/10/07 27 users ズーム MIT License ソフトウェア エンジニア 普段

GMap-JSlicerはJavaScript製のオープンソース・ソフトウェア（MIT License）です。Googleマップはみんな、普段から使っているでしょう。技術的に見てもズーム、移動など便利なものが多いです。自分でもあのUIを実現したいと思っている人も多いのではないでしょうか。そんな方に使ってみて欲しいのがGMap-JSlicerです。 デモ。GoogleマップのUIに任意の画像を載せて... 続きを読む

フラットUIなカレンダー「CLNDR.js」|オープンソース・ソフトウェア、ITニュースを毎日紹介するエンジニア、デザイナー向けブログ

2013/10/04 23 users jQuery フラットUI MIT License デモ 日付

CLNDR.jsはjQuery/JavaScript製のオープンソース・ソフトウェア（MIT License）です。カレンダー機能は意外とよく使われます。イベント系はもちろん、ブログのサイドバーにつけることもあります。そんなカレンダー表示をjQueryで提供するのがCLNDR.jsです。 デモ。左側にカレンダー、右側にイベントの一覧が表示されています。 別なデモ。カレンダーのみ表示して日付をクリッ... 続きを読む

HTML5/JavaScriptによる電子書籍風フリップアニメーション「Turn.js」|オープンソース・ソフトウェア、ITニュースを毎日紹介するエンジニア、デザイナー向けブログ

2013/10/03 82 users turn.js ePubファイル BSD License

Turn.jsはHTML5/JavaScript製のオープンソース・ソフトウェア（BSD License）です。電子書籍というとePubファイルが有名ですが、HTML5でも実現は可能です。特に紙をめくった時のようなフリップアニメーションが欲しい時にはTurn.jsを使ってみましょう。 デモです。幾つかのサンプル書籍が掲載されています。 開きました。 フリップしています。 別な書籍。マウスをもってい... 続きを読む

JavaScriptを読み込むだけでリアルタイムコラボレーション「TogetherJS」|オープンソース・ソフトウェア、ITニュースを毎日紹介するエンジニア、デザイナー向けブログ

2013/10/03 33 users リアルタイムコラボレーション TogetherJS

TogetherJSはJavaScript製、Mozilla Public Licenseのオープンソース・ソフトウェアです。Webアプリケーションをリアルタイムコラボレーション化しようと思うとサーバサイドの様々な仕組みを開発しないといけません。そこで頓挫してしまう人も多いでしょう。しかしTogetherJSを使えばチャット及びコラボレーション機能があっという間に手に入ります。 Todoアプリの例... 続きを読む

iPhone/Android/Windows Phone対応のモバイルWebアプリフレームワーク「ChocolateChip」|オープンソース・ソフトウェア、ITニュースを毎日紹介するエンジニア、デザイナー向けブログ

2013/09/30 50 users iPhone UIライブラリ iPhone風 ソフトウェア

ChocolateChipはHTML5/CSS3/JavaScript製のオープンソース・ソフトウェア（BSD License）です。モバイルWebサイトをネイティブ風にするUIライブラリは昔から多数存在しますが、今回はその最新版とも言えるChocolateChipを紹介します。 例えばこちらはiPhone風。iOS 7に似ています。 同じ内容でAndroid風。 こちらはWindows Phon... 続きを読む

項目を自在に設定できるアンケートライブラリ「Formbuilder.js」|オープンソース・ソフトウェア、ITニュースを毎日紹介するエンジニア、デザイナー向けブログ

2013/09/28 35 users Googleスプレットシート エンジニア ソフトウェア 住所

Formbuilder.jsはJavaScript製のオープンソース・ソフトウェア（MIT License）です。Googleスプレッドシートのアンケートフォーム作成機能は度々使われていますが、同じような仕組みを自分で作れるのがFormbuilder.jsです。JavaScriptを使って多様な入力項目を実現します。 アドレス入力。郵便番号から住所まで一気に入力できます。 単なるテキスト入力。 金... 続きを読む

JavaScript製の顔認識ライブラリがすごい | DECONCEPTER

2013/09/26 381 users DECONCEPTER 顔認識ライブラリ

JavaScript製顔認識ライブラリを紹介します。 試してみたところ想像以上に精度が高かったので驚きました。横顔や傾けた顔の認識は難しようですが、正面の精度がすごい。 auduno/clmtrackr デモは画像の顔認識トラッキング（Tracking in image）ビデオの顔認識トラッキング（Tracking in video）認識顔に別の顔を乗せてマスキング（Face masking）認識... 続きを読む

Stack Overflowでも利用中のWebベースMarkdownエディタ「StackEdit」|オープンソース・ソフトウェア、ITニュースを毎日紹介するエンジニア、デザイナー向けブログ

2013/09/24 42 users ローカルアプリケーション StackEdit ソフトウェア

StackEditはJavaScript製のオープンソース・ソフトウェア（Apache Licnese 2.0）です。最近Markdownエディタが熱いです。ローカルアプリケーション、Webベースと様々な形式がありますが今回は技術者に人気のサービスStack Overflowで使っているStackEditを紹介します。 こちらがエディット画面です。2ペインになっています。 JavaScriptベー... 続きを読む

200行で実現するJavaScript VNCクライアント「JavaScript VNC」|オープンソース・ソフトウェア、ITニュースを毎日紹介するエンジニア、デザイナー向けブログ

2013/09/15 53 users エンジニア ソフトウェア オープンソース ITニュース サーバ

JavaScript VNCはnode/JavaScript製のオープンソース・ソフトウェア（MIT License）です。最近は何でもJavaScriptでやってしまおうという試みが多数立ち上がっています。今回はなんとVNCクライアントをJavaScriptで作ってしまおうという野心的な試みをJavaScript VNCが行っています。 接続前の画面。RealVNCがサーバに使えます。 接続しま... 続きを読む

正規表現のチェックをグラフィカルに「Regexplained」|オープンソース・ソフトウェア、ITニュースを毎日紹介するエンジニア、デザイナー向けブログ

2013/09/14 50 users 記号 覚えたて ライセンス ソフトウェア エンジニア

RegexplainedはJavaScript製のソフトウェア（ソースコードは公開されていますがライセンスは明記されていません）です。正規表現を覚えたての頃は思いもしない一致や、逆に不一致に惑わされるかも知れません。文字の範囲や?などの記号の使い方を覚えないと思わぬシステムエラーに繋がる可能性もあります。そこで練習に使ってみたいのがRegexplainedです。 テスト画面です。マッチした部分が濃... 続きを読む

手軽にスムーズなスクロールを実現「AnimateScroll」|オープンソース・ソフトウェア、ITニュースを毎日紹介するエンジニア、デザイナー向けブログ

2013/09/08 10 users AnimateScroll スクロール ユーザ ソフトウェア

AnimateScrollはjQuery/JavaScript製のオープンソース・ソフトウェア（MIT License）です。Webページは縦長になりがちです。そこで使われるのが自動スクロールですが、一気に飛んでしまうとユーザのストレスになるのでスムーズなスクロールが求められます。そこで今回はAnimateScrollを紹介します。 AnimateScrollでは3つのパターンのスクロール法が利用... 続きを読む

スマートフォン向けWebアプリケーションフレームワーク「App.js」|オープンソース・ソフトウェア、ITニュースを毎日紹介するエンジニア、デザイナー向けブログ

2013/09/02 36 users app.js ネイティブアプリ エンジニア ソフトウェア 審査

App.jsはHTML5/JavaScript製のオープンソース・ソフトウェア（MIT License）です。スマートフォン向けにはアプリ開発もありますが、審査などなしでサービス提供したいと思ったらスマートフォン向けWebアプリとしてリリースする手もあります。今回はそのためのフレームワークApp.jsを紹介します。 YouTube検索アプリ。まるでネイティブアプリのようです。 画像検索。検索結果が... 続きを読む

アクセシビリティチェックに。色覚異常を再現する「ColorScope.js」|オープンソース・ソフトウェア、ITニュースを毎日紹介するエンジニア、デザイナー向けブログ

2013/08/25 18 users ブックマークレット 裾野 アクセシビリティ 要件 暖色系

ColorScope.jsはJavaScript製のオープンソース・ソフトウェア（MIT License）です。インターネットの裾野が広がるのに合わせてWebページのアクセシビリティは大事な要件になってきました。今回は色覚異常を再現するブックマークレットColorScope.jsを紹介します。 ブックマークレットを実行すると、様々な色覚異常の条件が表示されます。 一つ実行しました。暖色系の色がぐっ... 続きを読む