[일코+1] 매일 코딩하기 첫번째 날 시작!

신입사원 교육을 받으면서 부장님께서 초보개발자로서 매일매일 코딩을 하는 습관을 만든다면

3년후에는 코딩 실력의 격차가 크게 날 것이라는 말씀을 해주셨다.

 

그래서 오늘부터 시작하려고한다.

2월 11일 화요일에는 신입사원 교육이 끝나고 본사로 돌아왔다. 빈자리를 배정받았지만 발령을 받으려면 2~3달 대기해야한다. 대기하는 기간동안 나의 부족한 점들을 조금이라도 보완해야겠다.

 

부족한점들이 많지만 일단 공간정보지식과 코딩실력으로 나눌 수 있기에...

매일 코딩하고 기록을 남겨서 코딩실력향상 과정을 적어보려고한다.

 

오늘은 회사에서 지난번에 과제로 게시판을 만들던 것을 이어서 삭제 기능을 구현하였다.

그때 삭제버튼을 눌러도 '내용이 조회되지 않습니다.'라는 알람이 뜨거나 시스템 오류가 떠서 도저히 원인을 파악할 수가 없었는데, 오늘 알게되었다.

 

문제는 내가 POST방법을 사용했지만 파라미터 값 전송을 url에 담아서 GET방식으로 보내고 있다는 것이었다. 그래서 화면에서 컨트롤러로 요청이 넘어가지않았다.

 

따라서 화면 jsp 파일에서 값들을 보낼때 POST방식으로 보내기 위해 chatGPT에게 좋은 방법을 물어봤고,

ajax를 사용하는 방식을 추천해줬다. 아래 코드를 보면 body부분에 파라미터값을 넣어줘서 전달하게 만들었다.

function fncEqpmnRepDelete(excPerRepSeq, eqpmnNo) {
    console.log("삭제 요청: excPerRepSeq =", excPerRepSeq, ", eqpmnNo =", eqpmnNo);

    if (confirm("정말 삭제하시겠습니까?")) {
        fetch("/sec/pje/epr/deleteEqpmnRep.do", {
            method: "POST",
            headers: {
                "Content-Type": "application/x-www-form-urlencoded"
            },
            body: new URLSearchParams({
                excPerRepSeq: excPerRepSeq,
                eqpmnNo: eqpmnNo
            })
        })
        .then(response => {
            if (!response.ok) {
                throw new Error("서버 오류 발생");
            }
            return response.text();
        })
        .then(data => {
            console.log("삭제 완료 응답:", data);
            alert("삭제가 완료되었습니다.");
            location.reload();  // 삭제 후 페이지 새로고침
        })
        .catch(error => {
            console.error("삭제 요청 실패:", error);
            alert("삭제 중 오류가 발생했습니다.");
        });
    } else {
        console.log("삭제 취소됨");
    }
}

 

사실 원래 코드들에서 사용하고 있는 폼을 이용해서 <input type="hidden" name="excPerRepSeq" value="${excPerRepData.excPerRepSeq}"> 이런 설정을 하고 document.form.submit() 함수를 실행하는 방법도 사용해보고 싶었는데. chatGPT는 그 방법보다 ajax사용을 더 추천하였다.

 

내일은 ajax에 대해서 더 공부해봐야겠다.