회원가입 화면필수정보와 선택정보를 구분한다.\-- 필수정보: 아이디, 아이디 중복확인(버튼), 비밀번호, 비밀번호 확인, 이름, 성별, 생일\-- 선택정보: 취미회원가입 UI에 입력된 값을 DB에 저장하고, 완료되면 로그인 화면으로 이동.
depth가 깊은 프로젝트를 진행 중이다 보니 ejs 파일끼리 연결하는데 어려움을 겪고 있다. 그 중 제일 오랜시간이 걸렸던 게시판 글 목록에서 하나의 글 상세페이지로 이동하는 부분을 연결하는 방법에 대해 기록으로 남기고자 한다.동호회 게시판 프로젝트를 진행 중이다.f
album에 있는 사진을 눌렀을 때 모달창이 띄워지며 사진이 확대되어 볼 수 있도록 구현했다. 이후 모달창에서 사진을 업로드한 작성자 이메일과 현재 로그인한 user 이메일이 같은 경우에만 삭제 버튼이 보여서 삭제 가능하도록 구현하고자 하였다.아래 코드처럼 구현했는데
앨범에서 자신이 업로드 사진을 눌렀을 때 모달창에 사진이 확대되어 띄워지면서 삭제버튼이 보이도록 구현했다. 삭제 버튼을 누르면 그 사진 하나에 대한 firestore database의 사진 id를 삭제하도록 코드를 구성했다.선택한 사진 하나만 삭제를 하고 싶었는데 al
테이블 설계컬럼 결정타입 정하기관계 정의폭포수 모델 : back 할 수 없다애자일 모델 : 자유롭게 back 할 수 있다.ER-WIN (ERD(Entity Realation Diagram)) : ERD를 보며 조인 해야한다!관계 형태(1:1, 1:n, n:n)PK와 F
개인업무 폴더함첫 화면 : 전체 목록조건검색확장자 제외파일명, 등록일조건검색 목록업로드다운로드파일 누르면 다운로드새폴더 생성이동(선택)선택한 폴더 or 파일을 다른 폴더로 이동파일공유설정(선택)공유 범위 선택(다른 사람에게도 공유할 수 있는 문서 or 나만 보는 문서)
주제 : 노인 유치원 그룹웨어노인 유치원이라는 주제가 있는만큼 이 특색을 살릴 수 있도록 프로그램 관리, 약물 투여 관리, 후원사 관리 등과 같은 기능도 추가할 예정내가 맡은 기능은 직원관리 파트이다.직원관리>1\. 직원 신규등록(인사정보등록) : 인사카드2\. 근태관
back과 front 폴더를 따로 나누어 git init을 함.dev branch를 만들어 pull을 함.lsg branch를 만들어 파일을 수정한 뒤 add, commit, push를 실시함.👇back 👇front
그룹웨어에서 사용되는 엑셀의 활용을 토이 프로젝트로 먼저 실시해보고자 한다. 그룹웨어 직원관리에 직원을 검색하면 직원에 대한 상세정보가 출력된다.2-1. 기본 형식이 들어간 엑셀 파일을 다운로드\-> 엑셀 파일에 내용을 추가\-> 파일을 그룹웨어에 업로드\-> 엑셀의
Gradlejson 형식설정 : application.yml (json형식)코틀린 사용이 많아지며 Gradle을 더 많이 사용함annotation 방식 - java 코드Mavenxml파일 사용설정 : pom.xmlSAXxxxExceptionParseXXXExceptio
의존성 추가 엑셀 헤더를 생성할 어노테이션 설정
지난 번에 게시판 만들기 프로젝트를 했을 때 map으로 DB를 불러오던 걸 VO로 바꿨으나 매개변수로 VO를 보내면서 어중간한 VO 사용하기만 했었다. 하지만 이번에는 VO를 제네릭 타입으로 List< VO > 사용하도록 수정해보았다. 이렇게 수정하고 PostMa
이전 글에서 이야기 했든 완전한 VO로 DB값을 불러오지 않았을 때는 List<Map<String, Object>> eList = empLogic.excelDown(eVO); 이렇게 List< Map > 형식으로 파라미터에 VO를 담아서 값을 가져왔기
이전 게시물에서 SpringBoot로 엑셀 파일을 다운 받는 로직을 처리하였다. 이제 리액트와 연결하여 화면에 출력이 되도록 처리하고자 한다.
직원 (Employee) 테이블:직원코드(PK)직원명부서번호(FK)입사일퇴사일전화번호주소성별권한이메일현황직급비밀번호계약기간직종id(FK)사원번호학력 (Education) 테이블:학력순서(PK, 시퀀스)기간학교명학과명졸업구분직원코드(FK)경력 (Career) 테이블:경력
이전에 그룹웨어의 DB 설계 중 특정 직원 한 명의 상세정보에서 고등학교, 대학교, 대학원 학력을 조회, 입력, 수정, 삭제하는 글을 작성했었다.하지만 학력과 학력구분 테이블이 1:1 관계이기 때문에 굳이 따로 테이블을 설계할 필요가 없다고 생각하여 이를 수정하고자 한
노치원이라는 주제의 특성을 나타낼 수 있는 그룹웨어를 구현하기 위해 API를 좀 더 활용하고자 한다.노인, 복지, 노인일자리, 후원 등과 관련된 API가 있는지 찾아보고 정리하기 위해 이 글을 쓰게 되었다.서울시어르신취업지원센터는 고령자의 성공적인 재취업을 지원하고 역
React에서 db로 불러온 직원 전체 목록을 Excel로 다운로드를 받고자 구현하였다.엑셀 다운로드를 위해서는 xlsx-js-style을 사용해야 하고 이를 위해 아래와 같이 install 해야한다.
직원 전체 목록을 출력하는 코드는 반복되는 부분이기 때문에 EmpRow.jsx로 따로 분리하여 EmpListAll.jsx와 EmpRow.jsx로 분리하여 EmpRow에는 반복되는 코드를 넣고 EmpListAll에서는 tbody 태그 안에 EmpRow를 map으로 불러와
한 화면에서 그리드로 분리하여 중앙에는 전체 직원 목록이 출력되고 오른쪽에는 한 명의 직원 row를 클릭했을 때 상세정보가 노출되도록 코드를 구현하고자 하였다.아래 그림은 아직 구현을 완료하지 못한 상태로 그리드가 어떻게 구분되어있는지를 보기 위해 가져온 예시이다.최종
리액트를 활용하여 전체 직원 목록 중 조건 검색을 하는 기능을 구현하고자 하였는데 조건 검색이 되지 않았다. 이를 해결해보고자 하였다.수정 전에는 tbody 태그 안에서 상위 컴포넌트에서 props로 가져온 empList를 직접적으로 사용했다. 직접적으로 사용하지 않고
엑셀 다운로드 컴포넌트를 이전에 구현했었다. 그러나 그 코드의 문제는 직원목록을 이미 LsgPage 컴포넌트에서 불러와 empListAll에 props로 불러왔음에도 empListAll에서 import되고 있는 ExcelForm에서 이를 활용하고 있지 않다는 것이었다.
검색 버튼 눌렀을 때 조건 검색이 되도록만 설정했었다.이것을 엔터 키를 눌렀을 때도 검색이 되도록 수정해보았다.handleSearch 함수에서 엔터 키를 감지하면 performSearch 함수를 호출하고 이 함수에서 실제 검색을 수행하게 된다. 또한, performSe
👇 sql👇 mapper
기존에 반복되고 동적으로 반영되지 않던 코드를 동적으로 반영하고 중복 코드를 최소화하고자 리팩토링을 하였다.리팩토링을 한 부분은 한 명 직원의 학력을 출력하는 코드이다.기존 코드는 tbody 부분에 각각 고등학교, 대학교, 대학원에 대한 정보를 삽입해야 했다.👇 Em
조인하는 테이블이 많기 때문에 어떤 테이블들을 조인하는지 가독성을 높이고자 서브쿼리를 사용하였다.그러나 exp, certi 테이블은 max() 함수를 사용하지 않으니 한 명 직원의 경력과 자격증이 각각의 튜플로 나뉘어져 employee 테이블의 값이 중복되어 출력되었다
DB에서 입사일과 퇴사일을 date 타입으로 설정하였다.이를 프론트로 가져오면 시간까지 가져오게 되는데 이를 'YYYY-MM-DD' 형식으로 변환하고자 한다. 또한 텍스트로 받고 input type='date'로 설정하여 달력으로 날짜를 선택하게 변경하려고 한다.Mom
react-dom.development.js:86 Warning: Maximum update depth exceeded. This can happen when a component calls setState inside useEffect, but useEffect ei
직원 전체 목록에서 신규등록으로 필수 값만 넣어 등록한 뒤, 그 직원의 상세정보 일부만 수정하여 update를 하려고 하면 org.mybatis.spring.MyBatisSystemException이 발생하며 update가 되지 않았다.그러나 기존 DB에 넣어둔 더미
EDU_DIVISION 이라는 Attribute를 추가하여 이 속성 값이 고등학교, 대학교, 대학원인가로 학교를 구분하고 이것으로 정렬을 하려고 하였다.하지만 직접 sql문을 작성해서 사용해보니 이렇게 할 필요없이 좀 더 기존의 속성을 활용하고자 쿼리문을 변경했다. E
근태 테이블에서 날짜와 사원번호를 결합하며 pk를 생성하고자 한다.PK는 무결성 제약조건에 의해 유일성과 최소성을 만족해야 함으로 create table을 할 때, 각각의 컬럼에 PK를 설정하면 테이블이 생성되지 않는다.따라서 각각의 컬럼에 PK를 주지 않고 const
출근 insert를 할 때, 결근으로 표기되고 퇴근 update 시간에 따라 status를 정상출근, 지각, 조퇴로 표기되도록 쿼리문을 작성하였다.👇 insert 출근insert의 AT_DATE 처리는 to_date, to_char로 하다가 trunc를 사용하여 처리
xml 파일에 부등호가 있는 update 쿼리문을 삽입하니 에러가 발생했다.이유는 >=, <와 같은 부등호가 있기 때문이었다.에러를 해결하기 위해 >=는 &gt;=로 <는 &lt;로 변경하였다.
경력사항 중 하나를 삭제하려고 할 때 java.lang.IllegalStateException: Optional int parameter 'exp_no' is present but cannot be translated into a null value due to bei
위 쿼리문은 education의 ddl 이다. employee 테이블에 값이 insert되면 특정 e_no의 edu_no는 시퀀스로 값이 insert되도록 하고 는 null 값으로 들어가고는 sysdate로 들어가고,는 e_no가 들어가도록 설정하고자 하였다.아래가 이
최종 트리거가 3번 트리거이다.사원을 신규 등록할 때 employee 테이블의 reg_id 값이 education 테이블의 reg_id에도 똑같이 들어가도록 설정하였다.
엑셀 다운로드 기능을 하는 컴포넌트는 하나로 두고 다른 조원들도 자신의 테이블 컬럼을 입력한 컴포넌트를 만들어 공통 컴포넌트에 값을 props로 전달하면 엑셀 다운로드가 되도록 처리하였다.공통 컴포넌트와 테이블 컬럼을 담은 컴포넌트가 연결되기는 하였으나, 컬럼 값이 들
구현을 하다보니 직원상세정보 코드가 너무 길고 중복되는 부분이 많았다. 크게 수정해야 할 부분을 살펴보면,컴포넌트 분할: 코드를 더 작은 컴포넌트로 분할하여 각 컴포넌트가 한 가지 기능을 수행하도록 만듭니다. 이것은 가독성을 높이고 재사용성을 증가시키는 데 도움이 됩니
웹개발 프로젝트 진행과정1\. 요구사항 수집 및 분석:프로젝트 목적, 사용자 요구사항 등을 수집하고 분석하여 목표를 정립.2\. 기획 단계:웹앱의 구조, 기능, 화면 설계를 수립하고 프로토타입을 작성.3\. 개발 환경 설정:개발에 필요한 환경을 설정하고 필수 도구 및
서버 매니지먼트 프로젝트로 서버를 관리하는 웹사이트를 구성하고자 한다.구성은서버의 특정폴더에서 이미지를 조회, 다운로드서버 정보 취합 : 메모리, CPU 사용량 등 서버에 필요한 리스트들그 중, 우선 서버 정보를 취합하는 페이지에서 보여주면 좋을 내용들을 서칭해보았다.