Bootstrap

한뼘코딩.com

생산성

교사 보결 지정 시스템

프로그램 소개

보결을 지정하는 데 도움을 받을 수 있는 프로그램입니다. 업데이트를 실시했습니다.

README

��# P��� ���� ��?� �¤�\� (Teacher Substitute Management System)



## ?�\�?ȸ� ?���

?��Y�P� ���� ���� P���� 8�଩�<�\� ����XՔ� P��� ���?� ��� ?� ���� ?�i� ��Ĭ �¤�\х�Ȳ�.



## ��\�

- 70�� �ɷX� P��� ���?� ��� ?� ��?�T�

- ���� ��� P��� ��]� ?��� ?� 8��� ��Ĭ \���

- ���� ���� P���X� XǬ���?� ����

- ���� ?�i� ��Ĭ ?� ���Ӹ� ?���



## 0� � ����

- Frontend: HTML5, CSS3, JavaScript (ES6+)

- DŤ�Mј�: PWA (Progressive Web App)

- p�t�0� ȥ�: Local Storage

- ?���x�: PC ?�|���� ?ȩ� ?���x�



## �Ȕ� 0���



### 1. P��� ?��� ���

- [x] P��� �]� (����P���/P���?���P��� l���)

- [x] P���ļ 0��� ?��� ��� (tDŽ�, Y�D�/?�, ����)

- [x] P��� ?��� ?�?�/��?�

- [x] P��� |�?� ��� (CSV ?��� ����)



### 2. ���?� ���

- [ ] P���ļ ��?�\� ��%�/?�?�

- [ ] ���� ��� ��?� \���

- [ ] ����P���/P���?���P��� ���?� l���

- [ ] �ΰ�T� �

- [x] ���Ɛ� ?�X� ��?�� $�?� (Y�P�ļ ޹��?�)

- [x] P���?���P��� ��?�\� ���� �� ��tЭ� ��MѤ¸� T�t� (���� ��?� ���)



### 3. ���� ��� P��� ����

- [ ] ����/��?�ļ ���� ��� P��� ��]�

- [ ] P���ļ ���� 8��� ��Ĭ \���

- [ ] ���� ��� �ŀ� U�x�



### 4. ��Ĭ ?� ���Ӹ�

- [ ] ���� ?�i� �����ܴ

- [ ] P���ļ ���� 8��� ��Ĭ

- [ ] ��?�/��?� ���Ӹ�

- [ ] p�t�0� ������0� (Excel, PDF)

