勤怠管理アプリ Coursework

ユーザー画面:ログイン
ユーザー画面:ユーザー登録画面
ユーザー画面:打刻画面
ユーザー画面:勤怠一覧画面(月次)
ユーザー画面:勤怠詳細(修正申請)画面
ユーザー画面:申請一覧(承認待ち)画面
ユーザー画面:申請一覧(承認済み)画面
管理者画面:ログイン
管理者画面:勤怠一覧(日次)
管理者画面:勤怠詳細(修正)画面
管理者画面:申請一覧(承認待ち)画面
管理者画面:申請承認画面
管理者画面:申請一覧(承認済み)画面

期間

2025/05 〜 2025/06(1.5か月)

概要

プログラミングスクールCOACHTECHの課題として制作した勤怠管理アプリです。

従業員の出勤・退勤・休憩打刻、修正申請、管理者による承認・修正までを一元管理できるWebアプリです。
複数回休憩の記録、承認ワークフロー、修正履歴のバックアップ、CSVエクスポートなど、実務を想定した機能も備えています。
また、Vite + JavaScript によるリアルタイム時計表示など、UI面の工夫も加えています。

実務利用を目的とした完成品ではありませんが、到達度を示す参考として掲載しています。

主な機能

一般ユーザー

  • ユーザー登録(メール認証) / ログイン / ログアウト
  • バリデーション(FormRequest) / エラーメッセージ表示
  • 出勤(1日1回制御) / 退勤 / 休憩(複数回対応)打刻
  • 勤怠一覧(月次)表示
  • 勤怠修正申請(再申請可)
  • 申請一覧(承認待ち / 承認済み)

管理者

  • 管理者ログイン / ログアウト
  • 勤怠一覧(日次)表示
  • スタッフ別月次勤怠一覧表示・CSV出力
  • 勤怠詳細の直接修正
  • 修正申請の承認
  • スタッフ一覧(氏名・メールアドレス)表示

使用技術

  • バックエンド:Laravel 10 / PHP 8.2
  • フロントエンド:HTML / CSS / JavaScript / Vite
  • データベース:MySQL
  • インフラ:Docker / Nginx
  • バージョン管理:Git / GitHub

今後の改善アイデア

本アプリはオンラインスクール課題として制作したもので、現時点では完成形としています。
次回制作時には、以下の機能を追加する予定です。

  • カレンダーUIの導入
  • 未打刻対応機能
  • UI/UXの向上

GitHubでソースコードを見る

×