架空の営業管理システムを作ってもらう前提で、ChatGPTに要件定義をお願いしてみました。 実験として軽く試すレベルで始めてみたのですが、予想を超えるクオリティでしたので、一部始終を皆様にもご紹介します。 ChatGPTとのやりとり まず、ざっくりと必要な機能の洗い出しをお願いしてみました。 あっという間に必要な機能を網羅的にリストアップしてくれまた。私自身、SFA/CRMをいくつか触った経験がありますが、適切な内容だと思います。 中には、「データのインポート・エクスポート機能」のように、検討初期段階ではつい忘れそうな機能も含まれています。さらに頼んでもいないのにオススメの検討プロセスまで教えてくれました。気が利いてます。 機能ベースだと要件の妥当性が判断しにくく思ったので、画面ベースで要件定義してもらことにしました。 「図で教えて」とできないことをお願いしたところ、やんわり断りつつ、意図

クリエイターに出会ったり、もっとファンになったり、noteで創作をつづけたくなるようなイベントを開催する「noteイベント」。今回は「チャットAI使いこなし最前線」をテーマに、黎明期からチャットAIを活用しているnote CXOの深津貴之氏が登壇しました。こちらの記事では、ChatGPTユーザーの悩みを解決するプロンプトなどが語られました。 ChatGPTユーザーの悩みを解決するプロンプト 徳力基彦氏（以下、徳力）：まず今日はChatGPTの使い方をしっかり覚えていただきたいと思います。ここで「深津式汎用プロンプト」。 深津貴之氏（以下、深津）：僕は1個1個、個別の例を出すのはあんまり好きではないです。さっき言ったように原理原則を1個理解すれば、全部その原理原則から引っ張れる方向が好きですね。 なので今日も、細かいプロンプトを出すよりは、だいたいあなたの悩みのすべてを解決するプロンプトを1

Next.js, Prisma, GraphQL Code Generator で作るフルスタック Web アプリケーション おもにNext.js、Prisma、GraphQL Code Generatorを用いたWebアプリケーションの構築手法について解説した書籍となります。 上記技術に加えて、以下の技術も採用しています。 ・Tailwind CSS ・NextAuth.js ・Apollo GraphQL ・Prettier ・ESLint ・Vitest ・React Testing Library ・GitHub Actions モダンなWebアプリケーションの開発手法について興味がある方にオススメです。 1章 Next.jsのセットアップ 2章 Prismaのセットアップ 3章 GraphQL Code Generatorのセットアップ 4章 テストコードの追加 5章 本番環境へ

おもにNext.js、Prisma、GraphQL Code Generatorを用いたWebアプリケーションの構築手法について解説した書籍となります。 上記技術に加えて、以下の技術も採用しています。 ・Tailwind CSS ・NextAuth.js ・Apollo GraphQL ・Prettier ・ESLint ・Vitest ・React Testing Library ・GitHub Actions モダンなWebアプリケーションの開発手法について興味がある方にオススメです。 1章 Next.jsのセットアップ 2章 Prismaのセットアップ 3章 GraphQL Code Generatorのセットアップ 4章 テストコードの追加 5章 本番環境へのデプロイ 6章 次のステップ サポートページ：https://github.com/typebase-inc/nextjs-

バイバイ、Twitter。 これまでの人生で、最も長い 1 ヶ月が、終わりました1。 何度も何度も何度もやろうとして、やっぱりやめようと思って、結局やってこなかった SNS 断食を行い、先日 30 日が経過しました。 この記事では実際に SNS をやめてみて感じたことや、SNS をやめることのメリット・デメリットについて書いていきます。 SNS をやめるとは、具体的に 具体的な方法は以下の記事や動画を参考にアレンジしました。 SNS を 30 日やめた話、また悪い習慣としての依存と社会に抗体をつくる｜やおっち (Coachat🐢)｜ note 月 90 時間を取り戻すスマホ依存対策【デジタルミニマリズム】 - YouTube 実践した内容は以下の通りです。 各種 SNS のアプリをスマホから消す Twitter TikTok Facebook Instagram YouTube ← 重要

