Today I Learned

노마드코더 유튜브 클론코딩 #8.14 Bugfix 공부내용 정리 비디오 업로드시 유저비밀번호를 해시하던 현상 수정 유저가 비밀번호 변경시에만 해시되도록 수정 == isModified("password") userSchema.pre("save", async function () { if (this.isModified("password")) { this.password = await bcrypt.hash(this.password, 5); } }) 비디오 수정,삭제시 비디오 소유권자만 작업할 수 있도록 기능추가 story.owner의 타입은 object이고 _id의 타입은 String이므로 ' !== ' 연산자로 비교가 불가능하기 때문에 String으로 형변환을 해줘야한다. const { user: { _id..

Springboot에서 gradle library를 사용하는 경우 데이터베이스와 연동하는 방법과 데이터 저장 및 조회를 하는 방법을 간단하게 정리하였다. 데이터베이스연동 데이터베이스 저장 및 조회 데이터베이스 연동 프로젝트의 src > main > resource에서 application.yml 파일 생성 spring: datasource: url: "jdbc:mysql://localhost/library" username: "root" password: "" driver-class-name: com.mysql.cj.jdbc.Driver 데이터 저장 및 조회 package com.group.libraryapp.controller.user; import com.group.libraryapp.dto.user..

오늘 TIL 3줄 요약 - 개발자에게 중요한건 꺽이지 않는 마음. - 개발자 공부 루틴: - 언어 이름의 유래 TIL (Today I Learned) 날짜 2023. 02. 19 오늘 읽은 범위 에피소드 01 ~ 05 책에서 기억하고 싶은 내용을 써보세요. 공식문서 , 문법 확인, 다른언어와 비슷한 특징 보기, 새 언어로 코딩 시도, 튜토리얼 시작하기, 나만의 프로젝트 만들기 오늘 읽은 소감은? 떠오르는 생각을 가볍게 적어보세요 - [에피소드03 새 언어를 쉽게 배우는 노하우] 이 부분은 개발공부의 정석이라고 생각한다. - 언어의 유래는 소소한 재미를 느낄 수 있었다. - 한번보고 덮을 책이 절대 아닌 것 같다. 궁금한 내용이 있거나, 잘 이해되지 않는 내용이 있다면 적어보세요. 없음. 오늘 읽은 다른사..

노마드 개발자 북클럽 도전 인증샷

스타트업으로 이직하고나서 퍼블리싱을 하게 생겼다. 부분수정은 할 줄 알지만 설계부터 시작해서 새로운 것을 만드는 것은 해본 적이 없다. 발 등에 불 떨어졌다. 노마드코더 니코선생님 강의를 보면서 10x19라는 사이트를 CSS 클론코딩했다. 단순히 보고 따라하는 수준으로 클론코딩을 하는 건 전혀 어렵지 않다. 하지만 웹개발 6년차인 내가 퍼블리싱 실력이 이렇게나 터무니없이 약하다는 걸 오늘 제대로 확인하게됬다. 실제로 퍼블리싱을 하게 됬을 때 얼마나 막막할 지 대충 감이 온다. 클론코딩을 하면서도 상황에 맞게 이해하려고 온 집중을 다했다. 현실자각은 최고의 동기부여는 현실자각만한게 없다 진짜... 코로나 양성으로 인해 1주일 쉬고 있는 지금, 미친놈처럼 퍼블리싱만 해서 감을 익혀야겠다. 10x19 10x1..

1. css 에러를 확인할 수 있다. scss를 사용하게되면 scss -> css 변환 작업 중 에러 발생시 콘솔에 에러를 출력해준다. 2. variables / nesting css를 javascript처럼 전역변수,부모 자식 개념을 활용할 수 있다.

https://cssgridgarden.com/#ko Grid Garden A game for learning CSS grid layout cssgridgarden.com CSS Grid 공부하는 사이트. 총 28문제까지 있는데 초보자가 기본기 익히기에 정말 괜찮은 사이트인 것 같다. 문제를 풀고 다음문제로 넘어갈 때의 성취감이 상당히 짜릿하다. 초반 문제는 대부분 비슷한 해답을 가지고 있지만 후반부로 갈수록 여러방식의 정답이 있는 것 같다. 공부중인 css를 실제 업무에서도 능수능란하게 쓸 수 있도록 깊게 파고 들어야겠다.

/* CSS Grid를 배우는 이유 : element를 Flex를 활용하여 좌우배치, 중앙배치는 용이하지만 grid형태로구현하는 것은 어려움이 있기 때문 grid-template-columns : 한 열의 너비를 결정하는 property grid-template-row : 한 행의 높이를 결정하는 property gap (gap-row, gap-column) : grid의 행 또는 열의 간격을 결정하는 property grid-template-areas : header, content, nav, footer 4가지 영역으로 위치를 할당해줌 (tiles와 유사) repeat : 반복함수 grid-column-start, grid-column-end, grid-row-start, grid-row-end 를 ..

align-items : flex line을 기준으로 아이템을 정렬한다. align-content : flex line 자체를 정렬한다. flex-wrap : wrap 으로 인해 line이 2줄 이상 되었을 때 의미가 있다.

justify-content : main axis 방향 item 제어 start end center space-between space-around space-evenly align-items : cross axis 방향 item 제어 flex-start flex-end center 아래의 사이트에서 게임을 통해 Flex에 대해 감을 익힐 수 있다. Flexbox Froggy A game for learning CSS flexbox flexboxfroggy.com