SourceChord

C#とXAML好きなプログラマの備忘録。最近はWPF系の話題が中心です。

TypeScript

monaco-editor + electronのサンプルコードを更新しました

以前、monaco-editorなどをelectron環境とかで使ってサンプルコードを書きました。 sourcechord.hatenablog.com sourcechord.hatenablog.com だいぶ時間がたって、使っているライブラリ類のバージョンが古くなっていたので、このサンプルのライブラリ類を更…

Electron 1.7.5 + TypeScript 2.5.2のサンプル

最近あまりElectronいじってなかったのですが、 気が付いたらElectron 1.7系のstable版となるv1.7.5がリリースされてました。 てことで、以前書いたElectron+TypeScriptのサンプルコードを最新バージョンに対応させておきました。 Electron/TypeScriptそれぞ…

TypeScriptのQuickStartページ

いつの間にか、TypeScriptの公式サイトに↓こんなページができていました。 Quick Start · TypeScript ReactやAngular、Vue.js、Knockout.jsといった定番フレームワークを用いたフロントエンド開発や、 Express, ASP.NET Coreなどのサーバーサイド開発でTypeS…

knockout.jsでバインディング・コンテキストの値をデバッガで確認する方法

近年のフロントエンド界隈では、Knockout.jsはあまり話題に上らなくなっちゃいましたね。。。 ですが、自分は以前Knockout.jsで書いてたプロジェクトを弄ったりと、今でも結構使ってます。 あと、なんだかんだ言って、双方向データバインディングだけあれば…

VSCode向けのTypeScript 2.0 + Electronサンプル

以前作ってみたTypeScript + Electronのサンプルプロジェクトですが、TypeScript2.0を使うように色々更新しました。 TypeScript 2.0.3に更新 Electron 1.4.4に更新 型定義ファイルの取得を、typing⇒@typesでの取得に変更 VSCode用の各種設定ファイル類を更新…

NeDB + TypeScriptで、asyncな非同期呼び出しをしてみる

この間使ってみたNeDB、 とても便利なんですが、各種APIがcallback形式のものとなっていて、、安易にコールバック地獄に突入してしまいそうな雰囲気を感じます。 NeDBを使ってNode.js環境でお手軽にNoSQLのDBを使ってみる - SourceChord せっかくTypeScript…

NeDBを使ってNode.js環境でお手軽にNoSQLのDBを使ってみる

Node.jsでNoSQLなDBを使うときは、MongoDBなどと組み合わせるのがよくあるパターンかと思います。 ただ、MongoDBは別途インストールが必要なので、ちょっとNoSQLなDBのお勉強という程度で使うには少し面倒です。 また、OS環境へのインストールが必要というこ…

TypeScript2.0での型定義ファイルの管理

とうとう出ました、TypeScript2.0!! TypeScript 2.0 is now available! | TypeScript メジャーバージョンアップなので変更点はたくさんありますが、個人的に一番気になっていた、npmからの型定義の取得を試してみます。 参考リンク TypeScript2.0での変更点…

NTVS 1.2 をインストールしてみた

Visual StudioでNode.jsアプリ開発を行うための拡張機能のNode.js Tools for Visual Studio(NTVS)ですが、コイツの新バージョンNTVS 1.2がリリースされてます。 インテリセンスのためのTypeScript/JavaScriptコード解析エンジンが更新されたようで、劇的にパ…

typescriptのasync/awaitで生成されるコードを見てみる

この間、async/awaitを試しに使ってみたときの、↓のコード。 http://sourcechord.hatenablog.com/entry/2016/07/28/084127 トランスパイルすると、どんなコードが吐き出されるのか見てみました。

TypeScriptでasync/awaitを使ってみた

そういえば、今までTypeScriptのasync/awaitを使ってなかったので、使い方を軽くφ(..)メモメモ TypeScript1.x系では、ES3/ES5向けのときはasync/awaitは使えないので、ちょっと敬遠してましたが、 Node.js環境だったら普通に使えるだろうし、、ということで…

monaco-editorをelectron環境で使ってみた

前回に引き続き、monaco-editorネタです。 今回は、monaco-editorをelectron環境で使ってみました。 プロジェクト一式は以下のリポジトリに置いています。 github.com 参考リンク monaco-editorのサンプル類が置かれた、以下のリポジトリを参考にやってみま…

typings1.0を使ってみた

もうずいぶんと前ですが、 TypeScriptの型定義ファイルの取得は、tsdが非推奨になり今後はtypingsというライブラリが推奨されるようになりました。 そして、このtypingsの1.0がでました。 今までなんだかんだで、tsdを使い続けてましたが、重い腰を上げて、t…

openerを使ってnpmスクリプトからブラウザを開いてみる

↓を見てこれはよさそう!!と思ってやってみました。 http://qiita.com/mysticatea/items/12bb6579b9155fd74586 このパッケージを使うと、npmスクリプトから指定したページをブラウザで開くことができます。 Win/Mac/Linuxどの環境でも、同じスクリプトでブラ…

