전체 글

1/3 (몸 관리 실패, 화) TIL

(노드 심화 주차 프로젝트 중)눈이 뜨겁다. 어제 내가 맡은 파트의 백 API를 만들고, 오늘은 프론트에서 요청을 보내오는 코드를 짰다. 대강의 html 페이지를 만들어놓고만 하려고 했는데도 근 한 달만에 해봐서 그런지 막막했다. 실제로 잘 동작하는지는 내일 더 건강한 컨디션으로 확인해봐야겠다. 프론트 동작 탐구로그인 처리 - ajax() 방식과 axios 방식의 공통점과 차이점이 확연히 보인다. Ajax 버전: // 로그인 function sign_in() { let email = $("#inputEmail").val(); let password = $("#inputPassword").val(); $.ajax({ type: "POST", url: "/api/auth", data: { email: ema..

1/2 (include 두 번의 반란, 월) TIL, TIT

(노드 심화 주차 프로젝트 중)Sequelize 모듈을 사용함에 있어서 어려움울 겪었다. Users라는 테이블이 있다. 그리고 Services라는 테이블이 있는데 여기의 customerId와 ownerId는 모두 Users의 userId와 연결되어 있다(userId를 참조하고 있다). 목표: 하나의 ‘Service’ 데이터를 조회할 때 cutomerId와 ownerId 각각에 맞는 User 데이터를 조인해오고 싶다. 추가로, 조인해 온 User 데이터 중 nickname 컬럼만 각각 customerNickname, ownerNickname이라 덮어씌운 별명으로 가져오고 싶다. 상기한 관계는 sequelize의 Model 작성시 이미 맺어져 있다(이게 왜 중요하고 환장할 일인지는 아래에 나와 있다…). 이..

12/30 (3번째 프로젝트 시작, 금) TIL

(프로젝트 진행중) 3번째 프로젝트가 시작됐다. 이전까지는 API 메소드들을 app.js파일에 통으로 짜 넣던걸 이제는 3계층으로 분리하는 것을 목표로 한다. 기능별 단위 테스트와 통합 테스트를 탄탄히 해보는 것 또한 이번 프로젝트의 메인 목표이다. 손님과 사장님 모두에게 서비스를 제공하는 “세탁물 픽업 후 집앞까지 배달” 소프트웨어를 만들어야 함. 내내 팀원들과 프로젝트 사전 계획서를 작성했다. 회의할 때 설명하면서 그려보인 드래프트시간이 오래 걸렸지만 덕분에 프로젝트 요구사항과 요구사항에 생략된 페이지, 기능, 기능의 흐름에 대해 더 심도있게 파악이 가능했다. 이제 만들어볼 수 있을 것 같다. Uploaded by N2T

12/29 (미궁에 빠진 에러, 목) TIL

(노드 심화 주차 강의 듣는 중) 좋은 노트 정리 방식을 하나 알았다. 강의 노트가 있을 때 거기서 꼭 모든 꼭지를 다 내 언어로 옮겨 적지 말고, 내가 명확히 그리고 더 자세하게 정리한 부분이 있으면 그 부분을 강의노트에서 선 긋기 방식으로 (이렇게) 지워놓는 것이다. 그리고 강의 노트에서 특별히 더 덧붙일 말이 없으면 그냥 이 꼭지는 강의 노트를 참고하라고 한 마디 남겨 놓고 말이다. 좋아. 이렇게 덜어낼 것은 덜어내고 분업 루트로 가는 거다..! 오늘은 진짜 미스테리 그 자체인 에러를 하나 기록으로 남기려고 한다. 아직 해결하지 못했다. 테스트 코드에 대해 마침 배우려는 참인데 이걸 배우고 나면 디버깅에 도움될 수 있지 않을까 해서 일단 공부중이다. 아래는 어제에 이은 에러 기록이다. 일단 내 편집..

12/28 (3계층 아키텍처 패턴대로 기존 코드를 분리해보다, 수) TIL

