Reversi
- HTML+JavaScriptで動作するリバーシ（オセロゲーム）
- 製作期間：1週間
- 既存のシーケンス図とクラス図をもとに作成
Slackにて遠隔でのコードレビューを受けつつ、開発を行いました。
Introduction 自己PR
WEB開発技術者を志望しています。
HTML、CSS、JavaScriptを使ったUI/UX設計構築や、PHPとデータベースを用いたシステム開発に取り組んでおり、技術やツールの学習、スキルの向上に日々努めています。
Projects 製作実績
架空ECサイト オンライン八百屋
- HTML、CSS、JavaScript、PHP、MySQLによるフルスクラッチ
- 製作期間：約3か月 （企画から実装まで全て個人で製作）
-
主な機能
-
- ショッピングカート・ログイン・会員登録
- 販売管理・在庫管理・商品登録
- 他環境から独立した利用が可能（セッションを使用）
-
その他の特徴
-
- インタラクティブなUIの実装（アコーディオンメニュー、画像ポップアップ、モーダル表示、スムーズスクロールなど
- レスポンシブデザイン（PC、タブレット、スマートフォンに対応）
- 非同期リクエスト
- セキュリティ対策（CSRF、XSS、SQLインジェクションなどへの対応）
画像に透かしを入れるツール（サーバー負荷が大きいため非公開）
- HTML、JavaScript、PHP（GDライブラリを使用）
- 製作期間：約3週間（企画から実装まで全て個人で製作）
-
主な機能
-
- パラメータ入力時にリアルタイムで画像に反映
（非同期通信で更新。負荷低減のためリクエストのタイミングを制限。） - パラメータをテンプレートに保存可能
- DOMによるシングルページ
- パラメータ入力時にリアルタイムで画像に反映
- 個人用のツールとして作成しました。
MY PORTFOLIO（このページ）
- HTML、CSS、JavaScriptアニメーション、レスポンシブデザイン
- 製作期間：10時間（デザイン、実装）
Skill&Tool 言語やツールのスキル
HTML
- タグと構造、インタラクティブ要素とバリデーション、メディアクエリ、セマンティックHTML など
CSS
- セレクタとプロパティ、レイアウト（flexbox/grid）、レスポンシブデザイン、アニメーション・トランジション など
JavaScript
- 基本構文、イベント処理、DOM操作、fetch、async/await、アニメーション、エラー処理、クラス、jQuery など
PHP
- 基本構文、リクエスト処理、データベースとの連携(PDO)、セッション・クッキー、ファイル操作、エラー処理、クラス など
MySQL
- データベースの設計と操作、結合、インデックス、トランザクション、SQLインジェクション対策、バックアップとリストア など
VS Code
- コードの編集、補完、エラー検出、マルチカーソル、ターミナル、設定とカスタマイズ、拡張機能（SSH、Git他）
Figma
- UI/UXデザインの作成、レイアウトグリッド、コンポーネント、プロトタイピング など
Slack
- チャンネルの管理、チャット、ピン留めと検索、ファイルの共有、ビデオ通話 など
Zoom
- チャット、画面共有、ブレイクアウトルーム など
- オンライン交流会を主催兼ファシリテーターとして定期開催（120回）