ng-tableさわる

http://ng-table.com/ 準備 webpack×TypeScriptの場合 webpack.config.js module.exports = { // ... module: { rules: [ { test: /\.tsx?$/, loader: 'ts-loader' }, { test: /\.html$/, use: [ { loader: 'ngtemplate-loader', options: { requireAngular:…

three.jsさわる

The Making of "The Aviator": Animating a Basic 3D Scene with Three.js | Codrops ここのチュートリアルが分かり易い&サンプルがかわいい。

クライアント側でCSV生成してダウンロードさせる

追記: Safariも10.1からdownload属性が利用できるにようになりました。 https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#Browser_compatibility CSVの生成 参考 ダウンロード msSaveBlob download属性 Data URI scheme + data:attachment/… サ…

Swiftの勉強(SpriteKit)

GitHub - fullstackio/FlappySwift: swift implementation of flappy bird. More at fullstackedu.com がよかった。ありがたいサンプル。 参考Urls オフィシャルドキュメント SpriteKit | Apple Developer Documentation About SpriteKit SpriteKitまとめ(ゲ…

Angular UI-Router v1さわる

環境は angular-ui-router 1.0.0-rc.1。 v0.3からMigrateした 新機能(uiCanExit, lazyLoadなど)も試したみた ドキュメント読んだ About About - UI-Router Core部分の実装をui-router-coreに分けた AngularJS (1.x), Angular (2.0+), Reactもいける UI-Rou…

webpackさわる

環境は webpack 2.2.1。 コード分割 アプリケーション用のjs (app.js)と、ライブラリをまとめたjs (vendor.js)を分割させたい場合。 webpack.optimize.CommonsChunkPluginを使えばおk オフィシャルドキュメント Code Splitting - Libraries [chunkhash]と[ha…

シェルスクリプトを利用して、tsファイルの先頭にimport文を差し込む

tsファイル内に文字列angularが存在する場合、ファイルの先頭にimport * as angular from 'angular;を追加。 # 改行コード LF=$'\\\x0A' # 結果を配列に files=(`find ./client/{app,components} -type f -name "*.ts" -print0 | xargs -0 grep "angular" -l…

GithubのLabel設定 Export, Import

Getting Started | GitHub Developer Guide Create an OAuth token 2段階認証をしている場合。 curl -i -u ${your_username} -H "X-GitHub-OTP: ${your_2fa_OTP_code}" -d '{"scopes": ["repo"], "note": "labels"}' https://api.github.com/authorizations …

テーブルとデータ

これは何か データテーブルを表示する場合、どのようなデータの型が利用しやすいか、について整理してみました。 参考にしたのは以下2つのライブラリ UI Grid DataTables | Table plug-in for jQuery DataTables examples - Ajax sourced data 例 以下のよう…

angular-translate読み直し

半年前にまとめたもの。こっちに転載。 これは何か 実際に仕事でi18n対応した時に調べたことのメモと設定例 https://angular-translate.github.io/docs/#/guide を読んで、必要そうな情報を逆引きっぽくまとめたもの 設定例 /*@ngInject*/ export function t…

タイピングの練習

最近はじめた。仕事の前のウォーミングアップにちょうどよかったりする。 Typing.lk - Learn and practice touch typing

webpack2にした

Migrating from v1 to v2 今の開発環境ではwebpackに任せているタスクが少ないため、かなり簡単に移行できた。 grunt-webpackを利用してるのでこれもv2に変更。 GitHub - webpack-contrib/grunt-webpack: integrate webpack into grunt build process webpac…

ユニットテスト(Karma)もTypeScriptで: karma-webpack編

以前の記事 ユニットテスト(Karma)もTypeScriptで - ryotah’s blog これだと、モジュールのimportができないねえ。 というわけでkarma-webpackを試そうと思います。 GitHub - webpack-contrib/karma-webpack: Use webpack with karma. テスト環境は Karma Ch…

npmパッケージで開発して公開

このビデオで基本的な流れがわかる。 www.youtube.com 利用したコマンドの一覧がまとまっているGistもある https://gist.github.com/rockbot/d62fbd256a12b54dac08c00b738e4158 npm link npm publish --access=public npm version minor など。 より詳細な話…

VS CodeにTypeScript用のエクステンションを追加

してみた。 globalに展開していたライブラリ群をimportにするために、importer系エクステンションを追加。 いくつか試してみて、追加したものは以下2つ。 TypeScript Importer - Visual Studio Marketplace TypeScript Hero - Visual Studio Marketplace 一…

ui-routerを読み直し

(1年前にまとめたもの。こっちに転載。最新のUI-Routerについては Angular UI-Router v1さわる - ryotah’s blog から) 動機 ui-router のこと、実はあまり把握していなかった Nested States & Views とか Multiple & Named Views とか一応使っているけどあ…

わいのスプレッドシート力

レベルが1つ上がった。 数式を利用しているセルの背景色を変更させる方法。 Google スプレッドシートの関数リストがあるのでそれを利用して、Conditional format rules(条件付き書式ルール)を設定すればいいらしい。

Swiftの勉強(3日目)

うなぎうまい。ひょうたん屋 6丁目店。

Swiftの勉強(2日目)

引き続きSwift。今日は昨日スキップしたシンタックスについて。 昨日のログ Swiftの勉強(1日目) - ryotah’s blog Part 2: Swiftのシンタックス 馴染みやすいです。軽く読んだだけである程度把握できる気がします。 とはいえ、タプル、オプショナル、関数の…

Swiftの勉強(1日目)

3日かけて詳細! Swift 3 iPhoneアプリ開発 入門ノート サポートサイトをやることにしました。 Flasherにはお馴染みと思われる、大重さんの本です。 計画 「Part 1: 概要」「Part 2: Swift シンタックス」「Part 3: 実践入門」という3部構成になっているので…

AngularJSコンポーネントのユニットテスト

よく忘れるので整理。 以下のようなFooComponentをテストする場合。 /** * 初期化されたらステータスをactiveにし、タイトルを描画する * タイトル下部に外部から渡されたテキストを描画する */ class FooController { private active: boolean = false; /*@…

bundlerとCocoaPodsすら知らない

bundler gemを管理するツール 自身もgem Gemfileを使う Gemfileはpackage.jsonのようなもの CocoaPods iOSのパッケージを管理するツール これもgem Podfileを使う Podfileはpackage.jsonのようなもの このようなプロジェクトファイルが既にある場合、 ├── Ge…

Swiftの勉強

はじめるわ

HTML Element の幅と高さ、座標。

幅と高さ Determining the dimensions of elements | MDN HTMLElement.offsetWidth content + padding + boarder + scrollbar Element.clientWidth content + padding Element.scrollWidth element のコンテンツの幅か、element 自身の幅(clientWidth)のう…

Promiseの配列を順に処理

reduceを使い新しいpromiseを作成していく。 const tasks = [ () => $q(resolve => doneAsync(resolve)), () => $q(resolve => doneAsync(resolve)) ]; function doneAsync(resolve) { setTimeout(() => resolve(), 1000); } tasks.reduce((promise, task) =…

背景(領域外)をクリックしたら閉じる、とか

ドロップダウンなどを表示したときに、領域外をクリックしたら閉じたい。 HTMLだと、どのように実装するのが一般的なのかわからなかったのでAngularのUI Bootstrapを参考にしてみたよ。 Dropdown documentにイベントハンドラを登録。 // https://github.com/…

Angularを1.5から1.6に移行

1.5.6から1.6.1に移行。参考にしたのは Angular 1.6 is here, this is what you need to know https://docs.angularjs.org/guide/migration#migrating-from-1-5-to-1-6 など。 対応箇所 $onInit 初期化のロジックが変更。(bindingsされた変数がconstructor内…

CircleCIのChromeを最新版に

Chromeのバージョンが低いため、E2Eが失敗してしまう。 Linux Package Signing Keysをインストールしてsudo apt-get --only-upgrade install google-chrome-stableで解決。 Update Chrome in container image - Feature Requests - CircleCI Community Discu…

ユニットテスト(Karma)もTypeScriptで

別記事 -> ユニットテスト(Karma)もTypeScriptで: karma-webpack編 - ryotah’s blog preprocessorsに追加すればいいだけだった。 GitHub - sergeyt/karma-typescript-preprocessor: TypeScript preprocessor for karma-runner // karma.conf.js module.expor…

test