토이프로젝트I 주제는 바닐라js로 SPA방식을 활용하여 사내인트라넷 구현하기

🔗 부트캠프 인트라넷

5주의 기간동안 우리 팀원은 부트캠프 수강생들을 위한 간편한 행정 인트라넷 구현하였다.

내가 담당한 페이지들을 목차별로 나열해보았고 자세한 코드는 깃허브레포에!!!!

🔸 team4.깃허브레포 보러가기 🔸

💡 회원가입 페이지

디렉토리 경로 : /src/login&signup

회원가입 정보가 data에 추가되지는 않지만 회원가입 페이지도 만들어보았다. 각 정보의 유효성검사는 하단의 text가 변하게끔하였다.

💡 로그인 페이지

디렉토리 경로 : /src/login&signup

users.json에 입력된 데이터는 userType이 manager와 student로 구분되어있으며 manager type으로 로그인 시 관리자용 페이지가 로드되고 student type으로 로그인 시 수강생용 페이지가 로드된다.

💡 마이페이지

디렉토리 경로 : /src/profile

사용자는 자신이 가입한 이름과 이메일 정보를 제외하고 프로필사진을 포함한 이외의 정보들을 수정 할 수 있다.

💡 사용자용 공지사항

디렉토리 경로 : /src/notice

수강생은 관리자가 등록한 공지사항을 검색하고 확인 할 수 있다.

💡 관리자용 수강생리스트

디렉토리 경로 : /src/studentInfoList

관리자는 수강생 정보를 리스트로 확인이 가능하며 수강생을 검색하고 과정에 참여하지 않는 수강생의 정보를 삭제 할 수 있다.

💡 관리자용 수강생 출결 현황

디렉토리 경로 : /src/student-attandance-record

관리자는 수강생 출결 현황을 확인 할 수 있다.

💡 +메인페이지의 구성요소로 미니수강생리스트

디렉토리 경로 : /src/managerHome/managerHomeStudentList

관리자용 메인페이지에서 수강생들의 강의장 접속 현황을 확인 할 수 있다. 이는 임의로Online 과 Offline 표시가 페이지가 리로드 될 때마다 랜덤출력되도록 하였다.