タグ

関連タグで絞り込む (0)

  • 関連タグはありません

タグの絞り込みを解除

JavaScriptと*SoftwareとNode.jsに関するski_yskのブックマーク (94)

  • MailDev - ビューワー付きの開発用メールサーバ

    システム開発においてメール送信を行うことは多々あります。しかしメールは間違って送信してしまうと取り返しのつかないもので、開発者であれば誰しも一度は誤送信を経験したことがあるのではないでしょうか。 そこで使ってみたいのがMailDevです。開発用のメールサーバで、送信したメールの内容確認もできるソフトウェアです。 MailDevの使い方 MailDevはDocker版が出ているのですぐに試すことができます。25番ポートが空いていますが、これはDocker上の話なので別途10025などにつなげてあげる必要があるでしょう。 メールを送信すると左側のリストが更新されます。日語も通ります。 メールを選択して内容が確認できます。 添付ファイル付き。 ヘッダー情報の確認。 メールの検索機能もあります。 MailDevでは外部にメールを送信する、Relay機能もあります。条件に沿って送信する/しないを指

    MailDev - ビューワー付きの開発用メールサーバ
  • Roc - React/Reduxを使ったnodeフレームワーク MOONGIFT

    Reactを使ってみたいと思うプログラマはたくさんいると思うのですが、いざちゃんとしたものを作ろうと思うとフレームワークの存在に悩むことになります。Reduxを使うとしてもどういう組み合わせ、ディレクトリ構成でやるのがベストなのか分かりづらかったりします。 そこで使ってみたいのがRocです。React/Reduxを使ったnodeのWebアプリケーションフレームワークです。 Rocの使い方 Rocのインストールはnpmでできます。 npm install -g roc アプリケーションの初期設定はinitを使います。対話型で作ります。 $ roc init web-app-react Found a folder named /path/to/react-app, will try to use it. Using v1.0.3 as template version : ? What's

    Roc - React/Reduxを使ったnodeフレームワーク MOONGIFT
  • Flatmarket - 静的サイト主体で作られたEコマースシステム

    MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました Webシステムの筆頭とも言えるのがEコマースではないかと思います。商品を並べて、ショッピングカートに入れて決済する…特に大事なのが決済なのではないかと思います。カートに入れるまではともかく、そのまま決済完了しないと言った話はよく聞くところです。 バックグラウンドのシステムがない、そんな環境でもEコマースを作る…そんな試みがFlatmarketです。 Flatmarketの使い方 Flatmarketには完全にサーバがない訳ではありませんが、今ユーザに見えているのは静的なサイトです。 決済はStripeを使っています。 最後にカード番号を入れれば購入完了です。 来は購入完了のメッセージが出るはずなのですがエラーになってしまいました。 Flatmarketの仕組みとしては、静的なサイ

    Flatmarket - 静的サイト主体で作られたEコマースシステム
  • player - CLIの音楽プレイヤー

    MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました デスクトップで開発を行っている時に音楽を聴きながらという方は多いでしょう。そんな時にどんなソフトウェアを使っていますか。スマートフォン、iTunes、その他にも音楽ソフトウェアは幾つも存在します。 バックグラウンドで音楽を流すのに仰々しいソフトウェアは使いたくないという方はplayerを使ってみましょう。CLIで使える音楽プレイヤーです。 playerの使い方 playerコマンドはplayの後に音楽ファイルを渡すだけです。ローカルファイルはもちろん、URLでも使えます。 $ player play /path/to/bgm.mp3 press "x" to stop, press "s" to play, press "space" to pause / resume press

    player - CLIの音楽プレイヤー
  • JS-XLSX - JavaScriptでExcelファイルを解析

    MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました WebフォームでCSVファイルをアップロードしてください、というのはよくある機能です。しかしCSV自体解析するのが大変だったり、ユーザが作成するのも一手間かかるのであまり効率的とは言えません。 そこで、ユーザにはExcelファイルをそのままアップロードしてもらいましょう。その際使うのはJS-XLSX、JavaScriptによるExcelファイルパーサーです。 JS-XLSXの使い方 JS-XLSXのデモです。ドロップしたExcelファイルを解析して、CSVにしています。 さらにJSONにもできます。 JS-XLSXを使えば、Webブラウザ上でExcelファイル(ODSも可)を解析してAjaxでJSONだけを送ると言ったこともできます。これならシステムで扱うのも簡単そうです。さらにJ

    JS-XLSX - JavaScriptでExcelファイルを解析
  • Retro Board - 簡単に使えるシンプルなカンバン

    MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました カンバンは今やプロジェクト管理の基機能にさえなりつつあります。細かいステータスはともかく、開発しているのか、テストなのかといった状態が一目で分かるのは良いことです。 そんなカンバン機能だけを提供するのがRetro Boardです。とてもシンプルなカンバン機能を提供します。 Retro Boardの使い方 名前を入力して中に入ります。 こんな感じにタスクを作成できます。 一覧で見ることもできます。 タスクは複数作成できます。 他のユーザはいいねすることができます。 Retro Boardはごく基的なカンバン機能しかありません。プロジェクト管理は他にあった方が良いかもしれません。そして作業内容を決めたら、Retro Boardにタスクを書き出していってステータスを管理するのが良さそ

    Retro Board - 簡単に使えるシンプルなカンバン
  • s3rver - node製のS3クローン

    MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました Amazon S3はとても便利なサービスで、多くのWebサービスで使われています。しかし番環境ではよくとも、開発時から使っていると余計なお金がかかってしまうので大量のデータを投入するのを躊躇してしまうかも知れません。 そこで使ってみたいのがs3rverです。静的Webホスティングにも対応したAmazon S3クローンです。 s3rverの使い方 s3rverにアクセスしたところです。よくあるS3っぽいエラーが出ます。 画像をアップロードすればHTTP経由でアクセスできます。 s3rverは認証はされず、自由にバケットを作ったりアップロードができます。ファイルはローカルファイルシステムに保存されるので正しく動いているかどうかすぐに確認できます。ライブラリはRubyなどでも問題なく使

    s3rver - node製のS3クローン
  • mov2gif - 手持ちの動画をさくっとアニメーションGIFに変換 MOONGIFT

    最近、アニメーションGIFを使ってソフトウェアの操作を表現することが多くなっています。YouTubeなどに比べると簡単に、繰り返し見られる動画が作れるのが利点です。その際の素材として、動画から変換するというケースはよくあります。 今回紹介するオープンソース・ソフトウェアはmov2gif、動画をアニメーションGIFに変換してくれるコマンドです。 mov2gifの使い方 mov2gifはCLIなソフトウェアなので、引数として動画ファイルを渡すだけです。他にも幾つかのオプションがあります。 $ mov2gif --help Usage: mov2gif [options] <inputfile> オプション: --optimize Optimization level [デフォルト: 1] --output-file, -o Converted gif file --frame, -f fram

    mov2gif - 手持ちの動画をさくっとアニメーションGIFに変換 MOONGIFT
  • Swagger Editor - Swaggerフォーマットの編集とコード生成

    MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました SwaggerはWeb APIの標準記述フォーマットとして知られつつあります。標準ができるということは、それを使っていれば同じデータを使って他のフォーマットやサービスで使うことができるようになります。 すでにコード生成ライブラリなどが作られていますが、今回はSwagger向けのドキュメントを作れるSwagger Editorを紹介します。 Swagger Editorの使い方 こちらがメイン画面です。左側がエディタ、右側にその結果が表示されます。 イチから記述する他、JSONを貼り付けて読み込ませることもできます。 設定が多数用意されています。 クライアントやサーバサイドのコード生成が行えます。その結果はZipファイルでダウンロードできます。 例えばRubyのコードはこのようになり

    Swagger Editor - Swaggerフォーマットの編集とコード生成
  • Crowi - MarkdownとWikiを組み合わせた組織用コミュニケーションツール MOONGIFT

    メモというのは大事なもので、蓄積されたメモは後々大きな意味をもってきます。そのためにも手軽に、かつ一カ所にまとめて書けるようになっていなければなりません。散在したメモは探すコストが大きく、役に立ちません。 会社であればメモはみんな一カ所に書きためるべきです。それによって知らなかった新しい知識に辿り着けます。それを可能にするのがCrowiです。 Crowiの使い方 まずログインします。 こちらがメモの画面で、ビューワーにあたります。 こちらはプロフィール画面。この画面も編集できます。 右上のアイコンをクリックすると新しいメモが作成できます。 編集画面です。Markdownを使います。画像のアップロードはドラッグ&ドロップでできます。 自動的にURLが変わって、プレビューも更新されます。 更新履歴も表示できます。 Crowiはグループで利用できるWikiエンジンで、ブラケット名も利用できます。

    Crowi - MarkdownとWikiを組み合わせた組織用コミュニケーションツール MOONGIFT
  • mailtrain - 自分でホスティングできるニュース配信サービス MOONGIFT

    インターネット上に様々なコミュニケーション手段はあれど、メールはまだまだ根強い人気があります。特に購読するまでもないのだけれど、サービスがローンチするなどのアップデートがあれば知りたいという際には便利です。 そんなニュースレターシステムを構築できるのがmailtrainです。MailChimp風のシステムとなっています。 mailtrainの使い方 トップページです。まずログインします。 mailtrainの設定画面です。 まずリストを登録します。 リストの下にメンバーが紐付きます。 利用者が使う登録フォームです。 メールのテンプレート機能。名前などは変数化されています。 キャンペーンを作って効果測定もできます。 mailtrainを使えば自分たち独自のニュースレターシステムが構築できます。スパムを送ったり、目的外の利用は厳禁ですが、より柔軟なメール配信設定を行ったり、自社システムと連携し

    mailtrain - 自分でホスティングできるニュース配信サービス MOONGIFT
  • airtar - AirDrop風にファイルを送受信できるコマンド

    MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました コンピュータ同士でファイルを渡し合うという手段は意外と面倒です。メールは厄介ですし、Dropboxを使うにしてもまず共有設定がいります。小さなファイルを幾つもアップロードするのも面倒でしょう。 そこで使ってみたいのがairtarです。ローカルネットワークにつながったコンピュータ同士でファイルの交換ができます。 airtarの使い方 airtarはファイルを交換したいディレクトリに移動し、次のようにコマンドを打ちます。またはファイル名を引数に与えても大丈夫です。 $ airtar . waiting for receiver... この状態で接続待ちになりますので、ファイルを受け取りたい方でもairtarを実行します。そうすると自動的に現在のディレクトリにファイルがダウンロードされま

    airtar - AirDrop風にファイルを送受信できるコマンド
  • Kuzzle.io - リアルタイム通信対応のバックエンドシステム MOONGIFT

    Webサイトやアプリを開発していて、必ず必要になるのがバックエンド(サーバ)です。アプリではParse.com(間もなく終了しますが)であったりニフティクラウド mobile backend(筆者がエヴァンジェリストをやっています)などがありますが、Webアプリケーションにおいてもバックエンドは必須です。 そんなバックエンドシステムをオープンソースで提供するのがKuzzle.ioです。一回使い方に慣れてしまえば開発が大幅に楽になるかも知れません。 Kuzzle.ioの使い方 Kuzzle.ioのデモです。いわゆるタスク管理です。 日語も大丈夫です。タスクを追加したり消したりできます。 Kuzzle.ioのその他の特徴としては、リアルタイムであり、検索機能が備わっているということがあります。リアルタイムはゲームやチャットなどで使えるでしょう。Web、モバイルアプリ、IoTなどで利用ができる

    Kuzzle.io - リアルタイム通信対応のバックエンドシステム MOONGIFT
  • 【個人メモ】JSON Serverを使って手っ取り早くWebAPIのモックアップを作る - Qiita

    Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

    【個人メモ】JSON Serverを使って手っ取り早くWebAPIのモックアップを作る - Qiita
  • youtube-to-gif - YouTube動画をアニメーションGIFに変換

    MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました YouTubeには面白い動画がたくさんアップロードされています。その一部を抜き出してアニメーションGIFにしたいと思ったことはないでしょうか。動画をダウンロードし、一部を切り出してアニメーションGIFに変換する…考えただけでも面倒です。 そこで使ってみたいのがyoutube-to-gifです。一連の手順を一発で行ってくれるコマンドです。 youtube-to-gifの使い方 使い方は簡単で、URLと開始時間そして録画時間を指定するだけです。 youtube-to-gif -u https://www.youtube.com/watch?v=NqxSgp385N0 -b 30 -d 5 実行すると、下記のようにアニメーションGIFが生成されます。画像の大きさも変更できますが、これくら

    youtube-to-gif - YouTube動画をアニメーションGIFに変換
  • snapline - サイトがレンダリングされる様子をアニメーションGIF化 MOONGIFT

    Google ChromeのDevToolを使うと、Webサイト開発における改善点が多数見えてきます。表示上のトラブルを感じている場合、タイムライン機能を使うのが良いでしょう。 サイトがどのようにレンダリングされているのか分かりますし、さらにそれをアニメーションGIFとして確認できるようにしてくれるのがsnaplineです。 snaplineの使い方 使い方のデモです。まずTimelineタブで記録をします。Screenshotsを忘れずにチェックしておきます。 そしてSave Timeline Dataを選択します。 保存したJSONをsnaplineに渡すと、アニメーションGIFが生成されます。 snaplineではサイトのがレンダリングされていく様子がより分かりやすくなります。思った通りに構築されているかどうか、一目で分かるでしょう。一つ一つの画像では分からない情報も、snaplin

    snapline - サイトがレンダリングされる様子をアニメーションGIF化 MOONGIFT
  • Spec.js - スマートフォン/タブレットのスペックを判定 MOONGIFT

    Webサイトへモバイルやデスクトップ、タブレットなどが入り乱れてアクセスするようになると、それぞれに分けて情報配信を行いたいと思うようになります。さらにスマートフォンの中でも使える機能が異なったりして、そのための処理分けが複雑なものになっているかも知れません。 そこで使ってみたいのがSpec.jsです。より細かく端末の情報が絞り込めるライブラリになります。 Spec.jsの使い方 Spec.jsのデモです。ユーザエージェントを使って各種機能やスペックを知ることができます。例えばiPhone 6の場合は次のようになります。 var ua = new UserAgent(); // iPhone 6 var spec = new Spec(ua); spec.UNKNOWN // -> false spec.SOC // -> "A8" spec.GPU // -> "POWERVR GX64

    Spec.js - スマートフォン/タブレットのスペックを判定 MOONGIFT
  • textlint-rule-write-good - 英文法の可読性チェック

    MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました 最近、英文を書く機会が増えているのですが、意味が分かるレベルから読みやすさや分かりやすさを意識するところに大きな隔たりがあるのを感じています。日語でも同じように、見やすい文章を書くというのはとても難しいことです。 その一助になりそうなのがtextlint-rule-write-goodです。textlintの一つとして、文法の読みやすさをチェックしてくれます。 textlint-rule-write-goodの使い方 textlint-rule-write-goodのインストールはnpmを使って行います。 $ npm install textlint textlint-rule-write-good -g 後はtextlintコマンドのオプションとしてルールでtextlint-r

    textlint-rule-write-good - 英文法の可読性チェック
  • aalib.js - 画像や動画をアスキーアートに MOONGIFT

    画像をテキストに置き換えるのは昔から行われている面白い試みです。様々なアルゴリズムや描画方法が存在し、緻密に再現するものもあれば、なるべく簡素に表現しようとするものもあります。 今回はJavaScriptで画像をテキスト化する、aalib.jsを紹介します。さらに画像だけでなく動画まで変換できるのがポイントです。 aalib.jsの使い方 モナリザの画像。 カラーにも対応しています。 マリリン・モンロー。かなり細かく、グラデーションまで再現されています。 動画をリアルタイムにテキスト化します。 実際に動かしているところ。ずれはフォントによるものと思われます。 aalib.jsはWebブラウザだけで画像をテキスト化できます。わざわざサーバを立てたりする必要はありません。ユーザがアップロードした画像をその場でテキスト化するなんて使い方もできるでしょう。 aalib.jsはnode.js/Jav

    aalib.js - 画像や動画をアスキーアートに MOONGIFT
  • Eruda - スマートフォン向けのコンソール

    スマートフォンのブラウザでJavaScriptをデバッグしたり、スタイルの確認を行うのは非常に面倒です。わざわざUSBケーブルで母艦とつながないといけないですし、ケーブルがない状態でデバッグなどほぼ考えられないでしょう。 そこで使ってみたいのがErudaです。スマートフォン用のJavaScriptコンソールです。 Erudaの使い方 Erudaを起動するには右下のアイコンをタップします。 Erudaを起動しました。まずはコンソール。 JavaScriptを実行できます。 ネットワーク。 エレメント。 リソース。 ユーザエージェントなど。 ブラウザがサポートしている機能について。 設定。全画面ではなく半分の高さに調整できます。 ErudaはいわばDevToolsのモバイル最適化版と言えます。全機能が実装されている訳ではありませんが、開発時にちょっと便利になりそうな機能が備わっています。開発時

    Eruda - スマートフォン向けのコンソール