내가 보려고 쓰는 기록

원티드에서 주니어 개발자 취업을 위한 이벤트가 진행된다고 했다. 오 저번주에 바ㄹㄹㄹㄹ로 신청 3/20 오늘 zoom으로 OT 및 간단한 강의를 진행했다. 참가자 수가 1000명이 넘었다고 했다. (모두 나의 경쟁자들...) ● 기획의도 주니어 개발자들이 나만의 원티드 이력서를 작성해서 하나의 기업에라도 지원을 해보자! ● 일정안내 ● 취업 활동 혜택 마지막에는 완주자 선착순 300명에게 스타벅스 커피 쿠폰을 주고 완주자를 위한 혜택을 제공한다. 무슨 혜택? 주니어를 채용하는 기업을 찾아서 주니어가 합격확률이 높은 기업을 제공! (*완주자란 원티드 이력서를 완성하고 3/20 이후에 완성한 이력서를 한군데이상의 기업에 지원한 사람) 이번주엔 프리미션 진행하고 인증하기 인증을 해야 내 역할이 레벨업 되어서 ..

getFullYear( ) : 주어진 날짜의 현지 시간 기준 연도를 반환 (*new Date( ) 와 많이 씀) new Date().getFullYear() //2023

리액트를 공부하다가 자바스크립트 지식이 정말 중요하다는 것을 알게 되었다. 리액트의 useState를 자바스크립트에서는 어떻게 만들었는지 기억이 안나서 클론코딩을 하며 자바스크립트 문법들을 다시 복습해 보았다. 만들면서 이해되지 않은 부분 time>0라는 조건문이 참이면 time에서 1씩 감소되고, 거짓이면 1초마다 실행되는 카운트다운 함수를 멈추게하는 삼항 연산자였는데 거짓부분에 그냥 바로 clearInterval(interval) (*카운트다운 함수를 즉시 종료시켜줌)을 넣어버리는게 낫지 않나 생각했었다. 왜 굳이 isPlaying이란 변수를 만들어서 false, true 값을 주고 !isPlaying라는 조건문을 또 만들어서 clearInterval(interval)을 실행시키게 하는지 이해가 안되..

커밋 메시지 작성시 전체적인 포맷 타입(Type): 제목(Subject) 본문(Body) 꼬리말(Footer) 타입(type) 해당 커밋은 무엇에 대한 작업인지 키워드를 통해 표시 Feat - 새로운 기능 추가 Fix - 버그 수정 Build - 빌드 관련 파일 수정 Ci - CI관련 설정 수정 Docs - 문서(문서 추가, 수정, 삭제) Style - 스타일(코드 형식, 세미콜론 추가: 비즈니스 로직에 변경 없는 경우) Refactor - 코드 리팩토링 Test - 테스트(테스트 코드 추가, 수정, 삭제: 비즈니스 로직에 변경 없는 경우) Chore - 기타 변경사항(빌드 스크립트 수정 등) 제목(subject) 커밋 메세지의 제목 제목은 50자를 넘기지 않고, 마침표를 붙이지 않아야함 제목에 커밋 타..

데이터를 저장할때 구분할 수 있어야 하므로 고유의 _id를 달아서 저장해야 함 몽고DB에서 자동으로 id값 부여되는 이유가 데이터 구분하려고! 데이터 여러개면 id값 하나하나 달기 힘드니까 기존 게시물 총 개수에 +1 해주는 기능 만들면 편할듯 DB에 항목 추가할 때마다 자동으로 id값을 1씩 증가시켜서 저장시켜주는게 auto increment 1. 기존 게시물 총 개수 + 1 의 데이터가 들어갈 곳을 fineOne( )을 사용해서 찾기 db.collection('counter').findOne({name:'게시물개수'},function(에러,결과){ console.log(결과.totalPost); var 총게시물개수 = 결과.totalPost; }); *컬렉션을 따로 만들어서 저장하는게 편함 2. po..

request - 요청 - 서버에 정보 달라고 요청, 서버는 항상 대기중이다가 request가 들어오면 반응하는 것 - request에 대한 처리를 한 후 결과를 response 객체로 돌려줌 - resquest로 요청에 대한 정보를 얻을 수 있음 - 브라우저에서 주소치는 것은 페이지 가져오는 것이므로 GET 요청 ex) http 메소드는 GET url 은 슬래시 조건문이 참이면 restFront.html 실행 http://localhost:8082하면 GET + ' / ' 로 요청을 보내는 것이므로 restFront.html 실행 * 뒤에 ' / ' 슬래시 생략된 것 요청을 보냈을때 개발자도구-Network 탭 들어가보면 실제 요청에 대한 정보 볼 수 있음 200은 req이 성공적으로 res(응답)되었..

만약 부모컴포넌트에 카운트+1 되는 버튼이 있다면 버튼 클릭할때마다 그 안에 있는 자식컴포넌트도 재렌더링됨 자식컴포넌트까지 계속 재렌더링 되버리면 성능이 저하됨 (자식컴포넌트가 무거울수도 있으니까) 내가 꼭 필요할때만 자식컴포넌트 재렌더링 시키고 싶으면? 자식 컴포넌트 만들때 memo 함수 안에 담아서 만들면 됨 memo - 자식 컴포넌트 꼭 필요할때만 재렌더링 1. import memo 2. 자식컴포넌트를 memo 함수로 감싸서 만들음 ● 원래 컴포넌트 ● memo로 감싸서 만든 컴포넌트 memo의 원리 memo는 그냥 재렌더링을 막아주는게 아니라 특정상황에서만 막아줌 부모에게 받은 props가 변할때는 재렌더링됨 부모 컴포에 있는 count state 자식 컴포에 props로 count state 전..

개발자도구 props 보냈는데 출력 안되는 경우, 이미지 경로 잘못되어서 이미지 출력 안나오는 경우 등 버그 생기면 개발자 도구를 확인해서 찾음 but 우리는 컴포넌트로 만드는데 개발자 도구에서는 일반 html로 나옴 컴포넌트 구조를 미리 보고싶으면 크롬 웹 스토어에서 React Developer Tools 설치 개발자도구에 Components, Profiler 탭 생김 ● Components - props, state 등 어떻게 반영되는지 확인 ● Profiler - 성능저하되는 컴포넌트 범인 찾기 컴포넌트 렌더링 시간은 보통 빠름, 대부분의 지연원인은 ajax 요청임 - 서버에서 데이터 늦게오는 경우 lazy import - 메인페이지 로딩 속도 개선 가능 SPA(Single Page Applicat..