[스파르타코딩클럽] 내일배움캠프 개발일지

## 오늘 배운 것 - 팀 소개 미니 프로젝트(스파르타 웹개발 종합반 강의를 토대로 레이아웃 및 기능 구현) 와이어프레임 작성, 역할 분담, 개발 스케쥴 조율 - GitHub 회원가입 완료 - Git과 GitHub에 대한 개념 이해 및 이를 이용한 협업 프로세스 강의

오늘의 작업 미니 프로젝트 2일차(팀 소개 페이지 만들기): 팀원들과 각자 만든 메인 페이지를 비교하면서 각각 구현한 디자인과 기능을 한 페이지로 취합했다.

(사실 어제 9시까지 써서 제출했어야 했는데 도저히 그럴 여력이 안됐다...)오후에 튜터님 피드백을 받은 후 갑자기 수정하고 추가 개발해야할 상황이 많아졌다... 오타나 디자인 지적도 있었지만 기능 위주로 정리하면...<튜터님 요구사항>접속한 사람의 위치 기준으로

(TMI) 분명히 9시 전에 벨로그를 작성했는데 출간하기 후 모든 내용이 날아가서 분노하며 다시 쓰는 TIL....각자 작업한 팀원 소개 페이지(모달창) html 코드를 리뷰하고, 전날 작업한 메인 페이지에 모으기로 했다.팀원별 방명록 저장 및 불러오기 기능까지 구현되

### 오늘 한 일 팀 소개 프로젝트 발표날이었다! 어제까지 거의 모든 수정사항을 반영했다고 생각했지만...(개인 방명록을 팀 방명록으로 대체한 것 외에) 아침에 방명록과 버킷리스트에 공백 문자를 허용하지 않는 조건문을 완성하지 못했다는 걸 깨닫게 되고...

팀 소개 미니프로젝트 KPT 회고 3시간에 걸친 발표가 끝나고 KPT 회고라는 걸 했다. KPT는 다음 세 가지 항목이다. > K: Keep(유지하고 싶은 것) P: Problem(문제점) T: Try(해결 방안) 나의 KPT 회고는 다음과 같다. Keep:

## 오늘 한 일 지옥의 (...) 첫 미니 프로젝트가 끝나고 드디어 공부하는 주가 돌아왔다. 다음 프로젝트에서 성장한 모습을 보이기 위해 농떙이 안 부리고 열심히 공부해야지! (늘 시작은 이렇게 거창하게.. 하하...) 이번 주에는 파이썬, 자바스크립트, 자료구조

## 오늘 한 일 아침 2시간 동안 알고리즘 강의를 들었다. 오늘부터 3일 동안 실시간 알고리즘 강의를 듣게 된다. 내가 기대하는 알고리즘 강의는 문제를 해결하는 방식을 배우는 것인데... 정답 해설만 해주는 정도라 아직은 잘 모르겠다. 어제처럼 알고리즘 공부한 것

오늘 한 일 스파르타에서 제공해준 자바스크립트 공부를 끝내고, 드디어 알고리즘 강의를 시작했다. 자바스크립트는 초초초초 기초 문법을 설명해준 거라서 한번 쭉 들었고... 이제부터가 정말 지옥문. 어제 유데미에서 파이썬 부트캠프 강의를 3일차까지 들어서 약간의 두려움은

오늘 한 일 알고리즘 실시간 강의 2일차였다. 링크드리스트의 정의와 구현하는 방법에 대해 배웠다. 링크드리스트의 개념을 이해하고 클래스로 구현하는 것까지는 간단(?)한 편이었으나, 원하는 위치에 노드를 추가하고, 삭제하는 것이 이해하는 것이 쉽지 않았다. 아래에 코드

