リファクタリング | Yuuniworks Note
const performanceCalculatorFactory = ({ contextData, calcAmount, calcVolumeDiscount }) => () => ({ getAmount: () => { const defaultAmount = contextData.price * 100; if (calcAmount) { return calcAmount(defaultAmount); } return defaultAmount; }, getVolumeDiscount: () => { const defaultVolumeDiscount = contextData.price * 200; if (calcAmount) { return calcVolumeDiscount(defaultVolumeDiscount); } retu
AutoDev｜AI エンジニア「Devin」に驚いていたら、もう Microsoft が「AI駆動開発」ツールを用意し始めてたって話 - Qiita
AutoDev｜AI エンジニア「Devin」に驚いていたら、もう Microsoft が「AI駆動開発」ツールを用意し始めてたって話ポエムAI 概要 まず、本記事の背景ですが、本記事を書く数日前に、「Devin AI｜話題の世界初 "完全自律型" AIエンジニア「Devin」の公開内容の全訳」 という記事を書きました。 ありがたいことに、フォロワーも少ないのに記事公開後のたった３日間程で 1万超の閲覧（View） をいただけました（YouTube の解説動画も公開3日目で１万回再生を突破しました）。 「AI の進化もすごいし、みんなのアンテナもすごいなぁ」という思いに浸りながら、ふと海外の AI 界隈の記事を漁ってたら、なんと 「Microsoft が自律型 AI ソフトウェア開発ツールを作ってるらしい」 という記事を発見しました。「ツール」と呼ぶよりは、「ソリューション」の方が近いので
全エンジニアが知っておくべきGithubレポジトリTop28【2023最新版】 - Qiita
この記事はNuco Advent Calendar 2023の18日目の記事です。 はじめに 本記事ではGithubレポジトリTop28を紹介します！ Githubレポジトリは日々の業務や学習に役立てることが可能です。必要な機能や学習教材は、無料で利用出来る高機能なものがあるのなら積極的に利用して役立てるべきです。 以下の内容に分けて合計28個のGithubレポジトリを紹介します！ 開発用Githubレポジトリ 学習用Githubレポジトリ QOL高めのエンジニアとして日常を過ごしたい方は参考にしてください！ 弊社Nucoでは、他にも様々なお役立ち記事を公開しています。よかったら、Organizationのページも覗いてみてください。 また、Nucoでは一緒に働く仲間も募集しています！興味をお持ちいただける方は、こちらまで。
ちゃんと名前で呼べますか？UIコンポーネントの名称クイズ100問【初級編】｜Goodpatch Blog グッドパッチブログ
こんにちは！Goodpatch UIデザイナーのharuです。突然ですが、皆さんはUIデザインの超基本となる「コンポーネント」についてどれぐらい知っていますか？ ユーザーインターフェースを構成するパーツのことを「コンポーネント」といいます。分かりやすい例としては、アクションや遷移のトリガーとなるボタンなどがあります。UIデザイナーは日々、ありとあらゆるUIコンポーネントを「用法用量（原則的な使い方）」に沿って使いこなしながら、デザインに取り組んでいます。 そこでこの記事では、UIデザインを学んだり興味を持っているみなさんに向けて、バラエティに富んだUIコンポーネントをクイズ形式で紹介します。用意した数はなんと100種類（！）。初級・中級・上級に分けて全3回でお届けしていきます。 まずは初級編。ソフトウェアデザインに関わる人たちの共通言語ともいえる、最も基本的なコンポーネントを集めました。
JavaScriptメソッドチェーン完全解説！使い方、注意点、カスタマイズ10選
※Japanシーモアは、常に解説内容のわかりやすさや記事の品質に注力しております。不具合、分かりにくい説明や不適切な表現、動かないコードなど気になることがございましたら、記事の品質向上の為にお問い合わせフォームにてご共有いただけますと幸いです。 (送信された情報は、プライバシーポリシーのもと、厳正に取扱い、処分させていただきます。) はじめにこの記事を読めば、JavaScriptのメソッドチェーンを使いこなすことができるようになります。 メソッドチェーンは、コードを簡潔で読みやすくするための便利なテクニックです。 しかし、使い方や注意点を把握していないと、思わぬエラーやバグの原因になります。 この記事では、初心者でも分かりやすいように、メソッドチェーンの基本から応用例、注意点、カスタマイズ方法までを10個のサンプルコードで徹底解説します。 ●JavaScriptのメソッドチェーンとはメソッ
あなたの開発生産性を爆上げする、エンジニア向けAIツール22個｜苦しんでプログラミングを学んだ柴犬（くるしば）
こんにちは。くるしばです。 元々コンサルタントの仕事をしていましたが、独学でプログラミングを学習し、Webサービスを作って起業しました。 その後個人で開発したサービスを売却したり、また別のIT系の会社を創業、経営したりしています。 去年の8月から下記のTwitterにてプログラミング学習に関して発信し始め、ありがたいことに13000人以上の方々にフォローして頂きました。 プログラミング初心者に絶対覚えてほしい、ググる時の効率が10倍上がるコツ pic.twitter.com/hK1ZhNavwh — くるしば | 読めば10倍効率が上がるプログラミング学習の教科書 (@shiba_program) September 13, 2022
Astro でレスポンシブイメージを実装する | grip on minds
Astro 2.x から 3.0 へアップグレードした際に、レスポンシブイメージは対応していないため、ビルトインされている <Image /> コンポーネントの導入は見合わせることにしました。 しかし、本サイトのブログ記事において、パフォーマンスのボトルネックとなっているのは画像ファイルです。また、別のプロジェクトで Astro を使用するときにも、この課題に向き合わなければなりません。 そのため、この記事では Astro でレスポンシブイメージを実装する方法を考えていきます。 以降、Astro の getImage() 関数でレスポンシブイメージを実装する方法を解説していますが、問題点も見つかりました。特に、ホスティングサービス側でビルドする場合には注意が必要です。 本記事における Astro のバージョンは 3.1.4 を前提としています。 まず、候補として挙がるのは「Astro Im
GitHub Copilotを使いこなしてプログラミングの生産性を上げる大切なコツ｜erukiti
皆さんはGitHub Copilotを使っていますか？VSCodeやIDEに拡張を入れると、生成AIとペアプロのようなことができるという、アレです。 最近はこれがないと仕事ができない。なかった時代を思い出せないという人が増えています。プログラミングの生産性に明確に差が生まれます。僕もその口です。 ただ、GitHub Copilotを使いこなせていないという話も度々聞きます。Copilotが提案してくれるコードが微妙で役に立たないというような感じです。 その差はどこにあるのか？を知りたくて6/24に試しにCopilotを使った動画を撮ってみました。実践的なCopilot実演動画というのはすごく珍しいらしく、GitHub dockyardというコミュニティの竣工イベントに登壇してみないか？というお声がけをいただいたので、8/5にGitHub Copilotを使いこなせるとどうなるのかというライ
【TypeScript】カリー化・部分適用は便利だよ！ - Qiita
【TypeScript】カリー化・部分適用は便利だよ！ カリー化・部分適用利用してますか？ 調べたけど「関数を第一級オブジェクトとしてー」とか「関数を部分適用してー」とか説明が講義っぽくて途中で諦めた方も多いと思います。自分もそうでした。 また、知ってるけどどんな時に使うべきか迷って使ってないという方もいると思います。 具体的なコードを交えながら、カリー化・部分適用について、噛み砕いて説明していきたいと思います。 なお、すべてのTypeScriptのサンプルコードは実際に動かして確認することができますので、TypeScript Playgroundなどで是非お試しください。 カリー化と部分適用 まずはカリー化と部分適用の定義をば。 カリー化 (currying, カリー化された=curried) とは、複数の引数をとる関数を、引数が「もとの関数の最初の引数」で戻り値が「もとの関数の残りの引
【初心者向け】JavaScriptのbindって何？？を理解する(call, appyも一緒) | アールエフェクト
この文書を読んでいるということはJavaScriptの初心者の方でbindメソッドがどのようなものか理解しようとしている人、bindとthisとの関係がわからないという人またはthis自体の理解が曖昧な人ではないでしょうか。特にthisの理解が曖昧な人は多いと思うのでこの機会にしっかりと学んでおきましょう。 bindを学ぶ前にbindとは何かまずMDN Web Docsに記述されている内容を確認してみましょう。 bindメソッドが理解できていない時は上記の説明を読んでも何を言っているのかわからないと思います。今意味がわからなくてもbindはthisと関係していること、bindを利用することである関数から新しい関数を作成することができることの2つを頭に入れて下記の文書を読み進めていけば最終的には上記の意味が掴めるかと思います。bind、thisを説明する際に抽象的でわかりにくい単語が使われて
【JavaScript】高階関数 – 関数を引数、戻り値として扱う関数
高階関数の基本的な操作 先ほども触れましたが、「関数を引数、戻り値として扱う関数」を高階関数と呼びます。 ここでは高階関数を使った基本的なコードを扱います。 各種の計算をまとめた巨大なまとまった関数を作って結果を得ることもできますが、良いやり方とは言えません。それぞれの各種計算を行う関数を作って、それらの結果を渡して最終的に利用する関数を作ります。 ここでは配列データと用意して、それを使って計算をする関数を作ります。 次のようにコードを書いてみます。 var years = [1970, 1960, 1935, 2001, 1988]; function arrayCalc(arr, fn) { var arrRes = []; for (var i = 0; i < arr.length; i++) { arrRes.push(fn(arr[i])); } return arrRes;
Webクリエイターの為の情報サイト | Web Programming Portal
みなさまどうもおはこんばんにちは。 さて続きまして、呼びだされたタイミングのカレントオブジェクトを参照できる『this』(ディス)ってやつについて色々とやっていきたいと思います。 これ、めっちゃ便利なのでバッチリ使い方を覚えてしまいましょう。そんでもって『this』を使わないと構築できない処理も存在してたりしてなかったりするので結構必須項目のような感じになってます。 あと他の言語でも『this』のような仕組みは用意されていたりするのでございますが、JavaScriptの『this』の挙動はちょっと特殊かもしれません。なので他の言語、特にクラスベースな概念で設計がされている言語に精通している方は混乱してしまわないように要注意でございます。 というわけでやっていきましょう。とりあえずの『this』の使い方はこんな感じです。 this; 普通に『this』って記述するだけでOKです。オブジェクト
【徹底解説】これからのエンジニアの必携スキル、プロンプトエンジニアリングの手引「Prompt Engineering Guide」を読んでまとめてみた | DevelopersIO
【徹底解説】これからのエンジニアの必携スキル、プロンプトエンジニアリングの手引「Prompt Engineering Guide」を読んでまとめてみた こんにちは。CX 事業本部 Delivery 部のきんじょーです。 ここのところChatGPT と戯れてアプリを作ったり、様々なプロンプトの検証をしていましたが、言語モデルの性能を最大限に引き出すために、体系的にプロンプトエンジニアリングを学びたいと考えていました。 GitHub に「Prompt Engineering Guide」という素晴らしいリポジトリがあったので、読んで検証した内容をブログにまとめていきます。 本記事は、執筆時点の上記リポジトリの内容を元にしていますが、意訳や独自に検証した日本語のプロンプトを含みます。 上記リポジトリも絶賛開発中の段階のため、最新情報や原文が気になる方はリポジトリを直接参照してください。 目次 プ
TypeScriptではじめるChatGPT API：入門から一歩進んだテクニックまで - Uzabase for Engineers
NewsPicks エンジニアの中村です。普段はデータ基盤や機械学習システムの開発、運用をやっています。 さて皆さん、すでにChatGPTは使っていらっしゃるでしょうか。エンジニア、非エンジニアを問わず世の中を席巻している感のある ChatGPT ですが、今月初めにいよいよ API も公開されて、アプリケーションやサービスに組み込みたいと考えている方も多いのではないでしょうか1。 というわけで、弊社でもこの新しい技術をより多くのエンジニアに使いこなせるようになってもらいたいと考え、ChatGPT API に関する社内勉強会を先日開催しました。本記事ではこの勉強会の内容を再構成してお届けします。 とりあえず使うだけなら簡単な ChatGPT ですが、本記事では、長文を扱ったり、ChatGPT と外部のシステムを連携させたりするテクニックなど、知っている人はすでに知っているが、まだそれほど広く
「良いコード」を書くために意識している17のTips まとめ
この記事について 私はWeb基盤を提供している企業でWebアプリケーションエンジニアをしています。 インフラや顧客基盤など複数のバックエンドAPIが動いており、それらを結合したアグリゲーション（BFF）の作成とフロントエンドの実装を担当することが多いです。 言語はTypeScriptとC#を選択する事が多く、フロントエンドではReact.jsとVue.jsを使用しています。これらをコンテキストとして私が「良いコード」を書くために日頃意識しているTipsを投稿していきます。 やらないこと インデントを揃える、命名基礎、アクセス修飾子などの基礎的な内容は割愛しています。 コードはTypeScriptで書いています。ですが特定の言語に特化した内容にはしていません。 プログミング全般に掛かかった内容であり、フロントエンドやバックエンドなど特定のレイヤーに特化した内容にはしていません。 良いコードと
Gitにおけるブランチ戦略について調べてみた - Qiita
なんとなく使っているGitブランチ、みんなどうやって管理しているのだろう？ その謎を解明すべく、我々はジャングルの奥地へと向かった。 1.ブランチとは Git上で別々の作業を並行して行うための仕組みをブランチという。 # testing-branchという名前のブランチを作る場合 $ git branch testing-branch # testing-branchブランチで作業する場合 $ git checkout testing-branch そもそも、ブランチっていつ使うのよ？SVNでいーじゃん！ などと思っていた時代がわたしにもありました。 SVNなどの中央集権リポジトリを利用していると、自分のコミットがどうやっても他人に影響を及ぼしてしまいます。 （コミットしたら、Aさんが修正したソースが壊れましたとかね） 自分のソースをマージして挙動確認したい！でも他の人には迷惑かけたくない
【必ず確認するべし】開発・学習で役立つGitHubリポジトリ 10選
はじめに 今回の記事では、私たちプログラマーが開発や学習を進める中で必ず確認しておくべきGitHubリポジトリを20紹介する。今回の記事の対象は主に以下の通り。 開発・学習に必要な情報を収集しているプログラマー GitHubを開発・学習の参考にしたいプログラマー 情報収集の方法がわからないプログラマー freeCodeCamp 世界最大規模のプログラミングメディアであるfreeCodeCampのGitHubリポジトリ。扱う内容はWeb開発、モバイルアプリ開発やデータサイエンスなど非常に幅広い。特にPythonやReact、Node.js、Flutterを実務で扱うプログラマーは必見。 最大の特徴はGitHubリポジトリの名前にあるように完全無料で学べることだ。初心者から上級者まで毎日確認するべきGitHubリポジトリ。 free-programming-books ネット上にあるすべての無
JavaScriptのデザインパターンについて
どうもoreoです。 今回はモダンなJavaScript開発環境で役立つデザインパターンを紹介します。 この記事は、JavaScript Patterns WorkshopとPatterns.devを参考にしています。 有名な「Java言語で学ぶデザインパターン入門」などでは、古典的な23個のデザインパターンが紹介されていますが、JavaScript Patterns WorkshopではPatterns.devをベースとして、モダンなJavaScriptにおける6つのデザインパターンについて言及されています。この記事ではそれらについてまとめてみたいと思います！ ※本記事中のコードは、JavaScript Patterns WorkshopとPatterns.devから引用させていただいております。 1 Design Patternsとは？ デザインパターンとは、ソフトウェア開発で繰り返し
JavaScriptとオブジェクト指向プログラミング | POSTD
本稿は、オブジェクト指向プログラミング（OOP）について予備知識のないJavaScriptの学習者向けに書かれています。OOP の中でJavaScriptに関連する部分にのみ焦点を当て、OOPの概要については説明しません。ポリモーフィズムについては、静的型付け言語の方が適しているため省きます。 なぜOOPを知る必要があるか？ あなたは初めてのプログラム言語にJavaScriptを選びましたか？ あなたはコードが10万行以上にわたる巨大企業のシステムを扱う腕利きの開発者になりたいですか？ オブジェクト指向プログラミングを最大限活用できるように学ばなければ、到底無理でしょう。 様々な考え方 サッカーでは、安全に守りを固めることもできますし、サイドからの高いボールに飛びつくこともできます。また、先など考えずに攻撃することも可能です。これらの戦略は全て同じ目的を持っています。それは試合に勝つことで
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
フロントエンドのデザインパターン