最近の Rails 関係の仕事内容 - r7kamura.com 最近の Rails 関係の仕事内容｜はっさんブログ｜ note を参考に、自分も書いてみます。 ここ最近は Nuxt.js を用いた開発の仕事をしており、新規機能開発や現行の機能の改修のほかに、開発体験をよくするためのタスクを消化していくことが多いです。 以下に、改善系のタスクで実際にどのような仕事をしてきたか雑にまとめてみます。 Nuxt.js のバージョンアップ TypeScript の導入 Vuex に型を付与 フロントエンドからの API 呼び出し方法の見直し 無駄なリクエストの削除 無駄なコンポーネントの削除 不要な layout ファイル の削除 エラーハンドリングの方法の見直し 監視ツールの導入 分析ツールの導入 sitemap の設置 フロントエンド開発のためのドキュメントの整備 無視されている ESLint

「JavaScript関数型プログラミング」を読んでいたら、意味がよく分からない用語が出てきたのでメモ。 jsstudy.hatenablog.com レンズ （p.48） レンズ（Lenses）と呼ばれる関数型のアプローチ レンズは、オブジェクトの変更を普遍的に一括管理する最良の選択肢です。 （純粋な）関数参照とも呼ばれるレンズは、状態を持つデータ型の属性を不変的にアクセスし操作できる関数型プログラミングのソリューションです。 レンズの内部的な動作はコピーオンライトに似ており、状態の管理と複製を適切に処理できる内部ストレージコンポーネントを利用しています。 しかし、レンズを自分で実装する必要はありません。 関数型JavaScriptライブラリRamdaの実装を利用できます。 JavaScriptでデータを可変ではなく不変で扱いたい場合、Ramda.jsという関数型ライブラリーのLensと

どうもこんにちは、@y_temp4です。 2020 年の 6 月末でちょうどフリーランスになって丸一年経過することになるので、備忘録としてエンジニアがフリーランスになった感想を書いておきます。 これからフリーランスになろうと思っている方や、フリーランスの生活が気になる方にとって参考になれば幸いです。 フリーランスの良かった点 働き方を選びやすい 興味のあるプロジェクトに参画しやすい お金 フリーランスになろうと思った経緯については過去に書いた「株式会社 ALIS を退職しました」という記事でも少し触れていますが、その理由の 1 つに「柔軟な働き方をしてみたかった」というものがあります。 結果として、自分はフリーランスになっている間はほぼリモート、かつ稼働も抑え気味（週 2~4 くらい）で過ごすことができました。時間にゆとりができたので、その分個人開発などに時間をあてています。最近は Any

私は font-family には総称ファミリを設定するべきだと前から思っていました. グローバルな空間で明朝体ではなくゴシック体を使うように設定するには とだけ指定するのが望ましく, 何かをごちゃごちゃ指定するべきではないと思っていました. 何故ならばユーザは表示したいフォントをそれぞれOSやブラウザに指定しているはずで, それを上書きしてしまうのは行儀が悪いからです. 総称ファミリであるsans-serifが設定されていればユーザはブラウザの設定などで自分の好きなフォントを設定することが出来ます. 自分自身ちゃんとブラウザのフォントは設定しているのに, webサイトの指定でfallback用にインストールしてあるフォントなどが使われると不快な思いをします. しかしこれまで私はbootstrapのデフォルトフォント設定に以下のような指定をしていました. $font-family-sans

こんにちは、@y_temp4 です！ 新卒で入社した ALIS を 2019 年 6 月末で退職したので、退職エントリを書くことにしました。 約 1 年 3 ヶ月、バイトも含めると 1 年 5 ヶ月くらい ALIS で働いていたことになります。 今後はフリーランスとして活動していくので、もしお仕事のご相談等がありましたら Twitter の DM 等でお声がけいただけますと幸いです！ ALIS って何？ ※すでにご存知の方は読み飛ばしてください。 ALIS はブロックチェーンを活用したソーシャルメディアです。2017 年 9 月に ICO で資金調達を行い、当時の時価で約 4.3 億円の調達に成功しました。 ALIS | 信頼できる記事と人々を明らかにする全く新しいソーシャルメディア ALIS は記事を書くことや、記事にいいねすることによって ALIS トークンを得られるという仕組みがあり

