開発覚書はてな版

個人的な開発関連の備忘録

【VSCode】Visual Studio Code v1.26 の気になる新機能

目次 目次 概要 Workbench関連 Breadcrumbs Run npm scripts from package.json View menu cleanup おわりに 概要 Visual Studio Code v1.26がリリースされましたね。 気になる新機能をピックアップして紹介します。 code.visualstudio.com

【Git】リモートへtagをpush

Git

概要 bitbucketなどではWebページ上でGitリポジトリのtagの付与が出来ないので、ローカルでtagを付与してリモートへの反映が必要です。また、ローカルでtagを追加した場合、通常のpushではtagはリモートブランチに反映されません。 git push時に--tagsを追加…

【TypeScript】Arrayをソートする拡張メソッドの実装 - その3

概要 下記の記事でArrayソート用の拡張メソッドを実装しました。 kakkoyakakko2.hatenablog.com kakkoyakakko2.hatenablog.com 今回は、ファンクションで変換した値でのソートに対応しようと思います。

【TypeScript】Arrayをソートする拡張メソッドの実装 - その2

概要 下記の記事でArrayソート用の拡張メソッドを実装しました。 kakkoyakakko2.hatenablog.com 今回は、第1キーは昇順、第2キーは降順のようなケースに対応したいと思います。 以下の内容で実装していきたいと思います。 引数にソートキーの他に昇順フラ…

【TypeScript】Arrayをソートする拡張メソッドの実装 - その1

概要 TypeScript(JavaScript)の標準のsortメソッドが使いにくいので、compare処理を内蔵した拡張メソッドを実装してみたいと思います。 以下の内容で実装したいと思います。 プリミティブ型配列の場合は通常のArray.sort()を実行する。 オブジェクト型配列の…

【VSCode】おすすめ拡張機能 - Bookmarks

概要 Visual Studio Code で普段利用している拡張機能ご紹介です。 今回はBookmarksです。 文字通りコード内のブックマークを保存していく機能です。 marketplace.visualstudio.com

【Angular】KeyValuePipe の使い方

概要 Angular 6.1.0になりKeyValuePipeが追加されました。 KeyValuePipeのサンプルを作ってみたいと思います。 以下はAngular 6.1をピックアップした記事です。 kakkoyakakko2.hatenablog.com

【Angular】Angular 6.1.0リリース

概要 Angular 6.1.0がリリースされましたね。マイナーバージョンチェンジなのであまり大きな変更はありませんが、気になった箇所をピックアップしていきます。 blog.angular.io github.com

【イベント参加】Developers Summit 2018 Summerに参加してきました

概要 Developers Summit 2018 Summerに参加してきました。 今回はデータ・AI・クラウド関連の話が聞けました。 event.shoeisha.jp 全体的な感想 DWHは通常のDB設計とは異なる方法での設計が必要であり、そのノウハウを聞けてよかった。 自然言語処理やChat…

【RxJS】empty, NEVER, throwError の挙動

概要 RxJSでempty, NEVER, throwError の挙動にはまったのでメモ書き。 ReactiveX - Empty, Never, and Throw operators

【VSCode】おすすめ拡張機能 - GitLens

概要 Visual Studio Code で普段利用している拡張機能ご紹介です。 今回はGitLensです。Gitを利用している場合にとても便利です。 ※GitLens Version 8.5時点の情報です。 marketplace.visualstudio.com

【Angular】Angular Seed から Angular CLI へ移行(ビルド・テスト編)

概要 Angular SeedというGulpを利用して独自にビルド環境を構築しているプロジェクトがあります。その環境をAngular CLIに移行する際のメモ等を記載していきます。 今回はビルドとテストの移行を記載します。 詳細は以下のプロジェクトをご確認ください。 gi…

【VSCode】ワークスペースのTypeScriptのバージョンを使用

概要 Visual Studio Codeの各ワークスペースのTypeScriptバージョンを指定して使用する。

【イベント参加】HTML5 APP CONFERENCE 2018に参加してきました

概要 HTML5 APP CONFERENCE 2018に参加してきました。 PWA・ハイブリッドアプリ等のHTML5関連技術の話しがメインでした。 html5app-conf.connpass.com 全体的な感想 Ionicの導入事例が聞けて個人的にはよかった。(Ionic2での開発経験があるため) Ionic チー…

【VSCode】Visual Studio Code v1.25 の気になる新機能