(노드 심화 주차 강의 듣는 중) 나의 용어로 정리한 강의 내용. 다른 이에겐 생소할 수 있다. 프로그래밍에서 ‘도메인’이란 용어의 뜻은: 요구 사항에 따른 개발 범위. 소프트웨어로 해결하고자 하는 문제의 영역. “온라인 쇼핑몰 개발”이라는 상위 도메인 밑에는 “상품 게시글”, “결제”, “정산” 등의 하위 도메인이 여럿 있을 수 있다. 그래서 ‘도메인 모델’이라 함은: 특정 도메인을 개념적으로 정리한 모델!3계층 아키텍쳐 패턴: 제0계층 라우터(?) -> 제1계층 컨트롤러 -> 제2계층 서비스 -> 제3계층 레파지토리 + ORM‘계층’이란 (하위 계층과 상위 계층의 상관관계가) 마치 점조직 같다. 하위 조직은 서로의 존재를 모르고 직속 상위 조직과만 연결되어 있는 것이. Uploaded by N2T

12/27 (객체 지향은 회사 시스템이다, 화) TIL

(노드 심화 주차 강의 듣는 중) 객체 지향에서 나오는 용어들(캡슐화, 상속, 추상화, 다형성, 의존성, 결합도, 응집도)과 객체 지향 프로그래밍 설계의 5가지 원칙인 “SOLID”는 어떤 차이가 있는 걸까. ⇒ 대략 전자를 ‘객체 지향적인 설계에서 다루어지고 활용되는 개념들’로, 후자를 거기서 더 나아가 ‘객체 지향 프로그래밍을 더 잘하기 위한 원칙’으로 이해하고 있다.내가 이해한 ‘객체 지향’: “누가 어떠한 일을 할 것인가”, 일꾼에게 일 할당하기. 어떤 저택을 돌보는 기능이 필요하다고 할 때, 그걸 한 뭉텅이의 일거리로 만들지 않고 임의로 어떤 고용인들을 추상화해내는 것. 침대 시트와 옷가지를 빠는 ‘빨래 담당 하녀’, 마구간을 돌보는 ‘마구간지기’, 주방 담당 ‘주방장’ 등으로. 또 어떤어떤 일..

12/26 (Prettier와 Socket.IO, 월) TIL

