- Angularをチーム開発で始める時に知っておくとよいことをまとめます。 - 複数案件でAngularを触ってきて、個人的に参考になったものを記載していきます。
概要 今回はNestJS上でgRPCサーバーを作成したサンプルです。 gRPCについては以下のページを参照 grpc.io NestJSのgRPCの説明記事 docs.nestjs.com
概要 Visual Studio Code の拡張機能「Remote - Containers」で Docker Compose を使用した場合の設定方法を記載します。 code.visualstudio.com marketplace.visualstudio.com Remote - Containers でDockerfile使った場合の設定方法は以下の記事を参照 kak…
概要 今回はNestJS上でBullを使ってみたサンプルです。 docs.nestjs.com BullとはRedisベースのメッセージキューです。 github.com
概要 Visual Studio Code の拡張機能「Remote - Containers」を使ってみました。 Docker上で開発環境を構築するため、ホストPCに余計なインストール作業をせずに済むので便利です。 また、ターミナル上からコンテナ上の操作が簡単に出来るので便利です。 こ…
概要 Visual Studio Code で普段利用している拡張機能ご紹介です。 今回は Local History です。 ファイルの変更内容をソース管理を使用せずに履歴として管理できます。 marketplace.visualstudio.com
概要 Developers Summit 2020 に参加してきました。 今回は「ともにつくる」をテーマに開催されました。 今回は２日目の午後２セッションのみ参加しました。 event.shoeisha.jp codezine.jp
概要 Angular 9 のバージョンアップ内容で気になった箇所をピックアップしていきたいと思います。 基本的にはIvyがメインのリリースになります。 blog.angular.io
目次 目次 概要 前提知識 試した環境 作業の前に 手順 1. HDDが空の第二世代仮想マシンを作成する 2. 第一世代のVHDXファイルをコピーする 3. コピーしたVHDXファイルをホストOSにマウントする 4. マウントしたVHDXのディスク番号を調べる 5. マウントしたVH…
概要 Visual Studio Code で普段利用している拡張機能ご紹介です。 今回は Error Lens です。 Visual Studio Code上のエディタ上にエラー・警告メッセージが表示されるようになります。 marketplace.visualstudio.com
概要 reflect-metadataでMethodDecoratorを実装するサンプルです。 メソッドにメタデータを定義するケースです。 www.npmjs.com 実装方針 MethodDecorator を定義する。 上記のMethodDecoratorをメソッドに指定したクラスを定義する。 上記のクラスからMetho…
概要 Custom providers で文字列を指定したサンプルです。 Moduleのprovidersに { provide: 文字列キー, useClass: サービスクラス } で定義します。 定義したサービスはModuleRefを使用してContoller内部で生成します。 docs.nestjs.com docs.nestjs.com
概要 Visual Studio Code の TSLint拡張機能と eslint-plugin-prettier を使用してソースコードを自動フォーマットすることが出来ます。 各種設定や使用ライブラリ等を記載します。 marketplace.visualstudio.com github.com TSLintの自動フォーマットについ…
概要 C#/WPF では INotifyDataErrorInfoとDataAnnotations を使用した入力バリデーションが存在します。今回はそれをAngular版にしてみました。 今回はclass-validator + Angular + TypeScriptで実現します。 INotifyDataErrorInfo実装サンプル github.com
概要 TypeScript の resolveJsonModule オプションを使用することでJSONファイルから型の抽出・生成を行います。 TypeScript 2.9以降で使用できます。 www.typescriptlang.org
概要 .NET FrameworkやJavaなどプロジェクトで標準化を行った際に参考した書籍を紹介。 対象の本 .NETのクラスライブラリ設計 開発チーム直伝の設計原則,コーディング標準,パターン作者: Krzysztof Cwalina,Brad Abrams出版社/メーカー: 日経BP発売日: 2016/…
目次 目次 概要 パスエイリアス index.ts(バレル) 定数クラス 拡張メソッド 自動フォーマット（要VSCode） 概要 TypeScriptで生産性・保守性を上げる記事一覧を記載。 このサイトの過去記事より抜粋。 このあたりが一通り実装されているプロジェクトは自分が…
概要 Docker 上に MailHog を立ち上げて、そこに対してメールを送信するサンプルです。 メールは nodemailer を使用して送信します。 MailHog起動中は http://localhost:8025/ をブラウザで開くと送信メールの確認が出来ます。 実行環境 Node.js - 10.x Dock…
概要 Angular で HttpClient.get メソッド使用時にURLクエリパラメータを配列で渡す場合のサンプルです。 実装方針 HttpParams の生成時に fromObject で配列を指定する。
概要 Chrome拡張機能 の簡単なサンプルを作ってみたいと思います。 developer.chrome.com
概要 Visual Studio Code で普段利用している拡張機能ご紹介です。 今回は Jest Test Explorer です。 Visual Studio Code上のTest Explorer から Jest を実行できる機能です。 marketplace.visualstudio.com
目次 目次 概要 前提知識 公開手順 1. GitHub 上でアクセストークンを発行する 2. GitHub Package Registryへのログイン 3. Dockerfileのビルド 4. Dockerイメージの公開 5. 公開したパッケージの確認 6. 公開したパッケージを使用 公開したパッケージ ソー…
目次 目次 概要 前回の記事 手順 1. 前回記事の設定を行う 2. 公開したパッケージをインストールする yarnを使用する場合の注意 Integrity checked failedエラーが発生 Couldn't find package "パッケージ名" on the "npm" registry. エラー 概要 2019/10/22…
目次 目次 概要 前提知識 公開手順 1. GitHub上でアクセストークンを発行する 2. ~/.npmrc の編集 3. ローカルの .npmrc の編集 4. package.json の編集 5. npm publish の実行 6. 公開したパッケージの確認 公開したパッケージ ソース一式 参考URL 概要 201…
概要 NestJSでwebpack経由でdotenvを読み取る方法を記載する。 用途としてはローカル環境の場合、.envファイルから設定を読み取りたいときに使用する。
概要 Angular でルーティン後に自動で別サイトにリダイレクトするサンプルを作成する。 用途 ルーティング後にFormの内容をPOSTして別サイトにリダイレクトしたいケース POSTしたいデータについてをAngular内で取得して設定したいケース 実装方針 テンプレー…
概要 NestJSでTypeScriptのエイリアスを使用する方法を記載する。 NestJS CLI（6.9.x現在）ではTypeScriptのエイリアスを使用するとコンパイルエラーになります。 今回はNestJSのWebpackのコンパイル機能をカスタムしてTypeScriptのエイリアスを実現します。…
概要 Github Actions（2019/09/15現在のβ版）と SonarCloud を連携させたサンプルを作成する。 TSLint + Jest実行後に Github Actions上でSonarCloud Scan を実行して、SonarCloud側に保存する。 参考URL github.com github.com 参考過去記事 kakkoyakakko2.…
概要 Jest で jasmine.clock().mockDate() を使用するための拡張のサンプルです。 MockDate を使用して実現しています。 Date.now()・new Date()・moment() などの値が MockDate により上書きされます。 ちなみに Jestでは Jasmine記法でのテストコード実装…
概要 Jest 24.9 では jasmine.clock().mockDate のように Dateをテスト用に上書き機能がありません。 mockdate ライブラリを利用して jasmine.clock().mockDate() を代用できます。
