個人開発

開発ブログ

URLからモックアップ画像を作る機能|canvasが汚染された状態から画像プロキシを使った方法で解決

私が作ったポートフォリオ用のモックアップを作成するアプリ「Mockup Generator」。開発ブログ↓一番欲しかったのはURLからモックアップを作り、PNG画像で出力する機能だったのですが、CORS(Cross-Origin Resou...
開発ブログ

個人開発Webアプリを7つ公開して、かかった費用は月いくら?サーバー代とドメイン代の内訳

個人開発のWebアプリを7つ公開して、実際にかかったサーバー代とドメイン代を公開します。サブドメイン運用にした理由、格安サーバーから乗り換えた経緯、料金比較までまとめました。
開発ブログ

ユーザーの声で追加した機能|「操作方法がわかりにくい」を改善した話

ユーザーの声をきっかけに、お薬タイマーへ操作ガイドを追加した開発エピソードを紹介。実際に使ってもらうことの大切さについて解説します。
開発ブログ

AIに丸投げしてはいけないと思った理由|便利だからこそ「理解すること」が大切

AIに開発をすべて任せて感じた課題を紹介。丸投げのリスクや、コードを理解しながら活用することの大切さについて、実体験をもとに解説します。
アプリ紹介

画像を最短で目的のサイズへ編集できる無料トリミングツールをつくりました【Image Crop Studio】

切り抜くだけを速く終えたくて、トリミング特化の無料ツール「Image Crop Studio」をつくりました。登録不要で、画像はブラウザ内だけで処理されます。サムネイルのプリセット付きです。
MedTimer お薬タイマー 開発記録

元看護師がつくった、次に飲める時間だけがわかるお薬タイマー|Webアプリ【開発ログ】

「あと何時間で薬が飲めるか」だけを確認できる無料タイマー「MedTimer」をつくりました。元看護師の視点で項目を絞った理由と、初めて実装したログイン機能についてまとめています。
アプリ紹介

ビフォーアフター画像を残したくて、写真コラージュツールを自作した話【Photo Timeline】

美容ケアの変化を残したくて、写真を並べるだけでビフォーアフター画像がつくれる無料ツール「Photo Timeline」をつくりました。開発のきっかけと、写真を外に出さない設計にした理由をまとめています。
アプリ紹介

自分専用のスケジュール管理アプリを作った話|毎日続けられる仕組みが欲しかった

自分専用のスケジュール管理アプリを開発した理由をご紹介。三日坊主を防ぐ工夫や、Firebaseを使ったデータベース化など、日常で活躍している個人開発アプリについて書きました。
MedTimer お薬タイマー 開発記録

お薬タイマーをアプリ化したい|アプリを作るためにかかる費用|調べてみて分かった現実とこれからの目標

お薬タイマーのアプリ化を考えて調べたことをまとめました。iOSアプリ公開に必要な費用や個人開発で感じた現実、今後の目標についてご紹介します。
開発ブログ

「テキストファイルとして貼り付ける機能」を諦めた話|QuickAiMemo開発の裏側

QuickAiMemoで実装したかった「テキストファイルとして貼り付ける機能」を断念した理由をご紹介。ブラウザの制約と、個人開発で感じた難しさをまとめました。
開発ブログ

QuickAiMemoを作ったきっかけ|AIとのやり取りをもっと快適にしたかった|各機能について

QuickAiMemoを開発したきっかけをご紹介。AIへの指示を書いているときに感じた小さなストレスを解消するために作った軽量メモアプリです。
開発ブログ

【コピペOK】CSSだけでネオン文字を作る方法|ゲーム風・サイバー風デザインを作ろう!

CSSだけでネオン文字を作る方法を解説します。text-shadowを使った基本の光る文字から、ゲーム風・サイバー風デザインまで、コピペで使えるサンプルコード付きで紹介します。
開発ブログ

サイバー風Webデザインの作り方|FANELABで取り入れたデザインの工夫を紹介

FANELABで採用しているサイバー風デザインの作り方を紹介します。ネオンカラーやDotGothic16フォントなど、ゲーム風・近未来風デザインを制作するポイントを実例付きで解説します。
運営者プロフィール

【はじめまして】看護師からweb転職した運営者プロフィール

看護師からWeb業界へ転職し、現在はAIを活用したWebアプリ開発やWeb制作、広告運用に携わっています。運営者である私の経歴や現在取り組んでいることをご紹介します。
アプリ紹介

推し系統占いを公開しました!今日の気分にぴったりな推しを診断

推し系統占いは、今日の気分にぴったりな「推しの系統」を診断できる無料Webアプリです。開運ワード付きカードやSNS共有、おすすめメンズコンカフェ紹介にも対応しています。
アプリ紹介

覚醒年齢診断を作りました!ロングスリーパーは人生でどれくらい損をしている?

ロングスリーパーの「人生でどれくらい睡眠時間を使っているのか」が気になり制作した「覚醒年齢診断」を紹介します。HTML・CSS・JavaScriptの学習を兼ねて開発した無料Webアプリです。
アプリ紹介

モックアップ作成アプリを作成|URLからモックアップを作る方法に手こずった

こんにちは。Webサイトやアプリのスクリーンショットを、見栄えの良いモックアップ画像として作成できるモックアップ作成アプリ「Mockup Generator」を公開しました。ポートフォリオに使えるアプリだと思います!モックアップ作成アプリと...
開発ブログ

ブックマークレットとは?仕組みと安全性をわかりやすく解説

Webサイトで「ブックマークレットをブックマークバーへドラッグしてください」と書かれているのを見たことはありませんか?初めて見る方の中には、「普通のブックマークと何が違うの?」「JavaScriptって書いてあるけど危険じゃないの?」「ウイ...
アプリ紹介

Font & Color Checkerの使い方|画像から色・サイトから書体を簡単に調べるサイトを作った|使い方

「このサイトの文字って何のフォント?」「画像に使われている色を知りたい」Web制作やデザインをしていると、こんな場面は意外と多いですよね。そんな時に便利なのがFont& Color-Checkerです。Font & Color Checke...
アプリ紹介

AIプロンプト図鑑|コピペですぐ使える実践プロンプト公開|大変だったNext.js|AIを使いこなしたい

最近はChatGPTをはじめ、ClaudeやGeminiなど、さまざまな生成AIサービスが身近な存在になりました。文章作成やプログラミング、画像生成、アイデア出しなど、AIを活用できる場面は日々増えています。しかし、実際に使ってみると「思っ...