Today I Learned

책에서 기억하고 싶은 내용.소프트웨어를 짜는 행위는 여느 글짓기와 비슷하다. 논문이나 기사를 작성할 때는 먼저 생각을 기록한 후 읽기 좋게 다듬는다. 초안은 대개 서투르고 어수선하므로 원하는 대로 읽힐 때까지 말을 다듬고 문장을 고치고 문단을 정리한다. (P.61)읽고난 후의 생각.함수라는 파트를 아주 잘 정리한 한 문장이라 생각한다. 오늘 회사에서 프로젝트에 필요한 공통기능인 순수 자바스크립트로 DB를 이용한 '버튼 공통모듈화' 작업을 시작했다. 하지만 성급한 마음만 앞서다보니 간단한 설계하나 제대로 못한 채 퇴근 30분전까지 아무 성과가 없었다. 위의 잘 정리된 한 문장을 잘 곱씹어볼 때인 것 같다. 궁금한 내용 또는 이해되지 않는 내용 메모.없음

책에서 기억하고 싶은 내용.의도를 분명히 밝혀라 그릇된 정보를 피하라 의미 있게 구분하라 발음하기 쉬운 이름을 사용하라 검색하기 쉬운 이름을 사용하라 인코딩을 피하라 자신의 기억력을 자랑하지 마라 기발한 이름은 피하라 한 개념에 한 단어를 사용하라 말장난을 하지 마라 의미 있는 맥락을 추가하라 불필요한 맥락을 없애라메서드 이름은 동사나 동사구가 적합하다. (p.32)클래스 이름과 객체 이름은 명사나 명사구가 적합하다. (p.32)코드를 읽을 사람도 프로그래머라는 사실을 명심한다. (p.34)\좋은 이름을 선택하려면 설명 능력이 뛰어나야 하고 문화적인 배경이 같아야 한다. (p.38)읽고난 후의 생각.2장의 소제목들은 하나도 놓칠게 없다. 코딩을 그만둘때까지 뼈에 새길 내용들이라고 생각한다. 코딩은 협업을..

책에서 기억하고 싶은 내용. 시간을 들여 깨끗한 코드를 만드는 노력이 비용을 절감하는 방법일 뿐만 아니라 전문가로서 살아남는 길이라는 사실을 인정하리라 (p.6) 나쁜 코드의 위험을 이해하지 못하는 관리자 말을 그대로 따르는 행동은 전문가답지 못하다. (p.3) 기한을 맞추는 유일한 방법은, 그러니까 빨리 가는 유일한 방법은, 언제나 코드를 최대한 깨끗하게 유지하는 습관이다. (p.7) 논리가 간단해야 버그가 숨어들지 못한다. 의존성을 최대한 줄여야 유지보수가 쉬워진다. (p.9) 중복을 피하라. 한 기능만 수행하라. 제대로 표현하라. 작게 추상화 하라. (p.14) 새 코드를 짜면서 우리는 끊임없이 기존 코드를 읽는다. 비율이 이렇게 높으므로 읽기 쉬운 코드가 매우 중요하다. (p.18) 보이스카우트 ..

과거 일을 하면서 알게됬고 얼떨결에 시작했던 vue.js를 다시 다뤄볼 기회가 왔다. 활용은 할 줄 알지만 깊게 다루지 못했던 것이 내심 안타까웠는데 깊게 공부할 타이밍이 온 것 같다. 이번기회에 메인 프론트엔드 기술로써 vue.js를 전공해야겠다. 지금처럼 코딩이 재미있던 적이 없다.

1. VSCode 설정창 오픈 macOS : ⌘ + , Windows : Ctrl + , Linux : Ctrl + 2. 설정 값 변경 quickSuggestions 키워드로 검색 후 다음과 같이 설정을 변경한다. editor.quickSuggestions By default VS Code will not trigger completions when editing "string" content, for example within JSX attribute values. Updating the editor.quickSuggestions setting may improve your experience: "editor.quickSuggestions": { "strings": on }

import React, { useState } from "react"; import { useForm } from "react-hook-form"; /* function ToDoList() { const [toDo, setToDo] = useState(""); const onChange = (event: React.FormEvent) => { const { currentTarget: { value }, } = event; setToDo(value); }; const onSubmit = (event: React.FormEvent) => { event.preventDefault(); console.log(toDo); }; return ( Add ); } */ interface IForm { email: s..

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줄 이상 되었을 때 의미가 있다.