Natsuki Hayashida
CAD/CAMエンジニア × Web Developer × AI Enthusiast
Next.jsReactTypeScriptAI IntegrationOpenAI API
普段はCAD/CAMエンジニア、個人では最新のWeb技術とAIを活用したアプリケーション開発に取り組んでいます。
なぜ開発をするのか
製造業のエンジニアとして働く中で、「もっと効率的なツールがあれば...」「こんな機能があったら便利なのに...」と感じることが多くありました。
そこから独学でプログラミングを学び始め、今では実際に問題を解決できるアプリケーションを作れるようになりました。
仕事の枠を超えて、自分の技術で何かを作る。そんな気持ちでこのサイトを運営しています。
Tech Stack
フロントエンド
Expert
Next.js, React, TypeScript, Tailwind CSS
Proficient
HTML5, CSS3, Responsive Design
Exploring
Framer Motion, Three.js
バックエンド & AI
Expert
Node.js, OpenAI API, REST API
Proficient
Firebase, Vercel, PostgreSQL
Exploring
Supabase, LangChain
ツール & プラットフォーム
Git, GitHub, Vercel, Netlify, VSCode, Figma
What I Can Do For You
Webサイト・アプリケーション開発
ポートフォリオサイト、コーポレートサイト、カスタムWebアプリケーションの設計・開発
- •モダンな技術スタックで高速・保守性の高いサイト
- •レスポンシブ対応、SEO最適化
- •Lighthouseスコア90+を目標
AIチャットボット開発
LINEやWebサイトに組み込める会話型AIの開発
- •LINE公式アカウント向けAIチャットボット（SavvyBot）
- •GPT-4を活用した自然な対話システム
ECサイトカスタム開発
既製CMSに頼らない、完全自作ECサイトの構築
- •ECcube → Next.js完全移行プロジェクト（進行中）
- •Stripe決済統合、在庫管理システム
My Approach
📱
モバイルファースト
スマホでの体験を最優先
⚡
パフォーマンス重視
表示速度とUXにこだわり
🎨
デザイン思考
見た目と使いやすさの両立
🔄
継続的改善
データと検証に基づく改善サイクル
📚
ドキュメント重視
将来の保守性を考慮
今、興味があること
- •Next.js App Routerの最適化パターン
- •AIエージェントの実用的な活用方法
- •パフォーマンス最適化（Core Web Vitals）
- •アクセシビリティの向上
仕事以外では
- •Midjourneyでのイラスト生成が趣味
- •タコスが好き（このサイトの画像でもわかる通り😄）
- •妻が運営する花製作所のWebサイトも制作中