開発覚書はてな版

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

2019-01-01から1年間の記事一覧

【NestJS】NestJSで遊んでみる

概要 NestJSで遊んでみたので、遊んでみた感想やメモなどを記載していきます。 nestjs.com github.com

【VSCode】おすすめ拡張機能 - Swagger Viewer

概要 Visual Studio Code で普段利用している拡張機能ご紹介です。 今回はSwagger Viewerです。 Visual Studio Code上でSwagger Editorを使用できる機能です。 marketplace.visualstudio.com

【npm・yarn】キャッシュフォルダの変更

概要 npm や yarn でパッケージをインストールする場合、キャッシュフォルダ内にインストールしたパッケージをキャッシュします。 HDD/SSDが複数接続している時など、容量の大きい方にキャッシュフォルダを移動したいケースがあります。 以下に npm と yarn …

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

目次 目次 概要 Editor関連 Hover and Problems panel peek improvements Debugging関連 Font configuration for Debug Console Debug Console text wrapping 概要 Visual Studio Code v1.32がリリースされましたね。 恒例の気になる新機能をピックアップし…

【Angular】optionタグで文字以外をvalueに設定する

概要 Angular の <option> への値設定で通常は value を使用します。 value に値を設定した場合は、変更後の値が文字列で設定されます。 ngValue に値を設定することで、文字列以外の値を扱えるようになります。 angular.io</option>

【雑談】開発時の考え方など

目次 目次 概要 開発の優先順位 コーディングスタイル 設計・開発のスタイル オープンソース活動・Githubについて 使用技術の選定 新技術について 行動パターン あとがき 概要 たまにですが、開発時にどういうことを注意しているかや何故Githubでソースコー…

【Jasmine】スパイ関数が実行されたかを確認する

概要 expect(mySpy).toHaveBeenCalled() を使用することでスパイ関数が実行されたかを確認できる。 また、 expect(mySpy).toHaveBeenCalledWith(args) でスパイ関数実行時に渡された引数の確認もできる。 スパイ関数に戻り値が必要な場合、spyOn().and.retur…

【Angular】Componentテスト(クラス・DOM)

概要 Angular のComponentテストではクラスをテストする場合とDOMをテストする場合で、TestBed.configureTestingModule の設定方法が変わってきます。 設定方法や使い分けについて記載します。 angular.jp

【VSCode】TSLintを使用してコードを自動フォーマットする

概要 Visual Studio Code の TSLint拡張機能と tslint-plugin-prettier を使用してソースコードを自動フォーマットすることが出来ます。 各種設定や使用ライブラリ等を記載します。 marketplace.visualstudio.com github.com

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

概要 Developers Summit 2019 に参加してきました。 今回は「SHARE YOUR FUN!」をテーマに開催されました。 テクノロジーは楽しいもの。そういうテーマで色々なセッションが開催されました。 相変わらずフルで参加出来ず、2日とも午後のみの参加になってお…

【SonarQube】SonarQube on Docker で TypeScript の品質チェック

概要 SonarQube + Docker(Docker Compose)でTypeScriptのソースコードの品質チェックを行う場合の設定方法などを記載します。 www.sonarqube.org

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

目次 目次 概要 Workbench関連 Improved keyboard navigation Hierarchical Select All Cut command in Explorer context menu Integrated Terminal Reflow support 概要 Visual Studio Code v1.31がリリースされましたね。 恒例の気になる新機能をピックア…

【Jest】JestをVSCodeでデバッグする

概要 Visual Studio CodeでJestをデバッグするための設定を記載します。 基本的には以下のURLの通りです。 github.com

【Jest】AngularでJestを使用する

概要 Angular で Jest を使用してユニットテストを実行するサンプルを作成しました。 jestjs.io github.com

【雑談】1万アクセス達成

概要 まさかブログ開設1年以内で1万アクセス突破するとは・・・ 記事内容が記事内容なだけに平日のアクセスがやっぱり多いですね。 仕事の参考になっていれば幸いです。 記事のスタンス的には基本的にはつまづきやすいところのメモとして記事を書ければな…

【Hyper-V】仮想環境内にDockerをインストール

概要 Hyper-Vの仮想環境内にDockerをインストールしても通常では動作しません。 ホストOS側で Nested Virtualization (入れ子になった仮想化) 設定を予めしておく必要があります。 docs.microsoft.com

【Angular】ngModel に拡張メソッドを実装する

概要 Angular の ngModel 使用時にHTML側で頻繁に touched or dirty の判定を使用するケースがあります。 面倒なので拡張メソッド化してみたいと思います。 基本的には以下の記事と同様に拡張できます。 kakkoyakakko2.hatenablog.com

【TypeScript】パスのエイリアスの設定方法

概要 TypeScript利用時に自作のファイルのディレクトリ階層が深くなっていくと import文を相対パスで記載するのがつらくなってきます。 そういう場合、tsconfig.json の compilerOptions.paths を設定することでパスのエイリアスを設定することができ、impor…

【Angular】TrackByFunction内でthisを使用する

概要 以前の記事で ngFor の trackBy についての記事を記述しました。 kakkoyakakko2.hatenablog.com TrackByFunction内の this は DefaultIterableDiffer になります。 定義元のコンポーネントを this としたい場合は TrackByFunction を返すメソッドを作成…

【TypeScript】index.ts(バレル)の使い方

概要 TypeScript利用時に毎回ファイル単位でimportするのは面倒ですね。 そういう場合、index.tsに対象ディレクトリのファイルをまとめて export しておくと便利です。 また、index.ts の場合、./ディレクトリ/index ではなく ./ディレクトリ と記載すること…