はてなブックマーク

参考: 循環的複雑度 ちなみに githubで最もやべー関数を発掘するという記事では、循環的複雑度が高い関数が紹介されています。 ものによってはリンク切れしてしまっていますが、最も複雑度が高いのはnode(JavaScript)のjo関数で5505だそうです。想像もつかない... どのようにすれば循環的複雑度を低く抑えられるのか? 計算方法から考えると、forやifによる分岐を減らしていくことが必要となります。 そのために、分岐の入るロジックを別関数として切り出し、1つの関数でやる事を絞り、分離することを理想として目指していきます。 とはいえ、いちいち複雑度の計算なんてしていられないですね。 そこで役に立つのが次のVSCode拡張機能です。 Code Metrics (VSCode拡張機能) この拡張機能は、TypeScriptやJavaScriptの関数・メソッドに循環的複雑度を表示して

概要 弊社で開発中のプロダクトは、ドメイン駆動設計とクリーンアーキテクチャを組み合わせた設計となっています。 これまでフロントエンドの開発を担当することが多かった中で、golangでのAPI開発を担当した際に、「この処理はRepositoryに書くべき?」「Usecaseにこの処理を書いたら責務を持たせすぎ?」「Domain ServiceとUsecaseはどう分ける?」など迷うことが多々ありました。 そこで、これら設計に関する考え方を整理するために具体的な実装を踏まえてこの記事を書いています。 この後、インフラストラクチャ層・プレゼンテーション層は別の記事として書く予定です。 第2回の記事はこちらです。↓ DDD(ドメイン駆動設計)とは ドメインの専門家からの入力に従ってドメインに一致するようにソフトウェアをモデル化することに焦点を当てるソフトウェア設計手法である。 ドメイン駆動設計 下

Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

概要 先日投稿した記事のようにStorybookを触ってみたらとても良かったので、実際に弊社のプロジェクトにStorybookを導入してみました。 現在私が開発に携わっているVideo Kicksでは、Atomic Designを採用しています。 その中でもまずは、コンポーネント増減が少なくstorybook関連ファイルのメンテナンスコストが低いatomsに対して導入し、 様子を見つつStoryを随時追加していくことを目標とします。 この記事では、Storybook導入の中で詰まったポイントと解決方法を紹介します。 Storybookそのものの紹介はしないので、それが知りたい場合は、Storybookを触ってみたらとても良かったまたは、公式ドキュメントをご確認ください。 作業環境 Vue.js・・・3.2.31 storybook/vue3・・・6.5.16 etc.. ディレクトリ構成

背景 今後開発していくプロダクト内ではエディタを組み込む必要があり、その中では文字色変更やルビを振るなどリッチなテキストエディタとしての要件があります。 リッチなテキストエディタを実現する方法の一つとしてmarkdownが挙げられます。 これはエンジニアには馴染みがありますが、一般ユーザーが記法を覚えるにはハードルが高く利用を諦めてしまう恐れがありました。 そこで、より直感的に操作することができるwysiwygを取り入れることとなりました。 wysiwyg(ウィジウィグ)とは コンピュータのUIに関する用語で、ディスプレイの表示と処理内容が一致するように表現する技術のことを指し、 What You See Is What You Get(見たままが得られる)の頭文字を取ったもの。 前提となる使用技術 Typescript React(またはVue) 基本的にはReactでの実装を前提に調査

概要 [2022年決定版] Vue3 x Typescriptによるアプリケーションづくりでは、<script setup>構文が使用されています。 一方、Vue.js公式ドキュメントのサンプルコードでは使用されていない箇所がほとんどです。 混乱しそうになったので、<script setup>に関して調査してみました。 結論 <script setup>とは? <script setup> は単一ファイルコンポーネント(SFC)内で Composition API を使用するコンパイル時のシンタックスシュガー(糖衣構文)です。 糖衣構文とは、読み書きのしやすさのために導入される構文です。通常よりシンプルで分かりやく記述できるというメリットがあります。 実際にソースコードを比較してみましょう。 また、他にも以下のような利点がありますが、こちらは後ほど解説します。 SFC と Composit