- [ ] ���� (�4� ��?�

- [x] p�t�0� 1���/���� (JSON ?�|�)

- [x] p�t�0� ?�0�T�



## ?�\�?ȸ� l�p� (8֤�?ө� �|� ��T�)

reducer/ ?%%% index.html # T�x� ��t��� ?%%% main.css # T�x� ����|� ?%%% components.css # ����?��� ����|� ?%%% main.js # T�x� \��� ?%%% schedule.js # ���?� ��� 0��� ?%%% specialist-schedule.js # P���?���P��� ���?� ��� ?%%% time-slots-manager.js # ��?�� $�?� ��� ?%%% statistics.js # ��Ĭ ?� ���Ӹ� 0��� ?%%% utils.js # ��Ҭ��� h�?� ?%%% data.js # p�t�0� ��� ?%%% manifest.json # PWA �Ȳ�Ӥ¸� ?%%% service-worker.js # PWA ?�D��� ���� ?%%% assets/ # t�����, D�t�X� � % ?%%% icons/ # q� D�t�X�� % ?%%% images/ # t����� ?�|�� ?%%% README.md # ?�\�?ȸ� 8�?�



## ?�?� �Ĭ



### Phase 1: 0��� l�p� ?� P��� ?��� ��� ?'

- [x] HTML 0��� l�p� $�?�

- [x] CSS ?�?�����l� l��� (PC ?�|���� ?ȩ�)

- [x] 0��� JavaScript ��ȴ l�p�

- [x] \��� � Ѭ��� 0�?� p�t�0� ���

- [x] P��� ?��� ��%�/?�?�/��?� 0���

- [x] ����P���/P���?���P��� l���

- [x] P��� |�?� ��� 0��� (CSV ?��� ����)



### Phase 2: ���?� ��� 0���

- [ ] P���ļ ��?�\� ��%�/?�?�

- [ ] ����P���/P���?���P��� ���?� l���

- [ ] ���� ��� ��?� \���

- [ ] �ΰ�T� � l�?�

- [x] P���?���P��� ��?�\� ���� UX ?� � (��tЭ� ��MѤ¸� T�t�)



### Phase 3: ���� ���� ?� ��Ĭ

- [ ] ���� ��� P��� ���� 0���

- [ ] P���ļ ���� 8��� ��Ĭ \���

- [ ] ���� ?�i� �����ܴ

- [ ] ��?�/��?� ���Ӹ� ��1�

- [ ] p�t�0� ������0� 0���



### Phase 4: \�?�T� ?� 0���

- [ ] PC ?�|���� \�?�T�

- [ ] PWA 0��� ���

- [ ] 1��� \�?�T�

- [ ] 0��� �D�



## �‘�X�0�



### ?�?� Xֽ� $�?�

1. ?�\�?ȸ� t�� 2. \��� ?��� �‰� (Live Server �) 3. ?�|������?� index.html ��0� ### 8֤�?� 0��� t� ?�\�?ȸҔ� �|� ��T� l�p�\� $�Ĭ?��� �Ǵ� 䲑�\� 8֤�?� ?�D����� }Œ� 0���� ?� �ǵ�Ȳ�:



#### ���� 8֤�?� ?�D���

- GitHub Pages: 4�̸ ?�?� ��tǸ� 8֤�?�

- Netlify: ��ٳ 0��� ?� CDN

- Vercel: �x� 0��� ?� 1��� \�?�T� - **Firebase Hosting**: GoogleX� ?�?� ��tǸ� 8֤�?� - **|�?� �� 8֤�?�**: cPanel, FTP ��\�ܴ � #### 0��� )��� 1. ��� ?�|�D� X՘�X� ��T��� Uŕ� 2. 8֤�?� ?�D����� ��\�ܴ 3. index.htmlt� 踸��� ?�X�X�ij]� $�?� 4. ijT�x� �Ű� ( ��Ь�m�) ### \��� ��p�tǸ� (2024) #### P��� |�?� ��� 0��� ��� - **CSV ?��� ����**: |�\�\� l���?� MѤ¸� ?���<�\� ��� P���|� \� ���� ��� - **����?� ������0�**: ��%�\� p�t�0�X� Ǩ�1�D� ���� U�x�X�� $�X� ?�?� ��� - **��ȹ�� Ǩ�1� ����**: P��� �?�ļ D�?� ?��� ��ٳ ���� ?� ?��� tDŽ� ��l� - **���?� ��%� ?���**: - ����P���: @�P���,����P���,3Y�D�,2?� - P���?���P���: t�P���,P���?���P���,��!�`

- $�X� �̬�: ?��� $�X�@� Ǩ�1� ���� $�X�|� l���X��� ��U�\� <�ܴ1� ?���

- ���� 1��� ����: |ǀ� P��� ����� ��(�t�ij 1���\� P����� ?��� ���



#### P���?���P��� ��?�\� ���� UX ?� �

- ��MѤ¸� T�t� ?ȩ�: P���?���P��� ��?�\� ���� �� ��tЭ�/��tЭ� ��P� ��MѤ¸� T�t�|� \���

- ����ļ ���?� ���: �������, ?���?���(Y� ���%�), ������� ����|� T�t���?� ?�\� ���

- ��ٳ ���Τ�: ?���?��� ��� �� ��%� D�ܴ�� ��ٳ<�\� ���Τ�?��� ���� ��%� ���

- ��|�?� ?���x�: ��� ����X� MѤ¸� l�0�@� ����|�D� ��|�X��� |��1� �ǔ� UI

- ��ȹ�� ?�X� p�?�: T�t� ��Ĭ|� �$�X��� T�t�� \�?�X� ?�X��� \���

- ��?�?� <�ܴ1�: ?֬� ����� T�t���?� X�t�|�tǸ�?��� \���

- ����ܴ ����: ESC ��\� ��MѤ¸� T�t� �0�

- ?�Q�?� ?���x�: ��?�|� Xֽ���?�ij \�?�T�?� ��MѤ¸� T�t�



#### ���� �ƭ� ��?� ��%��� ?� �

- ?���T�?� ��?� \���: ���� �ƭ� ?���X� ��?� ��� ܴm�䲴���?� "1P���", "2P���" �X� MѤ¸�|� ?�p�X�� ��?� ?���̹ \���

- ���?� ��?� ���: ���Ɛ�� ��?�� $�?���?� ��%�\� ��?� ��?�(?�: 09:00-09:40)̹ \���X��� T� ��U�\� ��?� ��� ���

- |��?� UI: ���� �ƭ��� ���� 0�]� ?�?� �� ��P���?� ٳ|�\� ��?� \��� )��� ?ȩ�



#### ���� �¤�\� \��� �?�T�

- P���?���P��� ?��� $�Ĭ: P���?���P���X� ?���?��� ��?���̹ t��� Y� � ����P���� �������X�ij]� �?�T�

- ����P��� ���?� ��� ?�p�: ����P����� ?�ļ ���?�D� ����� J�<�p�, P���?���P���X� ?���?��� ��?���̹ ��ٳ<�\� �������

- ��ٳ ���� ��� $�?�: P���?���P���� ��?� Y� ���?� ?���?���D� XՔ� ��?���̹ t��� Y� � ����P���� �������<�\� ��ٳ $�?�

- ����?� ��p�tǸ�: P���?���P��� ���?� ���� �� ����P��� ���� ��� ��?�t� ����?�<�\� ��ٳ ��p�tǸ�

