SwiftWasm - Webブラウザ上でSwiftを実行
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました WebAssemblyへの注目が集まっており、それ故に様々な試みが行われています。計算処理の高速化、Canvasを書き換えることでゲームに用いたり、JavaScriptを全く書かずにWebアプリケーションも開発できるようになります。 そんな中、プログラミング言語をWebブラウザ上で動かそうと言う試みも増えています。今回はSwiftを実行するSwiftWasmを紹介します。 SwiftWasmの使い方 実行例です。 SwiftWasmはSwiftのコードを受け取って、評価します。さらに面白いのはその結果をJavaScriptで呼び出せることで、JavaScript側でUIやネットワークを操作し、WebAssemblyでSwiftのコードを実行するという連携が可能です。 SwiftWa
legit - Gitでプログラミング
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました プログラミングとバージョン管理は切っても切り離せないものです。それは開発者であれば誰しもが納得するでしょう。しかし、プログラミングとバージョン管理を一つにして、学習すべき要素を減らしてしまおうという発想はなかなか出てこないはずです。 それを実現してしまったのがlegitです。何を言っているのかよく分からないと思いますが、ぜひご覧ください。 legitの使い方 例です。例えば以下のコードはHello worldを出力します。しかしこのディレクトリにはGitリポジトリがあるだけで、中身は何もありません。 $ ruby interpreter.rb examples/hello/ Hello world ディレクトリでログを見たところです。怪しくHello worldだのputだのといっ
bento-starter - PWAを学ぶ、実装するのに参考にしたいスターターキット MOONGIFT
PWA（Progressive Web Apps）というキーワードに注目が集まっていますが、実際のところ何からはじめれば良いのか分からない人は多いのではないでしょうか。PWAは固有の技術を指し示すものではないので、特に分かりづらいでしょう。 そこで参考にしたいのがbento-starterです。PWAとは何か、を学ぶのにぴったりなスターターキットです。 bento-starterの使い方 こちらがそのテンプレートです。 マニフェストファイル、Service Workerもちゃんとインストールされます。 Lighthouseを使った評価はほぼパーフェクトです。 PWAの要素となるCACHE APIの利用はもちろん、アプリマニフェストやアクセシビリティもきちんと提供されています。このbento-starterをベースにしたり、ここから学べることは多数あるでしょう。Service Workerの
dbxfs - Dropboxをファイルシステム化 MOONGIFT
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました Dropboxは各OS向けにクライアントソフトウェアを提供しています。常時Dropboxを使っているならば便利ですが、時々しか使わなかったり、ストレージ容量を使うために躊躇している方もいるでしょう。 そこで使ってみたいのがdbxfsです。FUSEを使ってDropboxをファイルシステム化します。 dbxfsの使い方 利用する際にはDropboxのOAuth認証が必要です。 任意のフォルダにDropboxをマウントします。ファイル操作は普通に行えます。 dbxfsはDropboxを仮想的にマウントしていますので、使っていないファイルは読み込まれていません。大きなサイズのファイルを開こうとすれば時間がかかりますが、小さなファイルであれば気にならないでしょう。Dropboxは最初の同期に
Amethyst - キーボードでウィンドウを操作するMac OSX用ユーティリティ MOONGIFT
GUIのOSにおいてウィンドウが重なって表示されたり、たくさんのウィンドウが並ぶと作業効率が非常に悪くなります。そのたびにマウスで探したり、新しいウィンドウを開いたりするのはとても面倒です。そこでウィンドウマネージャが必要になります。 今回紹介するAmethystはMac OSX用のウィンドウマネージャで、xmonadを真似た作りになっています。 xmonadの使い方 起動するとアクセシビリティでの設定を求められます。 ウィンドウの並びは変更できます。 ウィンドウのレイアウトはTall、Wide、Fullscreen、Column、Row、Floating、Widescreen Tallが用意されています。この中から使いたいものだけをピックアップしておきます。 後はキーボード操作でウィンドウの配置をダイナミックに変更できます。 例えばこんな感じに綺麗にタイル状に並べられます。 キーボードシ
SchemaSpy - 既存のDBスキーマからドキュメント生成
システム開発ではデータベースを使うことが多いです。開発のはじまった段階でしっかりしたER図を作っている場合、開発が進んでいる中で生じた仕様変更を常にドキュメントに反映していかなければなりません。これは大きなコストです。 そこで使ってみたいのがSchemaSpyです。SchemaSpyは現在のデータベーススキーマを取得してドキュメントを生成してくれるソフトウェアです。 SchemaSpyの使い方 生成された内容です。テーブル一覧。 カラム。 リレーションは分かりやすく可視化されます。 さらに改善すべきポイントなど。 SchemaSpyを使えばER図を作ったりする手間なく、既存のスキーマから必要なドキュメントが生成できるようになります。きちんと設計を行っているならば、実際に動いているものは正確なドキュメントになるでしょう。作る手間もないのでお勧めです。 SchemaSpyはJava製のオープン
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
pnpm - npmの高速化と容量削減を実現
npmは優れたパッケージ管理システムですが、使っていると速度が遅くてストレスを感じることがあります。その挙げ句にエラーが出たら目も当てられません。それを解決するためにyarnも作られていますが、まだ機能的に十分でないこともあります。 そこで使ってみたいのがpnpmです。高速かつディスクスペースを低減してくれるnpmです。 pnpmの使い方 標準のnpmでインストールした場合。 pnpmを使った場合。3MBくらい小さくなっています。 pnpmでは複数のモジュールを平行してビルドする方式をとっており、高速化を実現しています。依存関係をフラット化することで余計なものをインストールせず、ディスク容量をセーブしています。 pnpm/pnpm: Fast, disk space efficient npm installs
Sharedocs - 社内で使えるQiitaクローン
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました 強い組織を作るためにはナレッジの共有が欠かせません。個々人のナレッジに留まっていては同じ経験を繰り返すだけですし、何も培われていきません。問題はどこに書き留めるかです。かつてはWikiもありましたが、慣れないと使いこなせませんでした。 今回紹介するオープンソース・ソフトウェアはSharedocs、プログラマが使い慣れているであろうQiitaクローンです。 Sharedocsの使い方 Sharedocsのトップページです。 ログインしました。カラーリングは違いますが、UIはとてもQiitaに似ています。 新規作成画面です。ここのデザインは結構違います。が、プレビューの機能などはついています。 表示例です。記法はMarkdownが使えます。 ユーザページです。投稿数、ストック数などが確
docker-lambda - Dockerを使ったAWS Lambdaクローン
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました AWS Lambdaを使えばちょっとしたコードを実行して即座に終わるといった処理が簡単に作れるようになります。Webサービスのように恒常的に使うものではないけれども（API Gatewayを合わせればできますが）、コールしたらすぐに実行できるという手軽さがウリです。 そんなLambdaの開発時に使えるソフトウェアがdocker-lambdaです。Lambda風に実行できるDockerコンテナです。 docker-lambdaの使い方 例えばこんな感じのコードを書きます。 // Just a test lambda, run with: // docker run -v "$PWD":/var/task lambci/lambda exports.handler = function
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
Docker-Clean - Dockerの不要なリソースを整理
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました Dockerを使っていると分かるのですが、イメージを作ったりコンテナを立ち上げたりしていると次第に履歴がゴミのようにたまっていきます。もちろん必要な場合もあるのですが、開発途中は不要だったりします。 それらの整理をしてくれるのがDocker-Cleanです。簡単なコマンドでDocker上の不要なリソースを整理してくれます。 Docker-Cleanの使い方 Docker-Cleanでイメージを削除します。 $ docker-clean images No containers To clean! Cleaning images... Error: No such image or container: 178ab09fdd10 Error: No such image or con
Crowi - MarkdownとWikiを組み合わせた組織用コミュニケーションツール MOONGIFT
メモというのは大事なもので、蓄積されたメモは後々大きな意味をもってきます。そのためにも手軽に、かつ一カ所にまとめて書けるようになっていなければなりません。散在したメモは探すコストが大きく、役に立ちません。 会社であればメモはみんな一カ所に書きためるべきです。それによって知らなかった新しい知識に辿り着けます。それを可能にするのがCrowiです。 Crowiの使い方 まずログインします。 こちらがメモの画面で、ビューワーにあたります。 こちらはプロフィール画面。この画面も編集できます。 右上のアイコンをクリックすると新しいメモが作成できます。 編集画面です。Markdownを使います。画像のアップロードはドラッグ&ドロップでできます。 自動的にURLが変わって、プレビューも更新されます。 更新履歴も表示できます。 Crowiはグループで利用できるWikiエンジンで、ブラケット名も利用できます。
Githunt - Google Chromeの新規タブでGitHubトレンドを表示
Google Chromeでは新しいタブを開くとよく見るWebサイトなどが表示されます。しかし個人的にはここからサイトにアクセスすることはまずありません。普通にアドレスバーに入力するか、検索するかです。 そのため、この部分は邪魔だと思っていました。もし同じように思っている方がいれば、Githuntを使って皆が好きなGitHubの情報を表示してみるのはいかがでしょう。 Githuntの使い方 インストールすると新しいタブを開いた時にGitHubのポピュラーなリポジトリが表示されるようになります。 言語や期間での絞り込みもできます。 GithuntはGitHubトレンドを表示してくれます。キャッシュしているとのことですが、APIへのアクセスには制限があるので、それを超えてアクセスする場合は設定画面からトークンを取得して表示するとのことです。 GithuntはGoogle Chrome用のオープ
はてなブックマークの共有機能をiOSアプリに組み込もう·Hatena-Bookmark-iOS-SDK MOONGIFT
Hatena-Bookmark-iOS-SDKはiOS用、Objective-C製のオープンソース・ソフトウェア（MIT License）です。 日本における最大のソーシャルブックマークサービスと言えばはてなブックマークです。TwitterやFacebook同様にソーシャルの拡散を期待するなら見逃せない存在です。そこでiOSアプリからでも情報を共有できるSDK、Hatena-Bookmark-iOS-SDKを使ってみましょう。 デモアプリです。右上の共有ボタンを押してみます。 共有ダイアログが出ます。はてなブックマークを選択します。 認証が必須です。筆者環境ではなぜか認証が完了できませんでした。 OAuth認証が行われます。予めコンシューマキーの設定が必要です。 こちらは公式サイトより。コメントやタグの入力が容易にできるようになります。 Hatena-Bookmark-iOS-SDKはブラ
plotly.js - 3Dまでこなす高度なグラフライブラリ MOONGIFT
Webに足りないのは高度な表現力と言われていますが、HTML5のSVGやCanvasによって大幅に向上しています。しかし、それらを使いこなしたり、プログラミングと組み合わせるのは大変です。 そこでライブラリを使って手軽に表現力を増してみましょう。今回はグラフライブラリのplotly.jsを紹介します。 plotly.jsの使い方 サンプルです。マウスオーバーにも対応しており、ハイレベルな描画ができます。 マウスで囲んでズームできます。 こんなグラフまで。 データの幅から平均値を使ってトレンドを見ることができます。 この淡い感じがすごいですね。 WebGLを使った3Dグラフにも対応しています。 基本的なグラフにももちろん対応しています。 複雑かつ使われる機会も多いグラフ。 地図やローソクチャート。 3Dチャートは使いこなすのが難しそうですが、インパクトがありますね。 plotly.jsはグラ
ShareDoc - Rails製のSlideShare/SpeakDeckクローン MOONGIFT
プレゼンで使ったスライドはどうしているでしょうか。せっかく作ったものなので、そのままにしておくのは勿体ないでしょう。SlideShareやSpeakDeckにアップロードする人が多いかと思います。 しかし自社のブランディングであれば自分たちのサイトにアップしておく方がいいという話もあります。そこで使ってみたいのがShareDocです。 ShareDocの使い方 トップページです。まずはユーザ登録からはじまります。 ユーザ名を決めます。 ファイルをアップロードします。各種スライドファイルに対応しています。今回はPDFですが、それ以外のフォーマットの場合はOpenOffice.orgの機能を使います。 こんな感じに一覧が並びます。 スライドはWeb上で閲覧できます。 ShareDocは一般公開はもちろんのこと、社内にあるスライドを共有して誰でも使えるようにすることもできます。内容が手軽に確認で
React Desktop - Reactを使ってMac OSX/Windowsアプリを開発 MOONGIFT
Reactへの注目がどんどん高まっています。Webのビューライブラリという枠を越えて、React Nativeによってスマートフォンアプリ開発にも使えるようになっています。特にコンセプトであるLearn once, run everywhere（一度覚えればどこでも動く）が素晴らしい考えと言えます。 そんなReactを次のターゲットとしてデスクトップでも動くようにしたのがReact Desktopです。Mac OSX/Windowsに対応しています。 React Desktopの使い方 React Desktopのデモです。Webでも表示できるのがすごいです。 コントロールもちゃんと動きます。 そしてWindows 10でも使えます。 フォームもまさにWindows 10といった感じです。 メニューを隠すこともできます。 ElectronはHTML5を使ってデスクトップアプリを作ることがで
react-blessed - CUIアプリケーションでもReact！ MOONGIFT
Reactの良いところは表示されている状態を管理する必要なく、ただバーチャルDOMに描画すればReactがいいように仕上げてくれるところにあります。これはWebだけでなく、React Nativeのようにアプリでも使える考えと言えます。 他にもWindowsやMac OSXでもReactの考えが取り入れられていくかも知れません。そんな中、いち早くReactを取り込んだのがreact-blessedで、CUIの世界で実現しています。 react-blessedの使い方 例えばこんな画面です。この時点で頑張りすぎな気もしますが。 そしてこれがreact-blessedを使うとこんな感じに動くわけです。 そして以下がそのコード。面白いので全部載せます。 import React, {Component} from 'react'; import blessed from 'blessed'; i
Deb.js·JavaScriptのデバッグを効率化する小さなライブラリ MOONGIFT
最近のWebブラウザの進化によってJavaScript開発はとても便利になっています。ブレイクポイントを差し込んだり、コンソールを使うことでどんどん開発が進められるようになっているでしょう。 そんなJavaScript開発をさらに便利にしてくれそうなソフトウェアがDeb.jsです。ごくごく小さなデバッガーです。 Deb.jsの使い方 Chrome ウェブストアで公開されていますので、インストールします。 こちらがインストール画面です。 インストールされるとDebアイコンが追加されます。 こんな感じでURLに?debjsを追加すると自動で読み込まれるようになります。 任意の関数に.deb()を追加するとスタックとレースされるようになります。 引数や返り値、実行時間などもとれて便利です。 色分けもされるので分かりやすいですね。 開発効率向上を考えると、デバッグ方法は色々知っておいて損はないでし
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
