【図解】メールの仕組み
いいね : 93
メールの仕組みは、SMTPによる送信、DNSによる宛先メールサーバーの特定、POP/IMAPによる受信という流れで構成されています。メールアドレスは「名前@ドメイン」形式で、SMTPはメール転送プロトコルとして機能し、DNSは宛先ドメインのMXレコードを検索します。POP3とIMAPは受信プロトコルで、POP3は単一デバイス向け、IMAPは複数デバイスでの利用に適しています。セキュリティ向上のため、TLS/SSLによる通信経路の暗号化や、S/MIME, PGPによるエンドツーエンド暗号化も利用可能です。
（ほぼ）同じスキルセットでも働き方が劇的に変わった1年を振り返る
いいね : 59
エンジニアがWHIへ転職して1年を振り返った記事です。前職(SIerの2次請け)と現職(自社開発)での働き方の違いに焦点を当てています。
- 働き方: 基本出社からフルリモートへ移行し、不規則な勤務が減少。
- 開発環境: Microsoft Office中心からGoogle Workspace + Slackへ。タスク管理もExcelからRedmine等のツールへ変化し、GitHub Copilotの活用やCI/CDの充実など開発者体験が向上。
- 裁量とドキュメント: メンバーの裁量が大きくなり、製品企画から関わる機会が増加。設計書等のドキュメントは少ないが、テストはしっかり実施。
-
組織文化: 個人の発信が活発で、QiitaやSlackのtimesなどを通じてチームを超えたコミュニケーションが促進。
これらの変化から、入社前に仕事内容の解像度を上げることの重要性を述べています。
実務未経験エンジニアがLaravel&ReactでWebアプリケーション開発に挑戦してみた！（要件定義・設計編）
いいね : 27
タグ : web, laravel, 入門, react, 未経験エンジニア
実務未経験エンジニアがLaravel & ReactでWebアプリケーション開発に挑戦する様子を記録する記事の第一弾。今回は開発の準備段階として、要件定義と設計に焦点を当てています。
まず、ChatGPTと対話して「研究室のレビューアプリ」という開発テーマを決定し、要件定義書を作成しました。次に、Webアプリケーションの画面設計図であるワイヤーフレームをdiagrams.netで作成。最後に、データベース設計としてER図を作成し、アプリケーションに必要なデータをどのように保存するかを定義しました。次回は環境構築について解説予定です。
Cursor入門のツボ
いいね : 16
タグ : coding, ai, vscode, cursor
Cursorは、VScodeユーザーでAIコーディングをしている人向けのIDEです。VScodeとほぼ同じ使い心地で、AIコーディング機能が統合されています。ChatGPT/ClaudeのAPIキーを利用でき、AIサービス利用料込みのプランも選択可能です。
導入は容易で、日本語での応答設定やAIエージェントによるコード生成、部分修正が可能です。ドキュメントを読み込ませることでコード生成精度を向上させることもできます。
プログラミングは「設計」か「量産」か？～誤解を解き、エンジニアが目指す真の効率化～
いいね : 17
タグ : プログラミング, 設計, 自動化, 開発プロセス, 生産性向上
プログラミングは単純な量産ではなく、思考と創造を伴う「設計」である。重要なのは、将来の変更への対応や品質を左右する見えない部分の設計。
エンジニアは設計を工夫し、ルール化や自動化を進めることで「賢い量産」を目指せる。
生成AIなどの技術を活用し、開発プロセスを効率化し、本質的な業務に集中することが重要。
ビジネス側は短期的な開発量だけでなく、長期的な品質や保守性を理解する必要がある。
Config 2025を終えて 個人的な活かし方の展望と悩み
いいね : 21
タグ : イベントレポート, figma, config2025
Config 2025に参加した筆者が、Figmaの新機能をQiitaでの業務にどう活かせるか展望を述べています。特にGridによるtable要素の置き換え、Figma Siteでのイベントページ作成、Figma Buzzによるバナー制作の効率化に期待しています。一方で、Figmaの全機能を使いこなせる人材育成の難しさ、どこまでを求めるべきかという課題も提示。職域やキャリアに応じたスキルの線引きが必要かもしれないと考察しています。
初めて MCP を使うなら Docker MCP Toolkit がおすすめ
いいね : 17
タグ : docker, ai, vscode, mcp, cline
Docker MCP Toolkitは、Docker Desktopの新機能で、MCPツールの利用を容易にします。2025/5/10時点で109のMCPサーバが利用可能です。利用手順は、ExtensionsからDocker MCP Toolkitをインストールし、利用したいMCPサーバを有効化、ClineなどのMCPクライアントに設定を追記します。各MCPサーバの設定内容はREADMEに記載されています。Fetch MCP Serverを例に設定例が紹介されています。
AWS Managed Microsoft ADを作成した後すぐにやるべき設定まとめ
いいね : 6
タグ : aws, activedirectory, directoryservice, msad
AWS Managed Microsoft ADは便利なサービスだが、初期設定を怠ると運用で躓きやすい。まず、AD Connectorを使用しない場合は、VPC DNS解決設定を確認し、ADドメインに向けられているか確認する。次に、AD Trustの設定を行い、既存のオンプレミスADとの連携をスムーズにする。最後に、グループポリシーオブジェクト(GPO)の設定を行い、セキュリティポリシーやソフトウェア配布などを管理する。これらの設定を最初に行うことで、AWS Managed Microsoft ADをより効果的に活用できる。
ローカルPCで動くTTSで自作ゲームをフルボイス化する
いいね : 4
ローカルPCで動作するTTS(Tsukasa_Speech)を用いて自作ゲームをフルボイス化する試み。GPTを活用してセリフ抽出、音声合成、リップシンクを実現。React/ThreeJSのアップデートや画面の色合い調整も実施。課題として、漢字の読み間違いやイントネーションの不自然さ、感情表現の難しさが挙げられるが、個人で楽しむには十分なレベル。
ミュージシャン、料理、エンジニア。人生経験で得た、何かを学ぶ上で大事なこと3点
いいね : 24
筆者の経験から、何かを学ぶ上で重要なことは3つ。
- 基礎を大事にすること。共通点を見出す作業であり、抽象的な理解から始める。
- とりあえず1つに集中すること。複数の選択肢に迷わず、1つを徹底的にやり切ることで脳を慣らす。
- 解像度を上げること。基礎ができたら数をこなし、視野を広げる。好きな嫌いをなくし、理論も学ぶ。
これらを繰り返し実践することで、上達への道が開ける。努力の本質は変わらず「地道が近道」であり、10000時間の法則も意識すると良い。
初めて OSS に PR を出してみた話 ～2度にわたる挑戦～
いいね : 7
タグ : python, git, github, pullrequest, oss
OSSへの貢献として、python3未対応のcocostuffapiを修正しPRを出すまでの過程がまとめられています。PRの手順は、(1)オリジナルリポジトリをfork、(2)ローカル環境で修正・コミット、(3)フォークしたリポジトリにpush、(4)GitHubでPR作成、となっています。具体的な作業として、forkの仕方(リポジトリをコピー)が画像付きで解説されています。
秘書1人と自分が3人ほしいので、AIで10人錬成してみた。
いいね : 6
タグ : ai, エンジニア, chatgpt, chatgptなどの活用方法を発信しよう！
本記事は、AI技術の進化を背景に、エンジニアが「時間」や「分身」を求めてAI秘書を開発する試みを紹介しています。有料のAI秘書サービスがあるものの、手軽さを求めてchatGPTのプロジェクト機能に着目。プロジェクトごとに「相談相手」を設定し、AI秘書的な活用を目指しています。chatGPTに目的を伝え、その準備を支援してもらうというアプローチが特徴です。
AWS完全初心者がAWS-SAAに合格した話
いいね : 6
AWS完全初心者の筆者がAWS-SAAに合格するまでの道のりを解説。合格に4ヶ月を要したが、一発合格。当初は参考書学習とノート作成に注力したが、範囲の膨大さから挫折。その後、Udemyの問題集に取り組むも難易度が高すぎた。AWS学習コミュニティJAWSUGへの参加を機に、勉強仲間ができ、ハンズオン学習を取り入れたことで学習が楽しくなった。最終的にはCloudTechの問題集を解き続け、730点で合格。
picoCTF SSTI
いいね : 3
picoCTFのSSTI問題を解説。まず、入力欄で計算が成り立つか確認し、Server Side Template Injectionの情報を基に、テンプレートエンジンがJinja2であることを特定。次に、Jinja2のSSTIに関する情報を参考に、OSコマンドを実行するコードを試す。最終的に、cat flagコマンドを実行してflagを取得する。
【強化学習】拡散モデルで世界モデルを作ったDIAMONDを解説・実装
いいね : 2
タグ : python, 機械学習, 強化学習, simpledistributedrl
DIAMONDは、強化学習におけるWorld Modelの最新手法で、拡散モデルを応用しています。従来の離散表現における情報欠落を、拡散モデルの生成能力で補完します。POMDP環境を前提とし、過去の観測と行動履歴から次の状態を予測。拡散世界モデルは、ノイズ除去により状態を生成し、報酬と終了はCNN+LSTMでモデル化され、クロスエントロピー損失で学習されます。
【学習】駆け出しエンジニアがWeb Audio API音を鳴らす仕組みの実装をしてみた
いいね : 2
タグ : javascript, api, 学習
駆け出しエンジニアがWeb Audio APIを使って音を鳴らす仕組みを実装した記事。Web Audio APIは便利な機能であり、記事内では参考サイトとしてMDN Web Docsなどを紹介。jsfiddle等のサイトでコードを試すことも推奨。ボタンを押すと音が再生される簡単な実装例が示されている。
ポスト一覧取得次にいいね判定で Exists, OuterRefを使う方法
いいね : 3
Xクローンアプリ開発で、投稿一覧取得時に「いいね」されているかを判定する方法を紹介。annotate、Exists、OuterRefを組み合わせることで実現。Existsで外部参照(OuterRef)の存在確認を行い、投稿テーブルに「いいね」情報をアノテーションとして付与。これにより、効率的に「いいね」状態を判定した投稿一覧を取得できる。具体的なモデル定義とクエリ例が示されている。
AWS Amplifyで令和に個人サイト（平成の思い出を込めて）
いいね : 2
30代の筆者が、交流のきっかけとしてAWS AmplifyとVue.jsを用いて個人サイトを構築した。構築の流れは、環境構築、ドメイン取得(お名前.comで0円)、AWS Amplify設定(Github連携、デプロイ対象ブランチ、ビルドコマンド)、お名前.com設定(ネームサーバ設定)、修正・動作確認。AWS Amplifyは、設定したブランチへのpushで自動デプロイ、SSL証明書発行も自動で行う。今後はコンテンツ追加や背景設定を予定している。
日本語プログラミング言語Mindの小技 「複写」～スタックトップの値を２つにする～
いいね : 2
タグ : mind, 日本語プログラミング, 日本語プログラミング言語
日本語プログラミング言語Mindの小技「複写」は、スタックトップの値を複製し、同じデータに対して異なる処理を施すための機能です。これはMind言語の特徴であり、スタック操作を効率化します。「複写」はスタックから値をPOPし、同じ値を2回PUSHすることで実現されます。主に同じデータに対して異なる処理を行いたい場合に有用で、ローカル変数への代入と同様の効果を持ちつつ、より簡潔かつ軽量な記述が可能です。対応バージョンはMind7, Mind8, Mind9のWindows版です。
QGISで土地利用図を可視化する
いいね : 2
タグ : qgis
この記事は、QGISを用いて土地利用図を可視化するための作業メモです。
- まず、QGISを公式ダウンロードサイトから自身の環境に合わせてインストールします。WindowsユーザーにはLTR版が推奨されています。
- 次に、国土数値情報ダウンロードサイトから、見たいエリアの土地利用データ（今回は土地利用細分メッシュ2021年度版）をダウンロードします。
- データの年度やメッシュの粗密は、用途に合わせて選択することが重要です。
Pydantic AIで作る！AIエージェントによるじゃんけんバトル 🤖✂️📄🪨
いいね : 6
タグ : python, じゃんけん, aiエージェント, pydantic-ai
この記事では、Pydantic AIライブラリを用いて、AIエージェントにじゃんけんをさせるシステムを構築する試みを紹介しています。複数のAIエージェント（じゃんけんプレイヤーと審判）を協調動作させ、勝敗を判定します。Pydantic AIを使用する利点として、LLMとのやり取りの構造化、型安全な出力、エージェント管理の容易さ、エージェント間の情報伝達の簡潔さが挙げられています。環境構築として、必要なライブラリのインストール手順も示されています。
Cursor for Students に 登録 してみた。
いいね : 2
タグ : エディタ, ai, 登録, cursor, students
学生向けCursorの登録手順の紹介記事。
- Cursorの学生版ページでアカウントを作成(GitHub連携も可能)。
- Pro版へのアップグレードを選択し、決済手段と住所を登録(学生は1年間無料)。
- Cursorをダウンロード後、Applicationsにインストールし起動。
- VSCodeからの設定インポートも可能。
- プライバシー設定でコード学習を禁止することで、プライベートなコーディングが可能。
【未経験→IT転職】アラサーが1年で資格7個取った話
いいね : 2
タグ : java, oracle, ポエム, 資格, 未経験エンジニア
IT未経験のアラサーが1年で7つのIT資格を取得した体験談。転職後、平日は3～4時間、休日は7～12時間勉強し、Java Silver, ITIL, LPIC-1, Security+, Oracle DBA Silver/Gold, 基本情報技術者試験に合格。資格取得の秘訣は、情報収集、試験日を先に決める、最後まで諦めないこと。特にOracle DBA Goldは3回目で合格。今後はJava Gold, 応用情報技術者、AWS関連資格の取得を目指し、医療系システム開発に貢献したいと考えている。
GPT-4.1 vs Claude 3.7 Sonnet vs Gemini 2.5 Pro on Roo Code
いいね : 2
タグ : claude3.7sonnet, roocode, gemini2.5pro, gpt-4.1
OpenAI、Anthropic、Googleの最新モデル（GPT-4.1、Claude 3.7 Sonnet、Gemini 2.5 Pro）のコード生成性能を、Roo Codeを用いて比較検証した。
単語帳管理アプリの作成を指示し、React、TypeScript、Python、MySQL、Docker等の技術要素を指定し、曖昧な指示から高品質なアプリケーションを生成できるかを評価した。
具体的な画面要件、機能要件、その他（Docker Compose、保守性、デザイン）も指示した。
RubyKaigi 2025に初出展！たくさんの“出会い”があった3日間を振り返って
いいね : 12
タグ : rubykaigi, 採用, カンファレンス・勉強会メモ, rubykaigi2025
withはRubyKaigi 2025に初出展し、多くの出会いがありました。ブースではRubyとのマッチ度診断やガチャガチャ抽選会などの企画を実施し、参加者との自然なコミュニケーションを促進しました。特に、ユーザーから直接感謝の言葉を受けたり、技術的な関心を持たれたりしたことが印象的でした。今回の出展を通して、技術面での認知度向上と、チームの一体感が増したことを実感し、来年のRubyKaigiへの参加も検討しています。
出退勤打刻漏れを防ごう！
いいね : 8
社内での出退勤打刻漏れが多発し、人事部の負担が増加している。そこで、一般社員でも導入可能な範囲で、打刻漏れを防ぐ仕組みを考案。有料ツール導入不可、管理者権限不要、API使用不可、短時間での実装という制約下で、PC起動・シャットダウン時にスマホへ通知を送り、勤怠管理サイトへのアクセスを促すシンプルなシステムを設計。通知には外部サービスPushbulletを利用し、手軽に実現することとした。
【Agent2Agent Protocol】 公式の Python を使った A2Aチュートリアルのサーバー立ち上げまでを試す（バグの対処も）
いいね : 4
タグ : python, google, a2a, aiエージェント, agent2agent
このブログ記事は、Agent2Agent Protocol(A2A)のPython公式チュートリアルを試す過程を記録しています。
記事では、A2Aの概要と公式チュートリアルの紹介、必要な環境（VS Code, iTerm or VS Code ターミナル, Python 3.12+, uv）の説明がされています。
また、チュートリアルの内容が更新されている点にも触れています。
A2Aの導入とチュートリアル実行を支援する内容です。
ラーメン屋からエンジニアに、未経験転職からの3年間
いいね : 5
31歳のかなつさんは、ラーメン屋から未経験でエンジニアに転職し、3年間で成長を遂げました。
最初のSES企業ではスキル不足に苦しみましたが、前向きな姿勢で努力を続けました。その後、スタートアップ企業PLAYLANDに転職し、開発経験を積み、要件定義からリリースまで一連のタスクをこなせるようになりました。
今後は、目の前の課題を楽しみながら、エンジニアとして個人と会社の成長に貢献し、将来的にはラーメン屋を開業するという目標を持っています。
基本情報技術者試験 概要まとめ
いいね : 15
タグ : 新卒エンジニア, 基本情報技術者試験, crane&i
- 基本情報技術者試験は新卒エンジニアが勉強対象としており、本記事は試験の概要をまとめたものである。
- 2025年5月8日時点での情報に基づいている。
- 具体的な試験内容や対策については言及されていない。
chakra ui v2 コンポーネント化する際にカスタム以外のpropsも渡せるようにするには？
いいね : 2
タグ : typescript, react
Chakra UI v2のButtonをコンポーネント化する際、元のButtonのpropsを外部から指定する方法を紹介。ButtonPropsをカスタム型と&で組み合わせ、コンポーネントのprops分割代入時に...restとしてカスタム以外のpropsをまとめて受け取ることで実現。これにより、コンポーネント化されたSaveButtonでも、Button本来のpropsを柔軟に設定可能になる。
2025-06-16 5:23:27 PM 時点の情報です。