자동 문자 전송 시스템 만들기
2022. 8. 18. 00:47
개발
깃허브 프로젝트 링크를 들어가서 확인하면 코드를 볼 수 있습니다. 프로젝트를 선택한 이유 작년 3월부터 멋쟁이사자처럼 8기 멤버 모집을 하게 되었다. 당시 지원자 수는 약 90명 이상 되는 상황 이였으며, 신청 폼에는 연락처를 입력받아 서류 합격, 면접 안내 등 여러가지 내용에 대해서 문자로 안내를 했어야 했다. 운영진은 총 4명으로 여러가지 방법을 생각해보았지만 결국 최선의 방법은.. 인원수 대로 n분 하는 뿐 이였습니다. 중간에 연락처 적으면서 꺼버린 실수로 자주 일어나서 정신나갔다. 그리고 무엇보다 연락처를 하나하나 저장해서 전달하는 자체가 너무도 번거로웠고, 카카오톡 친구로도 떠서 불편했다... 탈락자분들도 많은데.. 애매모한 상황.. 그래서 작년 2020년 3월때를 생각하여, 이번에는 어느 정도..
멋쟁이사자처럼 시간표 앱 만들기 #5 (최종)
2022. 8. 18. 00:44
개발/React
해결 개발 현황 Auth 인증 페이지 생성 ( 운영진, 멤버 코드 분리 ) Auth 인증 Logic 구현 ( URL 접근 X , Redux State 이용) 따로 계정생성을 해서 만들지 않은 이유는 큰 필요성을 느끼지 못했다. 멤버와 운영진의 코드를 따로 분리시켜 화면을 달리하는 방법을 선택했다. ** 왜냐하면 멤버가 출석체크 관리 페이지에 들어가면 크나 큰 오류이기 때문!** 인증방식 Redux를 활용하여 간편한 인증절차를 만들었다. 접속 코드 { setcode(e.target.value) }} /> 이 페이지는 🦁멋쟁이사자처럼 at 순천향대학교 출석부 입니다. 접속하기 해당 코드에서 인증페이지에서 폼에 대한 구성 현황이다. 코드를 입력받는 부분에 onChange 함수를 인라인으로 구현하여, Value..
멋쟁이사자처럼 시간표 앱 만들기 #4
2022. 8. 18. 00:42
개발/React
해당 프로젝트는 이곳 에 들어가시면 확인 가능하며, 개인 미니 프로젝트 입니다. 완료 구현 총 출석 현황 리스트 페이지 구현 출석현황 페이지 이동 버튼 SidePanel_Header에 추가 왼쪽 / 오른쪽 스크롤 구현 *하루만에 2번이나 갈아엎은 피땀눈물 가득했던 AttendanceList 페이지였다. * 바둑판 UI가 얼마나 구현이 힘들고, 고려해야 할 사항이 많은지 느꼈다...^^ 나는 행/열 둘 다 계속 변화되어서 적용되는 페이지를 구성해야 했다. 사실 모양 상 테이블 형식의 표 모양이기 때문에... table 태그를 이용해서 구성을 시작했다. 이 선택은 고통의 시작이였다. 페이지 구성방식에 대해서 간단하게 과정을 적어보도록 하겠다. 종합 출석 리스트 구현하기 - 이용 사실이 table 태그는 정말..
멋쟁이사자처럼 시간표 앱 만들기 #3
2022. 8. 18. 00:39
개발/React
파일 구성 파일 디렉토리에 대해서 간단하게 구상하여 명시해보았다. 파일 Components 및 Redux 구성 📦src ┣ 📂components ┃ ┣ 📂AuthPage ┃ ┃ ┗ 📜AuthPage.js ┃ ┗ 📂MainPage ┃ ┃ ┣ 📂MainPanel ┃ ┃ ┃ ┣ 📜AttendList.js ┃ ┃ ┃ ┣ 📜MainHeader.js ┃ ┃ ┃ ┣ 📜MainList.js ┃ ┃ ┃ ┗ 📜MainPanel.js ┃ ┃ ┣ 📂SidePanel ┃ ┃ ┃ ┣ 📜SideFooter.js ┃ ┃ ┃ ┣ 📜SideHeader.js ┃ ┃ ┃ ┣ 📜SideList.js ┃ ┃ ┃ ┗ 📜SidePanel.js ┃ ┃ ┗ 📜MainPage.js ┣ 📂redux ┃ ┣ 📂actions ┃ ┃ ┣ 📜schedule_a..
멋쟁이사자처럼 출석부 앱 만들기 #2
2022. 8. 18. 00:37
개발/React
필요 기능 정리 혼자 진행하는 토이 프로젝트이니 기본 UI구성에 대해서 고민을 많이 했다. 멤버 정보가 보여야 할까? 벌금 자동 계산? 페이지가 몇개? 필요점을 정리를 해봤는데, 참고 할 만한 UI를 찾기 어려웠다. 날짜 선택(세션 날짜)을 하여서 해당 세션 출석체크가 필요함. 벌금 등에 대해 기준을 세워서 벌금을 자동으로 계산해야함. 벌금을 냈으면 정산하여 벌금을 감하는 시스템이 필요함. 지금까지는 여기까지의 구성만 생각해보았다. 개발 중 필요한 구성이 생긴다면 추가 할 예정이다. 페이지 구성하기 나 같은 경우 2가지나 1가지 페이지를 통해, Panel을 나누어서 화면에 띄울 생각이다. 간단하게 Adobe XD를 통해서 레이아웃을 만들어보았다. 멤버 리스트 페이지 왼쪽에는 아기사자 멤버 리스트, Cli..