electron環境でknockout.jsを使ってみる

そういえば、ブログにメモしてなかったので、改めてφ(..)メモメモ knockout.jsをelectron環境で使う手順についてメモしときます。

Electron 0.35.0以降での変更点

久しぶりにelectronのドキュメントやらリポジトリやら見てたら、結構変わってたのでφ(..)メモメモ。 とりあえず、これを書いてる現時点では、0.35.2が最新となっています。 で、以前Electronで遊んでた時のバージョン(0.34.x)から色々と変更点があるので、そ…

Electronで作ったウィンドウの各種設定など

ElectronのBrowserWindowクラスで作ったウィンドウの設定などについてメモ。

Electronで各種ダイアログ表示

今度はElectronのdialogモジュールを使い、いろいろなダイアログ表示をしてみます。 ↓のドキュメントを参考にやってみます。 http://electron.atom.io/docs/v0.34.0/api/dialog/

Electronのプロセス間の通信

MainProcess(BrowserProcess)とRendererProcess間の通信方法についてメモ。 プロセス間の通信方法は何通りかありますが、順番に見ていきます。

Electronでコマンドライン引数を受け付ける方法

ちょろっとメモだけ。 process.argvのプロパティで、コマンドライン引数を取得できます。 これはElectronではなく普通にNode.jsの仕様ですね。 ただし注意すべき点がひとつ。 このアプリ起動時のコマンドライン引数ですが、BrowserProcessから実行した場合は…

Electronでアプリのメニューを作る

今度は、Electron+TypeScriptなアプリにメニューを追加してみます。 Electronのアプリで使えるメニューには、ウィンドウ上部(Macの場合ディスプレイの上)に表示されるアプリケーションメニューと、画面右クリック時に表示されるコンテキストメニューの2種類…

TypeScript+Electronでデスクトップアプリを作ってみる

最近あちこちでElectronを使ったアプリが出てきたり、入門記事もちらほら見かけるようになってきました。 流行りものには乗っておこうということで、Electronをちょろっと使ってみました。 Electron JavaScriptでの入門は、良質な記事がネット上に多々あるの…

knockout.jsを使ってプログレスバーを作ってみた

とりあえず、コードだけちょろっとメモ。 プログレスの値を表示するための空divを作って、cssのwidthプロパティをデータバインドで制御してます。 かなりシンプルなコードだけど、必要十分な機能は果たせそうですwhtml/css共にプレーンに書いてるので、好み…

gulpメモ・その2~JavaScript/TypeScriptの圧縮~

コード中のスペース/タブなどのインデントや改行を取り除いたり、変数名を変えて短くしたりして、コードのサイズを小さくすることを、javascriptの圧縮とかminifyなどと言ったりします。 コードの圧縮をすることで、ファイルのダウンロード時間を短縮したり…

gulpメモ~TypeScriptのコンパイル~

gulpを使ってTypeScriptのコンパイルをやってみました。gulp-typescriptというライブラリを使ってTypeScriptのコンパイルをしています。 https://www.npmjs.com/package/gulp-typescript ということで、以下のコマンドでgulpとgulp-typescriptのインストール…

Knockout.jsで複数選択可能なテーブル

Knockout.jsなテーブルネタもう一個。 複数選択可能にしてみました。選択中の項目をKnockoutObservableArray型で保持しておき、 選択中のリストに含まれているかどうかチェックして、列の要素(tr)の属性を変えています。今回もとりあえずコードだけφ(..)メモ…

Knockout.jsで、要素を選択できるテーブル

ちょっと必要に迫られて作ったので、コードだけメモ。KnockoutObservableArray型の配列を、Tableタグで表示します。 また、各項目をクリックで選択できるようにしてます。 こんな感じ

Express4のプロジェクトをTypeScript用に作ってみた

Node.js Toolkit for Visual Studio(RC2)では、JavaScript用にはExpress4のテンプレートが用意されてますが、TypeScript用にはExpress3のテンプレートしか用意されていません。てことで、TypeScript用にExpress4のプロジェクトを作る手順の備忘録です。

tsdを使ってTypeScriptの型定義ファイルを取得する

TypeScript用の型定義ファイルの取得/アップデートなどの管理をしてくれるツールtsdを使ってみました。 ※Node.js用のプロジェクト(njsproj)では、今のところNugetが利用できません。(2015/03現在) なので、型定義ファイルはNuget以外の方法で取ってくる必要…

Visual StudioでNode.jsを使ってみる

最近TypeScriptをちょこちょこ弄ってるので、流れでNode.jsも使ってみました。 準備 Node.jsのインストール まずは、Node.jsをインストールします。 以下の公式ページから、インストーラをダウンロードしてきてインストールします。 Node.js ※一応、exe単体…