(노드 심화 주차 강의 듣는 중)이제 그날 공부한 내용을 그냥 TIL 노트에 바로 쓰고 올리기로 하였다. 통일된 코드 서식은 오타를 줄이고 가독성을 높이는 효과가 있다. 대표 패키지로 prettier를 사용해보았다. 프로젝트 전체 파일을 한 번에 정렬하려면 npm run prettify로, 한 파일이나 코드 조각을 정렬하려면 플러그인 설치를 통한 마우스 우클릭 → “Reformat with Prittier” 액션으로 해결하는 게 좋겠다. 웹소켓은 실시간 웹 서비스를 지원하기 위해 만들어진 소켓이다. ⇒ “새로고침 없이”가 실시간의 정의라고 봐도 되는 걸까?자바스크립트 대표 웹소켓 라이브러리 Socket.IO를 이용하여 서버와 클라이언트가 데이터를 주고받는 방법(간단히): (참고: socket.io 공식 ..

12/23 (Sequelize ORM 쪼끔 더 이해, 금) TIL

(노드 숙련편 개인 과제 제출함 + 계속 수정중)게시글 관련 API를 다 만들었다. ‘좋아요’를 구현한 방식이 좀 이상한 것 같긴 하지만 작동은 된다. 과제 리뷰 시간에 코드의 ‘서비스’와 ‘컨트롤러’ 부분을 분리해야 한다는 팁을 들었다. 실제 일을 하는 ‘직접 함수’들이 서비스이고, 거기로 일을 넘겨주는 router.get() 같은 코드들이 컨트롤러라고 이해했다.예를 들어 이번 주 강의에서 배웠던 것처럼 router.get('/posts', (req, res) => {...}) 안에 게시글 목록을 불러오는 코드를 몽땅 넣는 것은 컨트롤러와 서비스가 분리되지 않은 방식이라고 한다. 좋은 코드는 router.get(’/posts’, posts.service) 같이 구체적인 실행을 다른 함수에게 넘기고 끝나..

12/22 (알겠다가 모르겠다가, 다시 쿠키와 JWT. 목) TIL

(노드 숙련편 개인 과제중)회원가입과 로그인 API는 만들었다. 하지만 기존의 API들을 새롭게 수정된 요구사항대로 손보고 MongoDB에서 MySQL로 옮긴 데이터베이스에 맞게 코드를 수정하는 과정에서 시간이 많이 갔다. 댓글 관련 API들은 수정을 끝냈고 내일 게시글 관련한 것들만 손 보면 되는데 여기는 새롭게 만들어야 할 API가 두 개 더 있어서 한 두 시간만에 완성하진 못할 것 같다. 사용자 인증 방식도 쿠키와 jwt 토큰 관련해서 대거 재검토에 들어가야 하겠고. 아무래도 하는 데까지만 하고 제출한 후에, 시간이 지나더라도 이어서 완성하도록 해야겠다. 쿠키와 세션, jwt 토큰에 대해 대략 이해했다. 일단 자세한 설명은 생략하고, 서버가 클라이언트에게 줄 때는 응답 헤더의 Set-Cookie 항..

12/21 (app.js의 큰 흐름을 정리하다, 수) TIL

(노드 숙련편 개인 과제중)과제의 app.js 파일에서 전체 코드를 어떤 순서로 배치해야 하는지 기존의 강의 코드들을 연구해보았다. 특히 미들웨어들(application 레벨, router레벨, 그냥 함수로서의 로그인 인증 미들웨어)의 배치 순서를 고민했는데 나름 깔끔하게 결론이 난 것 같아 만족스럽다. 1번 모듈 임포트(require)부터 5번 로그인 인증 미들웨어 배치까지 순서가 있는데, 내일 회원가입과 로그인 route만 잘 만들면 큰 줄기는 끝이겠다. express.json()과 express.urlencoded()의 공통점과 차이점, 용도를 간단하게 정리해보았다. 기본적으로 둘 다 PUT과 POST 요청시에 body로 전달되는 데이터를 받아 처리하는 데 쓰이는 body-parser이며, 각각 요..

12/20 (MongoDB에서 MySQL로, 화) TIL

(노드 숙련편 개인 과제중)지난 과제에서 데이터베이스로 MongoDB를 사용 하던 것을 MySQL로 옮기는 작업에 들어갔다. 어제는 mongoose 문서를 팠는데 오늘은 180도 선회하여 sequelize 문서를 탐구하고 있으니 현기증이 났다. MySQL을 Node.js 환경에서 사용하기 위한 모듈 Sequelize를 도입하고 mongoose로 짰던 코드를 sequelize 코드로 바꿔봄. ORM이 이런 건가… 하는 느낌이 조금씩 들고 있음. 오늘 강의에선 특별히 ORM이 이런 거다 하는 얘기가 없었지만. sequelize로 데이터 테이블 모델(스키마)를 하나 만들 때, models 폴더에 만들어지는 파일이 “내 코드에서 사용하게 되는 쪽”, migrations 폴더에 만들어지는 게 나중에 진짜 “MyS..

12/19 (어질어질한 쿠키와 JWT, 월) TIL

(노드 숙련편 개인 과제중)Node.js를 배우기 시작한 지 2주차에 접어들어 ‘숙련편’ 강의를 듣고 있다. 과제로는 이제 회원가입과 로그인, 로그인에 따른 제약사항을 거는 API를 구현하는 것이 추가되었다. 쿠키와 쿠키를 이용한 세션 방식, 그리고 JWT 형식으로 데이터를 주고받는 것에 대해 배웠다. Node.js의 cookie-parsor와 jsonwebtoken 모듈로 쿠키와 세션, JWT를 구현해보았다.Refresh token과 Access token이라는 개념에 대해 공부하고 구현해보았다. 이번에도 마감일자를 마련해놓고 해볼까 한다. 금요일이 제출일이니까 지난 번과 똑같이 (욕심껏 당기면)수요일까지, 아니면 목요일까지 만들어서 제출하는 것으로 해보겠다…!이번에까지 빨리 끝내보고서 지난 주 과자 ..

12/16 (자바스크립트에게도 제약된 문법이란 게 있었다, 금) TIL

몰입하지 못한 하루.오늘은 정오에 애자일 특강을 듣고, 오후에 트릿지라는 기업의 채용 설명회에 곧바로 이어서 과제 리뷰 실시간 강의를 듣게 되어서 공부를 많이 하지 못했다. 더불어 오전에 잠깐 시작한 프로그래머스 연습 문제를 붙잡고 점심때까지 있었고 (아주 쉬운 문제였다), 어느 특강에도, 어느 공부에도 온전히 몰입하지 못한 하루였다. 점검이 필요하다고 느낀다. 자바스크립트에서 2차원 배열 만드는 게 생각보다 제약이 있다는 것, 알고 있었나? 처음에 ‘1차원 레벨’에 지정해 놓은 크기를 벗어나는 인덱스에는 ‘2차원 레벨’에 해당하는 요소를 집어넣을 수가 없다. 당당히 에러를 띄운다. 그래서 자바스크립트에서 2D 배열에 동적으로 요소를 집어넣는 것을 연습했다. 크게 두 가지 방법이 있다. 처음에 빈 1차원..

12/15 (mongoose, 귀여운 이름과 그렇지 못한 방대한 문서, 목) TIL, TIT

(노드 입문편 개인 과제 제출함)오늘 에러는 우분투 서버에 MongoDB를 설치하다 하나 발견했고 그 외에는 없었다. 나중에 정리해서 한꺼번에 올릴 예정이다. 구현해야 하는 API를 크게 ‘게시글’ CRUD와 ‘코멘트’ CRUD로 나누면, 오늘 코멘트 부분을 다 만들었다. 어제 만든 게시글 API와 함께 기능 테스트를 완료했다. (의도한 대로 에러 메세지와 HTTP 응답 코드를 던지는 것을 확인함)mongoose의 findById(), findByIdAndUpdate(), findByIdAndDelete() 메소드들의 존재를 발견하고 활용법을 연습했다. findById() 하나만 해도 수많은 기능과 유의점들이 있다. 예를 들면 나는 아직 MongoDB의 ObjectID타입을 잘 검색하게 하려고 findB..

12/14 (만만한 Express API와 에러 나무, 수) TIL, TIT

(노드 입문편 개인 과제중)오늘 배포 전까지는 마치고 싶었으나 그도 못했다. 에러가 줄줄이 줄줄이 나고, 안 나더라도 찾아가서 예외 처리를 해줘야 돼서 또 예외 탐구 중이다. Node.js로 CRUD API 작성하기를 배우고 바로 과제에 적용하는 중이다.에러 탐색과 미진한 부분 테스트에 있어서 가지가 뻗치는 양상이 한 두 분기가 아니다. 최대한 쳐내고 본 가지만 따라가고 있는데도 오늘 글로 정리한 게 에러 번호 7번까지 있다. 보류해두고 지나친 가지까지 어렴풋이 따져보자면 거의 뭐 나무 한 그루가 그려지고 있다. 이번 과제 만만히 볼 게 아니었구나… 본 가지만 얼른 그려서 제출을 일단 한다고 하면, 이후론 어느 가지까지 그려낼 수 있을까. “좋은 개발자가 어떻게 될 수 있을까”에 대한 특강을 오늘 진행했..

12/13 (Node.js의 Router를 만나다, 화) TIL

(노드 입문편 개인 과제중)일단 오늘 하고자 하는 부분까지는 끝마쳤다. API 부분까지 강의 진도를 나가고 프로젝트 폴더 구조와 app.js, router 모듈 파일 두 개(posts.js, comments.js)를 대강 만들어놓았다. 내일 MongoDB와 어떻게 연결하는지와 배포 부분을 듣고 마저 하면 된다. Node.js의 세 가지 특성 - 논 블로킹 I/O, 싱글 스레드, 이벤트 루프. 더 깊이 조사해보고 싶다.REPL 환경은 입력 코드의 결과값을 즉시 볼 수 있어 편리한 개발 환경이다. 자바스크립트에게는 Node.js와 웹 브라우저의 콘솔이 REPL 환경이다. 그냥 IDLE이 거의 이 개념 아닌가..?제어권을 넘기지 않으면(=블로킹 환경) 비동기 처리가 가능한 환경이어도 비동기 처리를 수행하지 못..

12/12 (Node.js를 시작하다, 월) TIL

지난 목요일부터는 프로젝트 마감으로 정신 없어 TIL을 적지 못했다. 다 마치고 난 다음에는 뻗었고, 주말에는 다면평가(동료와 프로젝트 회고) 작성에 시간을 너무 많이 쏟았다. 공부를 거의 못한 것은 마음이 불편했으나 잘 자고 쉰 것은 잘했다. 글쓰기에 너무 많은 시간을 쏟는 것은 내 평생에 잘 해결되지 않는 문제이다. 어떡하면 좋을지. 자바스크립트 기본 문법을 다시 훑었다.변수와 상수의 구분은 메모리의 변수 영역에서, 그리고 가변과 불변의 구분은 데이터 영역에서 값이 바뀔 수 있는가로 구분짓는 것이다.거기서 기본형과 참조형 데이터의 불변, 가변 특성이 나타나고또 복사하거나 값을 변조할 때의 차이도 발생하며여기서 ‘불변 객체’라는 모순을 실현하려고 깊은 복사의 필요성이 생기게 된다. Node.js를 배우..

12/7 (API를 불러오는 서버사이드 렌더링 어떨까, 수) TIL

(2번째 프로젝트 하는 중) 더미 데이터를 만들어 게시글 테이블을 채워넣었다. 게시글을 저장하는 테이블은 하나이고, 그 안에서 카테고리에 따라 글이 네 가지로 분류된다. 그래서 저렇게 흩어진 게시글 번호가 나타난다. 조회수 항목을 추가하고, 날짜 형식을 제대로 (YYYY-MM-DD 형식으로) 출력하게 만들었다. 게시글을 클릭해서 조회하고 나오면 1씩 값이 늘어나 있는 것을 볼 수 있. 코드를 대폭 간단하게 만들었다. 예를 들면 카테고리별로 다른 데이터가 없던 시절에는@app.route('/mainBoard-layout') def mainBoardLayout(): category1, category2, category3, category4 = = _get_mainBoard_posts() return ren..

12/6 (서버 사이드 렌더링을 선택하다, 화) TIL

(2번째 프로젝트 하는 중) 사실 서버 사이드 렌더링을 선택했다기 보다는 마감 기한이 촉박하므로 flask의 render_template이라는 편한 기능을 이용하기로 한 것이지만. 어제 저녁에 게릴라 특강으로 들은, 내 프로그램이 백과 프론트를 동시에 들고 있는 ‘짬뽕 방식’이냐, API 역할만 하는 ‘순수 백’이냐의 차이를 지칭하는 용어가 바로 ‘서버 사이드 렌더링’과 ‘클라이언트 렌더링’이었다. 개발하는 데 있어서 고려해야 하는 주제를 이렇게 또 하나 알게 되었다. 메인 게시판 페이지를 완성했다.어제 카테고리 게시판 페이지 샘플에 기초하여 나머지 3개를 만들었다.최신 글이 먼저 보이도록 정렬하였다. 글쓰기 버튼을 추가했다. 글쓰기 페이지가 완성되면 링크를 걸면 된다.최신순과 조회순 버튼도 만들어뒀지만..

12/5 (render_template을 반환하는 응답은 API가 아니었다, 월) TIL

(2번째 프로젝트 하는 중) url_for()와 request.args.get() 등의 활용법을 알게되었다. # html # app.py def category1Layout(): ... page = request.args.get("page", 1)⇒ 이런 코드가 동작하는 방식을 이해했다. 어제까지 주말엔 게시판(홈) 페이지와 카테고리별 목록 페이지 틀을 잡았고, 오늘 페이지네이션과 링크이동을 구현했다. 저녁 반짝 특강에서 API란 순수 데이터, 즉 html, css, javascript가 포함되지 않은 데이터를 응답으로 주는 것을 의미함을 알게 되었다. 쉽게 말해 JSON을 응답으로 보내면 API이고, render_template()으로 만든 html을 응답으로 보내면 API가 아닌 것이다. 모든 상황에..