부푼 마음을 이끌고 첫 서류통과회사에 코테를 보러 선유도까지 다녀왔다.
vscode 를 사용한다고 해서 그냥 콘솔에 예시값넣고 로직만
완성하면 되겠구나하고 준비했다.
개발자 친구가 야 화면구현시키는걸수도 있어라고 한건
귓등으로 듣고 아 코테가 코테지 뭐 그런걸 시키겠어했는데...
세상에나
투두리스트 이미지 파일이 하나있고,
이미지 한장에서 보이는 각 기능과 css를 맞춰서 구현하는 테스트였다.
이럴수가 세상이 무너지는 느낌.. 옆사람이랑 눈을 마주쳤는데 할 수 있겠냐? 라는 의미의 눈빛이었다 ㅋㅋㅋㅋ
일단 css는 무조건 뒷전으로 두고, 기능을 구현중이었다는걸 나타내자하고
40분안에 최대한 구현해야지 생각했는데, 원티드 챌린지 온보딩강의에서
투두리스트는 10분이면 할 수 있어야된다고 말한걸 귓등으로 들었던
내 자신이 생각나면서 어우 너무 네거티브한 마음으로 테스트에 임하게됬다.
일단 바닐라 코딩이었기때문에 너무 오랜만에 해서 당황했지만 하나하나 해보자 하고 아래 정도까지만 구현했는데 시간이 끝나버렸다.
document.addEventListener('DOMContentLoaded', () => {
const addButton = document.querySelector('#addButton'); // 추가 버튼
const inputField = document.querySelector('#inputField'); // 입력 필드
const todoList = document.querySelector('#todoList'); // 투두 리스트
// 할 일 추가
addButton.addEventListener('click', () => {
const task = inputField.value;
if (task) {
const listItem = document.createElement('li');
listItem.innerHTML = `
<input type="checkbox" class="checkTask"> ${task}
<button class="deleteButton">삭제</button>
`;
// 할 일 삭제
listItem.querySelector('.deleteButton').addEventListener('click', function() {
this.parentElement.remove();
});
// 할 일 체크
listItem.querySelector('.checkTask').addEventListener('change', function() {
if (this.checked) {
listItem.style.textDecoration = "line-through";
} else {
listItem.style.textDecoration = "none";
}
});
todoList.appendChild(listItem);
inputField.value = '';
}
});
});
어쩌겠냐.. 같은 부캠수료생중에 나보다 먼저 다녀오신분이 계셨는데
나보다 더 구현하신거같았는데 불합하셨다고했다 ㅠ,.ㅠ
그래서 나도 당연히 불합이라고 생각하지만 아쉽고
투두리스트 10분동안 만들기를 내일동안 해보려한다 ㅂㄷㅂㄷ..화난다..