目次 目次 概要 Workbench関連 Grid editor layout Outline view Portable Mode 拡張関連 New default view for Extensions view Preview機能 New Settings editor 終わりに 概要 Visual Studio Code v1.25がリリースされましたね。 気になる新機能をピック…

【Node.js】dependenciesでよく使うバージョン指定

概要 Node.jsのpackage.jsonのバージョン指定でよく使う設定について記載。

【Node.js】dependenciesでGitやファイルパスを指定する

概要 Node.jsのpackage.jsonでdependenciesにGitリポジトリやファイルパスの指定方法を記載。

【Angular】@Componentの設定あれこれ

概要 Angularの@Componentの設定関連をメモ。

【TypeScript】拡張メソッドの実装(ライブラリ・外部モジュール編)

概要 TypeScriptで基本型でなく、他のライブラリで定義されているクラスに対して拡張メソッドを実装する方法を記載します。 declare module 'ライブラリの拡張対象のクラスが記載されているファイル'で定義後は基本型の拡張方法と同じです。 サンプルソース…

【Angular】HttpClientでstatusCodeを取得する

概要 Angular 4以降で登場したHttpClientでは特に指定がない場合はJSON型の戻り値を扱います。 以前のHttpモジュールのようにHttpレスポンスのステータスコードを扱いたい場合は、引数に{ observe: 'response' }の指定が必要になります。 get処理については…

【Angular】HttpInterceptorの実行順序

概要 HttpInterceptorを複数登録した場合の実行順序は以下の通りです。 リクエストはproviders登録の昇順、レスポンスはproviders登録の降順に実行されます。 AInterceptor, BInterceptorの順で登録した場合、 Aのリクエスト前処理 Bのリクエスト前処理 Bの…

【Angular】HttpInterceptorの実装(レスポンス内容確認)

概要 以前紹介したAngularのHttpInterceptorでレスポンス内容を確認することも出来ます。 今回はそのサンプルソースをのせておきます。 kakkoyakakko2.hatenablog.com

【HTTP】ブラウザ毎のOriginヘッダー付与の違い(2018年6月現在)

概要 HTTPリクエストでOriginヘッダーが設定されるケースが異なるためまとめてみました。

【イベント参加】ng-japan2018に参加してきました

概要 ng-japan 2018に参加してきました。 ngjapan.org 基本的には6.0の新機能をベースに話があったり、導入・開発の事例の話があったりしました。 以下に感想等を記載していきます。 全体的な感想 build環境が成熟してきた。(ng add/ng update) Angular ivy…

【VSCode】Chromeデバッグ起動設定

概要 Visual Studio Code から Chrome デバッグ接続が可能です。 Debugguer for Chrome拡張機能を利用することでデバッグできます。 ただし、デバッグ前にChromeの起動引数に--remote-debugging-port=9222の設定が必要です。 このあたりの設定やまわりへの周…

【TypeScript】拡張メソッドの実装(基本型)

概要 declare global + interface で追加したいメソッドを追加後、prototypeにメソッドを追加します。 拡張メソッドを利用したい場合は、importをすることで利用できます。 詳細についてはサンプルソースを確認。 ちなみに拡張メソッドは他の開発言語でもあ…

【VSCode】Visual Studio Code v1.24 の気になる新機能

目次 目次 概要 TypeScript関連 Update import paths when a file is moved or renamed Highlight unused variables and imports Generate getter/setter refactoring Preview機能 Outline view New Settings editor 終わりに 概要 Visual Studio Code v1.24…

【Angular CLI・Karma】JUnit形式のテスト結果を出力する

概要 Angular CLI利用時にKarmaでのテスト実行時にテスト結果をJUnit形式で出力する方法です。 なぜJUnit形式でテスト結果を出力するかというとJenkins等でテスト結果を取り込むのにJUnit形式だと簡単に出来るからです。 今回利用するツールはkarma-junit-re…

【Jasmine】テストを失敗させる

概要 Jasmineで特定ケースの場合、テストを失敗させたい場合はfailメソッドまたはdone.failを使用します。 PromiseやRxJS等でrejectやthrowErrorを発生させるテストの場合、正常に動作してしまう場合がテスト失敗なため、failメソッド等で明示してあげるとテ…

【Jasmine】Promiseのテスト方法

概要 JasmineでのPromiseをテスト時にはテスト定義の引数にdoneを利用します。 doneを利用することで、非同期処理完了後まで待機してくれます。 doneを設定しない場合は、Promise.then内の処理をスルーしてテストを終了するため、正常なテスト結果がでない場…