- ?�U�\� ���� ����: P���?���P���X� ?���?��� ��?���̹ ����P���� �������X�ij]� X��� T� ?�U�\� ���� ��� P��� ��]� ?���

- ��ٳ p�t�0� ȹt���?�t�X�: 0�t� ����P����X� ��DՔ�\� ���?� p�t�0�|� ��ٳ<�\� ?�p�

- |nj�1� ȹt���?�t�X�: q� �‘� �� ��ٳ<�\� �‰�?�p�, ?��� �‰�D� )���XՔ� H�?�\� ȹt���?�t�X� �¤�\�



#### ���?� ��� UI �?�T�

- P���?���P��� ?ȩ�: ���?� ��� ��D� P���?���P��� ?ȩ�<�\� �?�T�

- ��� ���� ?�p�: ����P���/P���?���P��� ��� ���� ?�p�\� UI ����1� ?���

- ���?� x�0ј�tǤ�: P���?���P��� ��� �! ���?� ����X� �?�\� ��l�?�\���

- ��DՔ�\� 0��� ?�p�: ����P��� ���?� ���� �(� ��� UI �ƌ� ?�p�



#### p�t�0� ��� 0��� ���

- ?ȴ� p�t�0� 1���: ��� p�t�0�|� 1��� ?�|�\� 䲴�\�ܴ (���Ʃ�)

- p�t�0� ����: 1��� ?�|�D� ��\�ܴX��� t�?� ����\� ����

- p�t�0� ?�0�T�: ��� p�t�0�|� ?�l�?�<�\� ��?� (H�?ȥ�X� ��h�)

- 1��� ?�|� ����: 1��� ?�|�X� Ǩ�1�D� ����X�� ������0� ?���

- H�?�\� ����: ���� ?� U�x� ?�(�|� ��t� ��?�\� x�\� p�t�0� ���� )���

- ��h� p�t�0�: P��� ?���, ���?�, ���� 0�]�, ��?�� $�?� � ��� p�t�0� ��h�

- �ЄǤ���?�: 1��� ?�|Dž��� ��ٳ<�\� �ЄǤ���?�� ��h�?��� ?��� )���

- ?�0�T� H�?ȥ�X�: "?�0�T�" MѤ¸� ��%� ?� t�?� U�x�D� ��\� ��?� )���



#### ٳ?� Y�?� 5�X� ��1� 0��� ���

- 0�t� p�t�0� 0�?� 5�X�: �]�?� P����X� Y�D�/?� ?���|� ��?�X��� ٳ?�<�\� 5�X� ��1�

- ����?� ��p�tǸ�: P��� ���/?�?� �� Y�D�/?� 5�X�t� ��ٳ<�\� ��p�tǸ�

- ?�,�?� \���: Y�D��� ?�t� ?�?��\� ?�,�?��� \��� (1Y�D�, 2Y�D�, ... / 1?�, 2?�, ...)

- ����P��� ?���: ����P���X� Y�D�/?� ?���̹D� 0�?�<�\� 5�X� ��1�

- ��ļ ?ȩ�: P��� �]� ���� ���� �ƭ� �� ��P��� ٳ?� 5�X� ?ȩ�

- X�ܴT�)� ?�p�: HTML��?� X�ܴT�)�?� Y�D�/?� 5�X�D� ?�p�X�� JavaScript\� ٳ?� ��1�

- p�t�0� |��1�: ��?� ����?��� Y�D�/?�̹ \���X��� p�t�0� |��1� ����



#### Footer ?� ?�?��� ?��� ���

- ?�?��� ?��� \���: Mֹ�|� P���زX� ?�?��� ?��� ?� ��}��� \���

- ?�\�?ȸ� ?���: ��?�, \ͅ� ��p�tǸ� ����, 0� � ���� ?��� ��h�

- Copyright ?���: ȑnj� \��� ?� |�t� ��� ?��� (MIT License)

- ?�Q�?� ?���x�: ��?�|� Xֽ���?�ij \�?�T�?� Footer ?�t�D���

- ��l� ?���: tǩ�}��, ?�x�?��� �̬�)�h�, About ��t��� ��l�

- ?�8�?�x� ?���x�: �l� L�ȹX� Footer\� ?�\�?ȸ�X� ?�8�1� ?�p�



### ?�?� �t�ܴ|�x�

- PC ?�|���� ?ȩ� ?���x� (\͌� t���ij 1024x768)

- �� ?���1� �t�ܴ|�x� �?�

- T�ܴ ��ȴT� ?� �Ǭ���1� �$�

- ���Ɛ� ����(UX) ?��� $�Ĭ

- �|� ��T� l�p�\� 8֤�?� \�?�T�



## |�t� ���

MIT License

미리보기

첨부 파일

  • components.css
  • data.js
  • index.html
  • main.css
  • main.js
  • manifest.json
  • schedule.js
  • service-worker.js
  • specialist-schedule.js
  • statistics.js
  • time-slots-manager.js
  • utils.js
  • README.md

첨부 파일