개발 공부 기록

pattern pattern 속성은 요소의 값을 확인 해야할 정규표현식(regular expression)을 지정 required required 속성은 부울(boolean) 속성. 존재하는 경우, 폼을 제출 하기 전에 입력필드가 작성되어야만 함을 지정. required 속성은 다음의 입력 필드 타입에서 작동: text, search, url, tel, email, password, date pickers, number, checkbox, radio, and file. autofocus 페이지가 로드 될 때 자동적으로 해당 요소가 초점(get focus)을 받도록 함 placeholder 입력필드에 기대되는 값을 설명해주는 힌트(샘플 값이나, 포맷에 대한 간단한 설명) 를 지정 value 입력 필드에 대..

BEM: Block Element Modifier BEM 방법론은 ID에는 사용할 수 없고, 오직 클래스명에만 활용할 수 있다. Block 전체를 감싸고 있는 블럭요소 Element 요소는 블럭이 포함하고 있는 한 조각 Modifier 블럭 또는 요소의 속성 사용 .block‐‐modifier {…} .block__element‐‐modifier {…} 출처 webclub.tistory.com/263 nykim.work/15

VSCode의 익스텐션 중 하나인 Prettier는 코드를 정렬해주는 Formatter입니다. 설치 1. 익스텐션 아이콘을 선택합니다. 2. prettier를 검색합니다. 3. prettier code formatter를 선택 후 설치합니다. 설정 1. 설정화면을 킵니다. 2. 설정 > 확장 > Prettier를 설택합니다. 3. 우측 상단의 버튼을 눌러 settings.json 파일에 설정하고 싶은 내용을 입력합니다.

상단바에 로그인 모달을 제작해서 클릭해서 모달에 올바른 정보를 입력하면 로그인이 되도록 설계하고 싶었다. res.send(``); 이를 위해 router의 코드를 아래와 같이 변경했다. res.send(``); history.go(-1)는 직전의 페이지로 돌아가는 것을 의미한다. 여기서 문제는 상단바의 모달 메뉴가 로그인을 했는데 로그아웃으로 바뀌지 않는다는 점이었다. 페이지를 다시 로딩할 필요가 있음을 알게 되었고 아래와 같이 수정해주었다. res.send(``); document.referrer는 직전의 주소를 알려준다. 직전의 주소로 페이지를 호출해주어 해결했다.

코딩 컨벤션이란? 코딩 컨벤션은 읽고, 관리하기 쉬운 코드를 작성하기 위한 일종의 코딩 스타일 규약(하나의 작성 표준)이다. 특히 다른 언어에 비해 유연한 문법구조를 가진 언어일수록 개발자 간 통일된 규약이 없다면 코드의 의도를 파악하거나 오류를 찾기 어려우며 유지보수 비용이 늘어난다. 코딩 컨벤션의 장점 1. 정해진 규칙이 있기 때문에 명칭이나 구조를 빠르고 정확하게 정할 수 있다. 2. 통일된 규약이 있기 때문에 모든 사람들이 코드를 이해하기 쉽고 편리하다. 3. 유지보수 비용을 줄일 수 있다. > 가독성이 좋다. 코딩 컨벤션의 자세한 예시

CSS에서 요소들을 자유롭게 위치시킬 수 있는 flex에 대해 알아보자. flex는 모바일 지원율이 매우 좋다는 장점이 있다. flex 사용방법 .container{ display: flex; } display: flex; 를 설정해준다. flex container 와 item 사용법 자세하게 알아보기 heropy.blog/2018/11/24/css-flexible-box/ 함께 보면 좋은 영상 tv.naver.com/v/5012344 Flexbox로 만들 수 있는 10가지 레이아웃 NAVER Engineering | 발표자: 이민영 (N Tech Service) 발표월: 2018.9. tv.naver.com 영상 자료 - 글 정리 d2.naver.com/helloworld/8540176 flex를 연습..

Gitflow Workflow에서 사용되는 브랜치 메인 브랜치 (항상 유지) master 배포(release) 이력을 관리하기 위해 사용. 즉, 배포 가능한 상태만을 관리한다. develop 다음 출시 버전을 개발하는 브랜치. 기능 개발을 위한 브랜치들을 병합하기 위해 사용. 즉, 모든 기능이 추가되고 버그가 수정되어 배포 가능한 안정적인 상태라면 develop 브랜치를 ‘master’ 브랜치에 병합(merge)한다. 보조 브랜치 (일정 기간 동안만 유지) feature 기능을 개발하는 브랜치. feature 브랜치는 새로운 기능 개발 및 버그 수정이 필요할 때마다 ‘develop’ 브랜치로부터 분기한다. feature 브랜치에서의 작업은 기본적으로 공유할 필요가 없기 때문에, 자신의 로컬 저장소에서 관..

공통점 use와 all 모두 http request(get, post, put, delete)가 들어오면 처리한다. 차이점 app.use('/hello', function(req,res) =>{}); use method는 첫번째 인자로 들어오는 것을 시작 경로로 삼아 매칭한다. 즉, /hello /hello/world /hello/world/node 등의 hello로 시작하는 모든 경로에 대하여 routing이 진행된다는 의미다. 그러나 all은 request의 경로가 정확히 /hello 로 매칭될 때만 호출된다. 그 외의 경우는 매칭되지 않는다. app.all('/hello', function(req, res) =>{}); 참고