ねこがみさん。のホームページ（当サイト）を自作しました。
このサイトは、ポートフォリオとしての役割と、リンク集としての役割を兼ねています。

サーバ・ドメイン取得後からしばらくは画像4-5枚目のように簡易的なページでしたが、この度、時間を取って正式にリリースしました。
ビジュアルデザイン・設計・コーディング等をすべて自身で行い、モバイル端末にも対応した動的デザインで設計しております。

「様々な要望へ応える」という自身の強みを表すために、モノクロカラーを基調とし、自身のイメージカラーである カプリブルー（#00a3a7/rgb(0,163,167)）をアクセントカラーに使用しています。

当サイトにはデータベース不要で表示データを更新できるオリジナルCMS「ManagementStudio」を搭載しており、画像3枚目のようにGUIにてホームページを編集可能です。
また、このシステムはデータベースのみならずWordPress等も一切使用していない完全オリジナルシステムです。


主要機能

【ホームページ】
・ページタブファビコンのライトモード/ダークモードに対応したレスポンシブ表示
・作品ページ及びニュースページの画像をクリック（タップ）で全体表示（画面サイズに合わせたサイズ自動設定）[js,css]
・作品ページ及びニュースページの画像を左右ボタンで切り変え[js,css]
・タグ機能及びタグによるソート[php]
・画像保護処理による画像保存難化[html]
・OGP情報の自動生成[php]
・トップページ及びWorksトップにてサムネイルをランダム取得[php]
・作品一覧ページ及びニュース一覧ページでコンテンツ数に合わせて自動でページ数を計算、ページセレクタを表示[php]
・トップページスクロール時のヘッダーモーション[js,css]
・その他各種モーション[css]

【ManagementStudio】
・専用サブドメイン
・GUIによるコンテンツ投稿および編集[php]
・マークダウン風機能（特定の記号で括ることで大文字・太字・取り消し線・アンダーライン・赤文字を表示可能）[php]
・コンテンツ（記事または画像）表示順序の指定[php]
・コンテンツ（記事または画像）の公開/非公開設定[php]
・独自の命名規則に基づいた一意のページID（作品ID）の生成[php]
・大容量画像(1500pxより大きい画像)アップロード時に自動リサイズ[php]

【ソースコード】
・共通要素を外部ファイル化し編集作業を易化[php]
・CSSやJSなどを自身の親ディレクトリを基に自動読み込み[php]


ワンポイント
・技術習得を目的として、基本的にほぼ全てを手書きで作成しています（フレームワーク、外部ライブラリ、AIによるバイブコーディング等をほぼ不使用）。
・完全に独立し、クライアントサイドで完結してサーバ処理を伴わない内部ツール（サムネイル生成機能）のみ、技術検証を兼ねてGoogleGeminiによるバイブコーディングを行いました（デザインまでやってくれて素晴らしい完成度でした。主にNEWSのサムネイルに使用しています。）。
・レンタルWEBサーバを借用し、各種設定および管理も行っています。（無料サーバのため、サポートが無いのでした......。）


制作時間：推定300時間　4時間/日 × 約2か月
　　　　　（デザイン、ロゴ制作、要件定義、技術検証、コーディングなどを含む）