차마시는 개발자

개발에 관해서 멘토링을 받았는데 뭔가 잘보여야 한다는 약간의 걱정과 친구집 이슈로 인해 아주 깊은 이야기를 꺼내지는 못했습니다. 그러나 이번 멘토링을 하면서 크게 3가지를 여쭤보고 생각하는 시간을 가지게 되어 좋았습니다. 1. 팀장의 역할 이번 프로젝트를 진행하는데 팀장을 맡게 되었습니다. 그런데... 실력이 부족한 것 같아 고민이 되었습니다. 실력도 중요하지만 프로젝트를 성공적으로 이끄는 역할 2. 생활 패턴 계획을 정하고 이것을 꼭 마무리해야한다는 고집? 때문에 최근 생활패턴이 무너져 버렸습니다. 그래서 이에관한 조언을 얻고 싶습니다. 여러 팁들이 있었지만 3가지를 지켜보도록 합니다. - 취칩시간을 정하자 - 식습관을 관리하자 - 시간을 관리하자(꼬모도모 or 하루의 생활에 대한 일기) 3. 취업 취..

😸 Vue TIL 😽 Done it 😼 코드리뷰 회고 1 ~ 7: https://gwpaeng.tistory.com/418 Vue: https://gwpaeng.tistory.com/419 😼 React JSX 보통 {}를 이용하여 실행합니다. 😼 값 default 함수.defaultProps 함수.defaultProps = { size: 200, }; 인자에 지정 function 함수({ size = 200 }) {} 😼 값 type check import PropTypes from 'prop-types'; 함수.propTypes = { size: PropTypes.number, }; 😼 useState useState: 지역상태 관리하기 위한 것(Hook) 값이 변경되면 다시 렌더링 한..

😸 CSS TIL 😽 Done it 😼 @extend 이미 작성해 놓은 선택자 가져오기 but!! @mixin을 주로 사용합시다. 추가로 @media에서는 @extend를 내부에서 선언해야만 사용가능합니다. 또한 선택자 폭발이라는 부작용이 있는데 중첩을 할 때 선택자 부분도 상속이 되면서 문제가 발생한는 것입니다. //1. .a { } .b { @extend a; }%: placeholder로 오로지 @extend 규칙을 확장해서 사용할 수 있는 것 %a { } .b { @extend a; }@mixin 사용 방법 // @mixin 사용법 @mixin a { } .b { @include a; }😼 함수 js에서의 function과 매우 유사합니다. 다만 @를 붙여줘야 합니다. @function a() {..

😸 CSS TIL 😽 Done it 😼 Grid container :2차원 layout에서 사용 justify-content: normal : column 위치 조작 align-content: normal : row 위치 조작 (normal == stretch) 명시적 딱 정해 놓고 있는 부분 grid-template-rows, grid-template-columns 암시적 명시적 이외의 부분 grid-auto-rows, grid-auto-columns grid-auto-flow grid-auto-flow: row: row 방향으로 쌓이게 만들겠다. grid-auto-flow: column: column 방향으로 쌓이게 만들겠다. grid-auto-flow: (row) dense: 빈공간 제거하며 row..

TIL Done it history api 너무 중요한게 많아서 블로그에 정리했습니다. :) Feeling 과제를 진행하고 PR을 날리는데 과제를 진행할때 단계별로 계속 commit을 날리다 보니 commit이 엄청 많아지고 이것을 다 정리해서 PR을 날리는 것이 절말 어렵고 효율적인 방법이 없나 고민하게 됩니다. 그래서 우선 최종본을 넣고 큰 틀에서만 링크를 걸어 넣고 있는데 뭔가 아쉬운 느낌이 듭니다. ㅜㅜ 그래도 이번 과제는 많이 발전 할 수 있는 기회가 된 것 같아서 매우 좋았습니다. 아직 더 익숙해 져야 하지만 과제가 나오면 빨리 만들고 refactoring을 하는 식으로 하는 것이 엄청 좋은 방법인 것 같습니다. :) REF https://gwpaeng.tistory.com/389

TIL Done it Promise Error handling Promise.reject을 있 을 때 Error을 출력하지 않고 나중에 원할 때 출력하는 방법 클로저 문제에 대한 var와 let의 차이점 명령형 프로그래밍 "어떻게" 처리하는 것이 있는 프로그래밍 일일이 과정이 다 나와 있는 프로그래밍 const a = (arr) => { for (let i = 0; i { arr.forEach((v, i) => console.log(v)); } Error handling 동기적 1. 인자 지정 fu..

TIL Done it document.createDocumentFragment() DOM 트리를 build하기 위해 DOM 노드를 추가할 수 있는 새 공간을 만들어 줍니다. => 가상 공간을 만들어 계속 DOM이 추가 되고 렌더링 되는 것을 막기 위한 방법 box-sizing content-box: width, height 포함, padding, border 미포함 border-box: width, height, padding, border 포함 Promise Callback 함수와 다르게 비동기 상황을 다룹니다. Promise라는 class를 통해 만들어진 instance를 반환하는데 그 값은 대기(Pending), 이행(Fulfilled), 실패(Rejected)를 다루는 일급 값으로 이루어져 있다...

TIL Done it Dynamic Programming(DP) Memoization 하향식 접근 (작은 것 -> 큰 것) => 작은 값(저장)을 통해 큰 값 찾는 방법 필요할 때 계산 Tabulation 상향식 접근 => 미리 답을 구해놓고 필요할 때 사용하는 방법 미리 계산 HTML : Structure + Semantic CSS: Expression 선택자, 복합 선택자 코드리뷰 초기 (고수준 피드백) 버그, 장애, 성능, 보안 Extract Method, Composed Method, Invert-if(복잡도) 후기 (저수준 피드백) (선택적인) 설계 개선 변수명 변경, 주석을 명확하게 하는 것 ... [Nit] 태그 활용: 고치면 좋지만 아니어도 그만 Feeling 마지막 커피챗을 하였습니다. ..