mongoose の model と schema に TypeScript で型をつける - Qiita
Migration mongoose models and schemas from JavaScript to TypeScript 今年は自宅にこもりがちになって腰椎椎間板ヘルニアと坐骨神経痛のコンボを決めた @algas です。 この記事は TypeScript Advent Calendar 2020 の1日目の記事として作成しました。 記事に登場するコードは github リポジトリで公開しています。 https://github.com/algas/typed-mongoose-example 概要 mongoose という mongoDB の Node.js では有名なライブラリを使うアプリケーションコードを JavaScript から TypeScript に移行する作業を行いました。 JavaScript で定義済みの mongoose のモデルとスキーマに「正しく」型を
GKEノードをオートスケールさせる方法は2つある？ - Qiita
オートスケールの注意点 ノード自動プロビジョニングにてImagePullBackOff ノード自動プロビジョニングにてスケールアウトした際、スケールアウトしたNode上のPodでImagePullBackOffエラーが発生しました。 これは、IDのデフォルトの設定を行っていないことが原因でした。 新しいノードプールは、他のノードプールから ID を継承しません。デフォルトの ID を指定しないと、自動プロビジョニングされたノードプールで実行されるワークロードは Google Cloud APIs に一切アクセスできません。たとえば、コンテナ イメージを非公開の Container Registry から pull するには、https://www.googleapis.com/auth/devstorage.read_only スコープを追加する必要があります。 対応としては、以下のような
オニオンアーキテクチャとは何か - Qiita
概要 オニオンアーキテクチャはJeffrey Palermo氏により考案されたアーキテクチャパターンである。伝統的な階層化アーキテクチャとオブジェクト指向の考え方を踏襲しつつ、これまでよりも保守性、テスト容易性、依存性の点で優れたアプリケーションを構築することを目的としている。本記事ではこのオニオンアーキテクチャとは何かについてPalermo氏の記事を参考にして考察する。 前提となる知識 オニオンアーキテクチャを理解する上で前提となるいくつかの知識を挙げる。 オブジェクト指向 オニオンアーキテクチャはオブジェクト指向を前提としたアーキテクチャである。 階層化アーキテクチャ オニオンアーキテクチャは多層アーキテクチャを利用している。 依存性逆転の原則 オニオンアーキテクチャでは依存性逆転の原則がオブジェクトのモデリングに利用されている。 ドメイン駆動設計 Entity, Repository
先取りVue 3.x !! Composition API を試してみる - Qiita
Vue.js v3.xのRFC（Request for Comments） となっているComposition API を色々触ってみたのでまとめます。 Vue Composition API とは？ Introducing the Composition API: a set of additive, function-based APIs that allow flexible composition of component logic とある通り、コンポーネントのロジックの柔軟なコンポジションを可能にする関数ベースのAPIです。 型推論の改善と、合成関数によるロジックの整理が可能になっています。 @vue/composition-apiを追加することで、Vue2系でも使用することができます。 環境構築 vue-cli でプロジェクトを作成します。 ポイントはManually sel
アーキテクチャの「なぜ？」を記録する！ADRってなんぞや？ - Qiita
5月のThoughtWorksのTechnology RadarでもADOPTされたADRという手法について、面白かったので、ざっくり自分なりに調べたメモです。 Technology Radarでは以下のように述べられています。 多くのドキュメントは、読みやすいコードとテストに置き換えることができます。しかし、進化的アーキテクチャでは、将来のチームメンバーの利益と外部の監督のために、特定の設計上の決定を記録することが重要です。Lightweight Architecture Decision Recordsは、重要なアーキテクチャー決定を、そのコンテキストおよび結果と共に取り込むための技法です。これらの詳細は、WikiやWebサイトではなくソース管理に格納することをお勧めします。そうすれば、コードと同期したままのレコードを提供できるからです。ほとんどのプロジェクトでは、この手法を使いたくな
styled-components（CSS in JS）をやめた理由と、不完全なCSS Modulesを愛する方法 - Qiita
styled-components 画像は styled-components ツライっていう顔です。 Angularのようにスタイリングまで面倒を見てくれるUIフレームワークならまだしも、Reactの場合はコンポーネントのスタイリング方法も自身で選択しなければいけません。CSSのスタイリング方法/設計はいくつか存在しますが、どれも一長一短で、やはり銀の弾丸は存在しません。スタイリング方法を選択可能なUIフレームワークは、この混沌とした選択肢の中から価値を見出す必要があるわけです。 僕はBEMによる人力CSS管理（Sass/Less/Stylus）から、 { fontSize: 14 } のようなJSオブジェクト形式のCSS in JS、 styled-components のようなTemplate Stringsを利用したCSS in JS、そしてCSS Modulesまで幅広く公私とも
未経験から7日間でコーダーとして現場投入させるまでのカリキュラムを忘れないようにメモっとく - Qiita
エンジニア不足と言われて久しいですが、できる経験者を採用するのはますます難しくなっていますね。 そんななか、弊社ではひょんな縁からエンジニア未経験の新人をエンジニアとして採用することになりました。未経験とはいえ、弱小企業の弊社には悠長に育てている余裕がないため、7日間で現場投入を目指してカリキュラムを組みました。 だいたいうまくいったので、メモがわりに晒しておきます。 前提条件 誰でも7日間でエンジニアになれると言っているわけではありません。あくまで一例として捉えていただければ幸いです。 担当してもらう予定の領域 HTML/CSS コーディング JavaScript はそこそこで（動きのエフェクトやカルーセルを仕込める程度） concrete5 テーマの開発（PHPファイルに foreach を入れていくイメージ、WordPress と変わらない） 流石にアプリケーション開発で7日間は無理
Githubの2段階認証を実施してgitコマンドが使えないときにやったこと - Qiita
Githubの2段階認証を実施してやったこと Githubの2段階認証(Two-Factor Authentication)とは？ まずは2段階認証の説明など Github上のアカウントのセキュリティ向上のために、パスワードによるログインだけでなく2段階目の認証を追加出来る 2段階認証の設定方法 細かい設定については記載しないが、まずはGithubのサイトにログインし、アカウントの設定画面から設定可能 (https://github.com/settings/profile) 設定項目の「Security」から設定可能 gitコマンドでの利用 2段階認証とgitコマンド 素朴な疑問として、gitコマンドで2段階認証ってどうするの？というところがある 対策としては Personal access tokens を利用すべし Personal access tokens 2段階認証を設定してい
【Vue 2.x】Vueコンストラクタ関数をWebコンソール上で見つける方法 - Qiita
Vue コンストラクタ関数とは？ Vue.js 2.x 系を webpack などのバンドラと共に使用している方にとっては、この Vue のことです: <script> タグを貼り付けるだけのいわゆる「CDN版」の Vue.js を利用している場合は window.Vue で簡単に Vue コンストラクタ関数を参照できますが、バンドラを用いてビルドされている場合においても Vue コンストラクタ関数を参照できる方法を紹介します。 動作環境 Vue.js 2.6.11 などの Vue.js 2.x 系 Chrome 80 Vue.js devtools 5.3.3 Vue コンストラクタ関数の参照を得る方法 以下のスクリプトをWebコンソール上で実行することで、Vue コンストラクタ関数を参照することができます: const Vue = (() => { const el = [].find
テストダブルの種類 - Qiita
スタブとモックの違いというのを書いたのですが、書いているとき「テストダブル」という用語についてよく知らないまま書いていました。それをコメントで指摘され、改めて調べてみました。 5種類のテストダブル テストスタブ 実際の依存コンポーネントにかわりテスト対象に間接入力を行うもの。そのテスト内では間接入力の値を確定できる。 RSpecでいう allow(hoge).to revceive(:fuga).and_return('foo') テストスパイ テスト対象が他のコンポーネントに間接出力を行う場合、実際のコンポーネントの代わりにメッセージを受け取り記録するもの。モックとの違いは事前に期待する値を知っていて、一致しているかどうか検証を行うかどうか。 RSpecでいうと expect(hoge).to have_received(:fuga) モックオブジェクト テスト対象が他のコンポーネントに
ChromeでUserAgentが凍結される日（User Agent Client Hintsの使い方） - Qiita
追記（2020-05-06） この記事は2020-02-10に執筆しましたが、その後急速に拡大したCOVID19の影響でスケジュールが変更になっています。現在判明しているリリーススケジュールは以下の通りです。 2021年まで従来通りのUser-Agent文字列が利用できる User Agent Client Hintsについては7月14日に安定版としてリリースされる予定のChromeバージョン84に導入予定 参考) https://groups.google.com/a/chromium.org/forum/#!msg/blink-dev/-2JIRNMWJ7s/u-YzXjZ8BAAJ (@devneko 様、ご指摘ありがとうございました！) UserAgentがGoogle Chromeで使えなくなる 「Google Chrome」の開発チームは1月14日、User-Agent文字列を
User-Agent Client Hints(UA-CH)を取得する - Qiita
Googleがユーザーエージェント（UA）文字列を凍結・非推奨するということで、 代替として仕様策定中のUser-Agent Client Hints(UA-CH)を今のうちに試してみます。 User-Agent Client Hints(UA-CH）とは Google ChromeがUserAgent文字列の非推奨・凍結を計画したことにより、 将来的に、UserAgent文字列から、ブラウザのバージョンなどの情報が正確に取得することが出来なくなってしまう。 代替手段として、User-Agent Client Hintsの機能が検討中であり、Google Chromeでは実験的な機能として試すことができる。 従来のUserAgent文字列と同じようにHTTPリクエストヘッダーやJavascriptを使って情報を取得することが可能です。 User-Agent Client Hints(UA-
【eslint-plugin-vue】Vue.js 3.xサポートを始めました - Qiita
Vue.js 3.x用に追加されたルールセット （上でも書きましたが）Vue.js 3.x用に下記のルールセットが利用できるようになりました。 plugin:vue/vue3-essential plugin:vue/vue3-strongly-recommended plugin:vue/vue3-recommended 下のルールセットの方が有効になるルールが多いです。 Vue.js 3.x用に追加された検証ルール 詳細はリリースノートを参照してください。 vuejs/eslint-plugin-vue - Release v7.0.0 vue/no-deprecated-filter このルールはフィルターの使用を禁止します。 Vue.js 2.xまで使用できたフィルターですが、Vue.js 3.xでは廃止されます。（詳細はRFC0015を参照してください。） このルールでVue.j
textlint と VS Code で始める文章校正 - Qiita
はじめに 文章を書くときに、注意して半角文字の両端に半角空白を空けるという手動 lint をよくやっています。 また、日本語の表現や句読点、typo などに注意を払うことも必要です。 そこで、機械的に検出できた方が内容を書くことに集中できるので文章の lint ができる textlint というツールを使っていきます。 同様の検査ツールとして RedPen が存在します。 以下の記事に RedPen と textlint それぞれの立場から文章における問題とその解決についてまとまっているので参考になります。 文書執筆の指南書で解説されている問題点を RedPen で発見する - Qiita 文書執筆の指南書で解説されている問題点を textlint で発見する - Qiita 今回は、リポジトリ内で管理する Markdown ファイルに対して、Visual Studio Code(VS C
ZOZOSUITのサーバーをPythonからScalaで実装し直してコストを下げた話 - Qiita
TL;DR ZOZOSUITで計測したデータを扱うサーバーは、元々Pythonで実装していた それをScalaで実装し直した 結果、レイテンシにおけるパフォーマンスが向上した さらに、リソース面におけるサーバーコストも削減できた 技術選定における背景 ここ数年、機械学習の文脈やサービスの立ち上げ期のプロトタイプ実装のため、Webアプリケーションの分野においてもPythonが選択されることは本当によく聞かれるようになりました。 事実、難しいビジネス要求や急な仕様変更への柔軟な対応においては、比較的実装コストの低い言語やフレームワークを選択するメリットはとても大きいと言えます。 利用できるすべての変数やメソッドの型をプログラムの実行中に決めなければならない場合、ランタイムのオーバーヘッドは甚大になります。静的型付け言語では、そのオーバーヘッドが不要になります。Python、Perl、Rubyと
Webpack5 alpha の近況をのぞいてみた - Qiita
こんばんわ！クリスマスもあと残りわずか、ギリギリのポストです！ LOB Advent Calendar もこれが最終日でございます。 昨日は @cheung-chifung による まだClean Architectureで消耗しているの? でした。 ここまで今年のアドベントカレンダーに協力してくれたエンジニアチームに全力で感謝をしつつ、 2018 年ラストの記事をお届けします。 そろそろ Webpack 5 でるっぽいよ ぶっちゃけ（歴史的経緯とか）そんなに詳しいわけじゃないんですけど今回はフロントエンドでバリバリやってるエビバディがお世話になっているであろう Webpack ネタでございます。 それなりのものを犠牲にした結果、爆速なビルドを実現した Parcel の登場もつかの間、 60-90 % 級のパフォーマンス改善( Parcel 関係なく予定されてたらごめんなさい)を実現した
webpack 5 の webpack federation という概念について - Qiita
注意: まだHEADにすらマージされていない機能です。 僕の現状の理解で書いてます。細かいニュアンスは見落としてるかも。 今の課題 異なるチームで、異なるビルドプロセスのものを統合するような巨大なフロントエンド、いわゆるマイクロなフロントエンドやってると、同じようなライブラリが内部的に重複するよね webpack build (chunk) 間で、そういう自明なもののを重複を省いたり、一方向ではなく、相互に読み出せるようにしたいよね ScriptedAlchemy氏の提案 異なるWebpackビルド同士が連携する、Federation という概念を作る。 Host と Remote という概念を追加する。既存のものは Host となる(?)。 Remote は、それぞれに要求する chunk (react, vue など)と、他に外側に提供するインターフェースを明示する。 (optimaz
PRPL パターン実装の具体例調査と比較 - Qiita
PRPL パターンとは Google I/O 2016 で提案されたものですが、詳しくはこちらの記事がとても分かりやすいです。 上の記事から一部を以下に引用します。 PRPL は、Progressive Web App（PWA）を構築および配信するためのパターンで、アプリの配信と起動時のパフォーマンスに重点を置いています。 PRPL は次の言葉を表しています。 Push: 最初の URL ルートに不可欠なリソースを Push（プッシュ）する。 Render: 最初のルートを Render（レンダリング）する。 Pre-cache: 残りのルートを Pre-cache（事前キャッシュ）する。 Lazy-load: オンデマンドで残りのルートを Lazy-load（遅延読み込み）する。 少しだけ補足すると、ここでいう Push というのは、 HTTP/2 Push を指します。 例えば JS
VS Code1.25の新機能 - アウトラインビュー - Qiita
Visual Studio Code 1.25の新機能・アウトラインビュー IDEでよくあるアウトライン表示機能が追加された。ファイルエクスプローラーのビューの１つとしてデフォルトで表示され、アクティブなエディタのアウトラインが表示される。 ソート順は位置、名前、種類が指定できる。 アウトラインの要素をクリックするとその項にジャンプする、逆にエディタのカーソル位置をアウトラインに追従させることもできる。 キーワードを入力して該当要素をハイライトしたりフィルタングしたりできる。 設定でアイコンの表示/非表示、エラーや警告の表示方法を変更できる。 Register as a new user and use Qiita more conveniently You get articles that match your needsYou can efficiently read back us
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IT業界で耳にするGAとは - Qiita