오늘 한 일 3일에 걸친 실시간 알고리즘 수업이 끝났다. 오늘은 stack, que 자료구조와 재귀함수....를 배웠는데 대충 개념만 알았을 뿐 정확히 이해한 것 같지는 않다. 그중에서도 stack, que는 대학교에서 1학기 동안 배우는 과정이라고 한다. (라는 사실

이번 주 한 일 미니 프로젝트가 끝나고 새로운 팀이 배정된 후 한 주가 흘렀다. 이번 주에도 많은 일이 있었다... 알고리즘과 자료구조의 늪에 빠지기 시작 udemy 파이썬 부트캠프 강의 수강 중 스파르타에서 제공하는 자바스크립트 올인원 강좌와 파이썬 강좌 완료했으나

## 오늘 한 일 - 유데미 웹 부트캠프 자바스크립트 강의 듣기 (콜백함수, map 함수... 혼공스에서 배웠는데 왜 리셋이 되었는가...) - 팀원들과 깃 & 깃허브 & 소스트리 스터디 - 스파르타 알고리즘 강의 듣기 (이진탐색, 재귀함수, 정렬 파트)

## 오늘 한 일 3시에 알고리즘 타임어택 시간이 잡혀 있었다. 그동안 밀린 부랴부랴 스파르타 알고리즘 강의를 들었는데... 재귀함수와 정렬(버블정렬, 선택정렬, 삽입정렬, 병합정렬) 파트 해설을 봐도 이해가 안 가고... 나동빈님 유튜브 채널 보고 조금 힌트를 얻었지

오늘 한 일 아침에 알고리즘 해설 듣고 10시부터 4시까지 SQL, DB 특강을 들었다. 강의노트가 꽤 길어서 기대를 했었는데... 강의 중간에 튜터님도 에러를 해결하지 못해 우왕좌왕하는 모습을 보여... 집중을 하기가 힘들었다. (강의 준비가 제대로 된 건지 의심이

오늘 한 일 REST API 특강 듣고, 소스트리로 깃허브에 팀원들과 push를 연습했다. 점심 먹고 HTML, css 특강을 듣고... (오늘도 역시나 3시간 ㄷㄷ) 특강 끝나고 다시 소스트리로 깃허브에 merge 연습을 했다. 내일부터 다시 팀 프로젝트 시작이기에.

드디어 정식 미니 프로젝트가 시작됐다.이번에는 뉴스피드 사이트(내 게시물을 포함한 모든 게시물을 볼 수 있는 공간, ex. 벨로그, 링크드인, 디스콰이엇 등)를 만들어야 하는데, 기능 요구 사항은 다음과 같다.기능 요구 사항 \- 로그인 \- 회원 가입

특강이 유난히도 많았던 이번 한 주. 솔직히 스파르타에서 제공해준 특강보다 내가 찾아봐서 공부한 것들이 얻은 게 더 많은 것 같긴 하다. 이번 주에 배운 것들은 TIL로 기록했으니 주말 동안 배운 것들을 기록해보려고 한다.

로그인 기능을 얼추 구현했으나, 로그인 성공 시 세션을 유지되게 하는 것은 아직 성공하지 못했다. 게다가 비밀번호도 그대로 DB에 저장하는 게 아니라 암호화 과정을 거쳐야 한다고 한다... 힌트는 얻었지만 아직까지 코드에 어떻게 반영하는지는 정확히 찾지 못했다. 내일

## 오늘 한 일 로그인할 때 세션(session) 값을 저장했다고 생각했는데, console에 찍어봐도 찍히지가 않아서 어디가 잘못됐나 했다. 한참을 찾아보다가 개발자 도구 > application에 cookie 부분에 session 이 잘 저장되어 있는 것을 확인했

## 오늘 한 일 - 프로필 페이지 이미지 업로드 방법 알아보기 → form 태그로 이미지를 업로드한 후 pymysql로 DB에 '파일 제목'을 입력하는 것은 성공 → 프로필 사진 영역에 저장한 이미지를 불러오는 것은 실패 → 프로필 사진을 불어오려면

오늘 한 일 로그인과 회원가입 기능을 연결하기 → 이 과정에서 에러가 여러 차례 발생해서 수정하는 데 꽤 오랜 시간이 걸렸다. → 문제는 회원가입을 했을 때 비밀번호를 암호화하는데, 이 암호화한 비밀번호 값이 로그인을 할 때 암호화된 값이랑 맞지 않아서 발생하는 것처럼

드디어두 번째 미니 프로젝트가 끝났다!!!!!프로젝트의 마무리.KTP 회고를 써본다.keep:팀원들 서로 존중하고 에러를 함께 처리하려고 하는 모습적극적으로 도움을 요청하고 해결해나가려고 하는 자세깃허브 협업을 준비하기 위해 미리 스터디한 것Problem:초기 설계 부

팀 프로젝트 진행 및 발표와... 벌써 4주차라니...? 아직까지 코드 하나 제대로 생각해서 못 쓰는데...?다음 주부터는 드디어 본격적인 주특기인 Node.js 공부가 시작된다. 서버 만들 때 Python flask만 쓰다가 또 갑자기 js를 쓰려니... 복습이 시급

오늘 한 일 새로운 팀원들과 인사/자기소개/팀명 정하기 express 프레임워크로 웹서버 만들기 express.js 프레임워크로 웹 서버 만들기 기본 코드 thunder client로 api 확인해보기 cannot find module 에러 vsc 재실행해보니

express 서버에서 API 연결되지 않는(무한 로딩되는) 에러 해결 \- 어이없게도 router module을 불러오는 파일 경로를 잘못 지정해줘서 생긴 에러였다. Schema 파일에서 불러오는 게 아니라 해당 route가 있는 route 폴더 내의 파일에서 불

## 오늘 한 일 - 노드 입문 주차 개인 과제

노드 입문 주차 개인 과제 마무리 / AWS 서버 배포 할 때 데이터 이전 필수

Node.js 주특기 트랙 본격적으로 시작된 한 주 돌아보기 / MongoDB objectId 의미 / Nodemon 사용해보기

쿠키, 세션, JWT 인증 방식, Access token, refresh token의 정의와 차이

res.send() vs res.json() vs res.end() 차이 / res.cookie() 메서드 사용법 / Sequelize 사용하기

처음 써보는 자바스크립트 정규표현식 / ERD 데이터 타입 linestring vs. multistring 차이 / ERD 데이터 타입 text vs. varchar 차이

하루 종일 나를 괴롭혔던 node.js sequelize Error: Invalid value... 해결!

VSCode gitHub 연동 에러 해결 / git 명령어 모음 (혼자 작업할 때 초기 세팅 & 이후 commit push)

AWS RDS 설치, sequelize로 DB 연결하기mongoose로 구현된 mongoDB를 sqeulize를 이용하여 Mysql로 변경하기 (약간의 sequelize 문법을 배움. findAll, create, update, destroy, where, order

Prettier 사용법 / socket.io 사용하기

객체지향 프로그래밍의 법칙 / 3-Layered Architecture(3계층 아키텍처) express에서 구현하기

javascript spread 문법 (js ...) / 영문 대소문자, 숫자, +, -, _ 가 존재하면 통과하는 정규표현식 / jest로 단위 테스트(unit test)하기 / 그리고 발생한 에러들...

jest 단위 테스트에 사용된 js new 연산자 분석 / js class와 constructor 정리

실시간 세탁 서비스 팀 프로젝트 / SA (Starting Assignment) / 요구사항 / API 명세서 / ERD (1차)

내일배움캠프 7주차 회고.

Sequelize 컬럼 추가 및 삭제 시 migration / 주의사항 / Sequelize 자주 사용하는 명령어들

Cannot read properties of undefined (reading 'includes')

ejs 렌더링 에러 - Error: Failed to lookup view "error" in views directory

node.js error 발생 시 alert 메시지 노출하기 res.write로 alert 노출하기 Ajax 호출 에러

내일배움캠프 3차 미니 프로젝트 KPT 회고

DB 설정(ERD) / sequelize 관계 설정

내일배움캠프 8주차 회고

WebSocket 클라이언트 데모 소스 / 간단한 메시지 전송하기 소스

websocket 메세지 buffer 로 표시되는 에러

socket.ito 메서드 정리 / Adapter 확인하기 / Map / Set 자료 구조

queue 라이브러리 사용해보기

JWT로 사용자 인증 기능 만들기 / 재로그인 시 마이페이지로 이동

내일배움캠프 9주차 회고

파이썬 문자열을 for 반복문으로 반복할 때 / 문자열 내의 문자를 숫자로 변환하기

Typescript 클래스 속성 / 타입을 정의하는 방법 (type vs interface) / 추상 클래스를 인터페이스로 변경하기

static 속성과 메소드

js 메서드의 타입 정의 파일 (lib.dom.d.ts) / 유니온(Union) 타입 좁히기(type narrowing) / 타입 별칭(Type Alias)으로 중첩 객체 지정 / 객체 구조분해할당으로 코드 리팩토링 / 2차원 배열 타입 선언 등

타입스크립트 퀴즈 정리

내일배움캠프 WIL 10주차 회고.

타입스크립트 타입 좁히기 (type narrowing) 종류

http 모듈로 서버 만들기 / 데이터 스트림과 buffer 메모리

Must use import to load ES Module 에러

Router.use() requires a middleware function but got a undefined 에러로 살펴본 moudule.exports와 exports의 차이

error TS2451: Cannot redeclare block-scoped variable 'jwt'. / error TS2339: Property 'status' does not exist on type 'Error'.

'왜 keyof이 아닌 keyof typeof을 써야할까'에 대한 고찰

내일배움캠프 11주차 회고.

Object.keys() / Object.values() / Object.entries()의 함수 시그니처를 알아보자

Javascript reduce 함수 예제 정리 (1)

내일배움캠프 4차 프로젝트: 이커머스 프로젝트 SA

sequelize 초기 설정 명령어 / sequelize 외래키 참조 관계 설정

crypto 모듈로 비밀번호 암호화 구현하기

seed 파일이 필요한 이유 / seed 파일 작업 프로세스 (암호화된 비밀번호 넣기)

내일배움캠프 12주차 회고.

장바구니 상품 수량 수정하다가 발견한 어이없는 sequelize error.

장바구니 상품이 이미 있을 때 특정 수량만큼 증가시키기: sequelize increment 함수

목표: 장바구니와 상품 테이블을 연결해서 해당 상품의 이미지를 가지고 오고 싶다 / sequelize include 함수 사용하기

옵셔널 체이닝(?.) 사용하기

내일배움캠프 4차 팀 프로젝트 (이커머스 프로젝트) KPT 회고.

nest.js 초기 세팅

자바스크립트 생성자 함수 / prototype 문법 / class 문법

내일배움캠프 13주차 회고.

nestjs 개념 정리 (IoC, DI, DTO)

javascript 내장 객체 Array 클래스에 대하여

nestjs DTO / nest-js/mapped-types 사용하기

typeorm @primaryGeneratedColumn() vs. @PrimaryColumn()

nestjs custom pipe 사용하기

axios ERR_SSL_PROTOCOL_ERROR 에러 해결 방법

내일배움캠프 14주차 회고.

localStorage & SessionStorage

XSS vs. CSRF 웹해킹 공격 차이 / 세션 vs. jwt 토큰 차이 알아보기 (세션과 토큰 중 어떤 방식이 더 안전할까?)

typeorm @Entity() database vs. schema nestjs 게시판 엔티티 만들기 강의를 보다가 생긴 의문.

error: illegal arguments: undefined, string / Field 'username' doesn't have a default value ... 회원가입 api를 만들고 bcryptjs로 비밀번호 암호화까지 끝냈는데, 갑자기 발생한 에러.

typeorm 관계 설정 (1:1, 1:N, M:N)

내일배움캠프 WIL (15주차)

nestjs nodemailer 라이브러리로 회원가입 시 인증 메일 보내기 (feat. nestjs @Post @Get 데코레이터 사용 시 주의사항)

typeorm-extension cannot find module / seeder is not a constructor 에러 해결

Jest unit test 코드 작성 시 describe(), it() 구문의 차이 / BDD 스타일

javascript 배열 내 중복 요소 제거하기 (new Set(), Array.from())

Axios post 요청 시 에러 발생 오늘의 할 일은 워크샵 수강 신청 API와 프론트 통신 연결을 진행하는 것. 프론트에서 axios로 post 요청을 보내는 코드를 작성했으나 에러가 발생했다. 브라우저 콘솔을 확인해보니 post 요청이 안 되고 get 요청만

찜 여부 확인하기 기능 워크샵 상세 페이지에 찜 하기 기능을 추가했다. 디폴트는 빈 하트(♡) 상태로 있다가 찜 하기를 한 유저가 접속하면 채운 하트(♥)를 보여주려고 했다. 이와 같이 동적으로 찜 아이콘을 보여주려면 다음과 같은 로직이 필요하다. 현재 우리는 wi

ejs로 변수 전달하기 워크샵 상세 페이지에서 로그인을 한 사용자만 워크샵 신청을 할 수 있도록 제한을 하고 싶었다. 즉, 워크샵 신청 버튼을 누르면 사용자가 로그인을 했는지 확인해서 비로그인 상태일 시 '로그인 후 이용 가능합니다'라는 경고창 메시지를 노출해야 한다. 워크샵 상세 페이지 render (신청 페이지 모달 포함)js @Get('/det...

aws s3 / CloudFront 사용하는 이유

Expression #10 of SELECT list is not in GROUP BY clause and contains nonaggregated column '컬럼 명' which is not functionally dependent on columns in GROUP BY clause; this is incompatible with sqlmode=on...

[NestJS] Body로 데이터 보낼 때 DTO로 보내지 않는 경우 주의하기 / DTO 작성 시 validationPipe whitelist: true 설정되어 있는 경우 ('propery ~ should not exist' 에러 해결)

Typeorm softDelete된 값을 가져오지 못함 / WHERE IN 문법 사용하기

빈 객체({}) 검사하기 / Objec.keys 메소드 사용하기

강사 등록 시 사업자등록번호를 입력하는 폼이 있어 데이터 타입을 int로 지정했다.그런데 테스트해보니 일정 크기 이상의 숫자를 작성하면 2147483647로 자동적으로 입력되어 저장되는 것을 발견했다.(사업자등록번호는 10자리를 가지는데, int 타입으로 지정하면 21