과제 목표 flight Router ✓ GET /flight 요청은 파싱 가능한 JSON 문자열을 돌려줘야 합니다 ✓ GET /flight 요청의 응답은 배열의 형태여야 합니다 ✓ GET /flight 요청의 응답 객체는 `uuid, departure, destination, departure_times, arrival_times`를 포함해야 합니다 ✓ GET /flight?departure_times=2021-12-03T12:00:00&arrival_times=2021-12-03T12:00:00를 입력하면 조건에 해당하는 객체를 응답으로 보냅니다 ✓ GET /flight?departure=CJU&destination=ICN 을 입력하면 조건에 해당하는 객체를 응답으로 보냅니다 ✓ GET /flight/..
과제 목표 클라이언트의 액션(버튼 클릭)에 따라 각기 다른 HTTP 요청이 서버로 들어오면, HTTP 요청에 담아 보낸 단어를 소문자 또는 대문자로 응답하는 서버를 구현합니다. 참고 문서 HTTP 트랜잭션 해부 https://nodejs.org/ko/docs/guides/anatomy-of-an-http-transaction 내가 겪은 시행착오와 새로 알게 된 것 서버 입장에서 생각하기 계속 프론트엔드의 관점에서만 생각하다 보니 내가 서버를 구현해야 한다는 사실 자체가 낯설었다. 생각이 자꾸 '내가 왜 요청을 받지???'라는 물음으로 돌아가서 이걸 바꾸는 데 시간이 좀 걸렸다. node.js의 http 처리 과정 createServer를 이용해 서버를 생성한다. 이때 규정되는 request, respon..
고차함수를 배웠으니 자바스크립트의 기본 내장 고차함수들을 반복문을 이용해 직접 구현해 보자. 자바스크립트의 underscore라는 라이브러리는 배열과 객체를 처리하는 데 유용한 함수들을 제공하는데, 이와 비슷한 기능을 직접 만들어 보는 것이 오늘의 과제였다. 먼저 map, filter, reduce를 만들기 전에 forEach에 해당하는 함수부터 만들어준다. 배열인지 배열이 아닌 객체인지 여부를 확인해 각각의 요소마다 콜백함수를 적용한다. _.each = function (collection, iteratee) { if (Array.isArray(collection)) { for (let i = 0; i < collection.length; i++) { iteratee(collection[i], i, c..
나만의 아고라스테이츠 만들기 미니 프로젝트 📌보러가기 코드스테이츠 부트캠프 section1을 마무리하며 작은 솔로 프로젝트를 진행했다. '아고라스테이츠'는 코드스테이츠 수강생들을 위한 일종의 질문 게시판인데 이것을 나만의 스타일로 다시 구성해보는 것이 과제였다. 아주 기본적인 틀과 힌트만 주어지고 나머지는 전부 스스로 알아내고 만들어 내야 해서 지금까지의 과제와는 달리 난이도가 있었지만 도전의식에 불타서 advanced 과제까지 잘 달성했다! 그 과정에서 배운 것이 아주아주 많았기에 잊기 전에 잘 정리해둬야겠다고 생각했다. 1. Bare minimum 과제 목표 • 디스커션 나열 기능 • CSS로 꾸미기 • 디스커션 추가 • Github page 배포 📌 디스커션 나열 기능 게시물 정보가 들어 있는 객체..
DOM 연습과제로 회원가입 폼 유효성 검사를 하고 에러 메시지를 띄우는 과제를 수행했다. 과제 목표 • 아이디에 4글자 이상 입력되지 않으면 에러 메시지 띄우기 • 비밀번호 확인이 비밀번호와 일치하지 않으면 에러 메시지 띄우기 • 아이디에 영숫자 외 다른 문자가 입력되면 에러 메시지 띄우기 • 비밀번호가 8자리 이상, 영숫자 및 특수문자가 하나 이상 포함되지 않으면 에러 메시지 띄우기 처음 화면을 띄웠을 때는 에러 메시지가 보이지 않다가 사용자가 input에 글자를 입력하기 시작하면 유효성 조건에 관한 에러 메시지를 띄우고, 조건이 잘 맞으면 에러 메시지를 없애거나 적절한 내용을 입력했다는 메시지를 띄우도록 하는 것이 과제 목표였다. 📌 초기 에러 메시지 숨기기 처음에는 에러 메시지가 보이지 않아야 하기..
Koans: 불교에서 유래된 단어로, 결론을 내리기 전에 이게 왜 맞는지 깊게 고민한다는 의미 오늘은 koans 과제를 통해 지금까지 배운 것들을 정리하고 되새기는 시간을 가졌다. 풀면서 헷갈리거나 다시 한번 짚고 넘어갈 필요가 있는 것들을 정리해 본다. 1. 암묵적 타입 변환 expect(123 - "1").to.equal(122); 산술 연산자는 피연산자 중 숫자 타입이 아닌 것을 숫자 타입으로 암묵적 타입 변환한다. expect("1" + true).to.equal(Fill_Me_In); //"1true" 그러나 + 연산자는 산술 연산자로도 쓰이지만 피연산자 중 하나 이상이 문자열인 경우 문자열 연결 연산자로도 쓰인다. 위 경우 "1"이 문자열이므로 불리언 true가 문자열로 암묵적 타입 변환돼 "..
지난 시간에 이어 오늘은 자바스크립트로 계산기 기능을 구현하는 실습을 진행했다. 엣지 케이스(Edge case)와의 전쟁 계산기를 사용할 때 사용자들이 1 + 1 = 2 처럼 정직한 계산만 시행하면 좋겠지만 실생활에서는 수많은 방식의 예외적인 사용법들이 실행된다. 예컨대 한번만 입력해야 하는 소수점을 여러 번 누를 수도 있고 더했다 뺐다 나눴다 하는 연속적인 연산을 여러 번 해야 할 수도 있으며 10+0.1을 하고 싶을 때 +를 누른 다음 바로 소수점을 눌러서 0.1을 만들고 싶을 수도 있다. 이처럼 일반적인 시나리오와는 다른 예외적인 상황을 엣지 케이스라고 부른다. 계산기는 정확한 결과값을 내는 것이 기능의 전부라고 할 수 있는 만큼 엣지 케이스를 철저하게 처리하는 것이 중요하다. 특히나 어려웠던 엣지..