こんにちは、小林（@koba04）です。 本記事では、シングルページアプリケーション（以下、SPA）における状態管理について解説します。 GmailやTwitterは、SPAとして構築されている代表的なWebアプリケーションであり、スムーズなページ遷移をSPAによって実現しています。またElectronやPWA（Progressive Web Apps）の登場により、複雑なアプリケーションをWebの技術を使って構築する場面も増えてきました。 これらの複雑なアプリケーションにおいては、既存のページ単位での状態管理の考え方では対応が難しくなります。 そこで今回は、具体的なフレームワークも取り上げながら、Webフロントエンドにおける状態管理のアプローチについて紹介します。 フロントエンドでの状態管理の複雑化 ページの単位を超えた状態の保持 モデルとビューによる処理の分割 イベントの管理が複雑にな

…というものを最近考えていました。「画面デザインのOKももらったし、私の仕事は終わり！あとはエンジニアに指示書を渡すだけ」と一息ついた時にこそ、改めてデザインを見つめなおすべきです。 つよいUIであるための7つの視点 1.本来、そこにあるはずの情報がない場合はどうなりますか？ リストUIで載せる情報が0件、文章が空っぽ、画像がない時など 2.表示する要素が想定よりすごく多い/すごく少ない場合はどうなりますか？ 数字の桁数、文章の行数、文章が入りきれない場合は文中・文末のどこを省略すべきか…など 3.ユーザーさんの立場によって、表示要素に変化はありませんか？ ゲストとログインユーザー、無料会員と有料会員…など 4.ロード中、もしくはロードされるまで何が出ていますか？ 通信中の表示、読み込み中の画像エリア…など 5.予期せぬエラーが起こった時、画面はどうなりますか？ 通信エラー、リンク先のコン

ミニマリストなフリーランスエンジニアの雑記です。

Tips of how to understand the source code of big software projects

Wiresharkには、Wiresharkと同等の機能を持つCLIコマンドとしてtsharkが付属している。 tsharkではオプションとして-T fields -e <field> [-e <field> ...]を指定することで、指定したフィールドのデータをタブ区切りで出力することができる。 次の例では、dump.pcapというファイルから対象をHTTPのみに絞り込んだ上で、エポック秒、送信元・送信先のIPアドレス・TCPポート番号および各種HTTP情報を書き出す。 $ tshark -r dump.pcap -T fields -e frame.time_epoch -e ip.src -e tcp.srcport -e ip.dst -e tcp.dstport -e http.request.method -e http.request.uri -e http.host -e h

Facebook が出した誰でも簡単に時系列予測ができるツール Prophet についていくつか発表しました。 Prophet入門【Python編】 Prophet入門【R編】 Prophet入門【理論編】 Prophetはビジネス時系列、すなわち人間の行動に左右される時系列データに対する自動予測ツールです。 ビジネスでは大量の時系列データに対する予測を作成する必要があります。 しかし、それを1人のデータ分析者が1つ1つ作っていくのでは手が足りません。 そこで、統計の知識を必要しない、誰にでも簡単に時系列予測を行うツールとして Prophet が作成されました。 Prophet はオープンソースで開発され、Python と R のライブラリが公開されています。 まずは今年5月に Python版についての発表を foundIT データ解析・機械学習セミナー にて行いました。 Python版の

ドーモ、SREチームの湯谷(@yutannihilation)です。最近気になるモジュラーシンセはIntellijelです。 上司がいい感じのコマンドをつくるという記事を書いていましたが、いい感じのコマンドにはいい感じのタブ補完を付けたくなります。この記事ではBashのタブ補完を自作する方法を紹介します。 タブ補完の仕組み Bashのタブ補完自体はBashに組み込まれている仕組みです（参考：Bash Reference Manual - 8.6 Programmable Completion）。completeというBashの組み込み関数によって補完方法（compspec(completion specification)と言うらしいです）が規定されていて、これがタブなどによって起動されます。 タブ補完は、lsならファイル名、cdならディレクトリ名、というようにコマンドに応じたものが設定さ