Daisy's IT Blog

1. gh pages - github.io 페이지를 이렇게 build 할 수 있구나 - deploy: build 폴더를 업로드 - npm run build하면 build 폴더를 얻는다 - deploy를 호출하면, predeploy가 deploy보다 먼저 자동적으로 실행된다. - npm run build npm run deploy 2. [JS] 33 Concepts of JavaScript - 개념 다시 다지고 있음. - JS는 형변환이 참... 헷갈리기 쉬운 것 같다. 실수하기 쉬울듯. - 블로그에 정리해야겠다.

1. [React] - 트랜스파일러 (혹은 트랜스포머 라고 불리기도) : 리액트 코드를 자바스크립트 코드로 바꿔주는 툴. Ex) 웹팩 - props : props를 통해 데이터를 전달. : 부모 컴포넌트가 자식 컴포넌트에게 주는 값. react는 props를 가져간다. : 자식 컴포넌트에서는 props를 받아오기만 하고, 받아온 props를 직접 수정할 수는 없다. - propTypes : 타입 체크할 때 사용. 내가 지정한 타입이 아닌 다른 타입의 prop이 들어오면 콘솔에 경고문 떠서 알 수 있다. - 람다식 => - 여러 컴포넌트들: https://reactjs.org/docs/react-component.html 2. 기타 - React로 영화 앱을 만들고 있다. - 지금 절반쯤 한 것 같은데....

로컬 저장소와 원격 저장소를 연결하는 데는 아래와 같은 두 가지 방법이 있다. 1. Github에 원격저장소를 만든 후, 로컬(내 컴퓨터)에 원격저장소를 복제(clone)하는 방법 - 1) 새로운 저장소를 생성하거나, 또는 2) 원격저장소에 이미 많은 작업이 이루어졌고 내 로컬에는 작업이 없는 경우에 적합하다. 2. 로컬(내 컴퓨터)에서 git을 시작하겠다고 선언한 다음 원격저장소를 연결하는 방법 - 1) 새로운 저장소를 생성하거나, 또는 2) 내 로컬에 이미 많은 작업이 이루어졌고 이 작업들을 새로운 원격저장소를 만들어서 올려야 할 경우에 적합하다. 나는 거의 항상 1번 방법을 사용했는데, 하루는 어쩌다보니 원격저장소를 새로 만들고 로컬에 clone 하지 않은 상태에서 이미 로컬에 작업을 잔뜩 해버렸다..

1. [JS] 1) 템플릿 리터럴 : https://flik.tistory.com/53 - `(backtick) 을 사용해서 문자열을 표현한 것. - (1) 줄바꿈을 쉽게 할 수 있고 (2) 문자열 내부에 표현식을 포함할 수 있게 된다. - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals 2) createElement(), createTextNode(), appendChild() - createElement() : 요소(element)를 만든다. - createTextNode() : 선택한 element에 text 추가 - appendChild() : 선택한 element에 자식 element 추가 ht..

1. [js] 1) var, let, const 차이 - var : 예전부터 있던 변수. 같은 이름의 변수를 여러번 선언해도 에러가 안 남. function scope - let, const : ES6 이후부터 나온 변수 선언 방식. var와 달리 같은 이름의 변수 재선언 불가. block scope. - let : 변수 재선언 불가, 변수에 재할당 가능. - const : 변수 재선언 불가, 변수 재할당 불가. 2) - setInterval(함수명, 함수실행시간) (시간단위: ms) - localStorage.setItem(key, value) - Math.floor(Math.random()*(n+1)) : 0~n까지의 난수 생성 ex) Math.floor(Math.random()*11) : 0~10까..

1. 2차 프로젝트 프론트 작업 - 기존에 만들어놨던 회원가입 UI가, label 한 줄 input 한 줄 방식으로 했더니 너무 길어져서, label과 input을 한 줄에 만드는 방식으로 UI를 변경하고 있다. 1) 카카오 주소 적용 - 간단하다 key 발급 받을 필요도 없네 - 금요일에는 카카오맵 적용시켰었는데 둘 다 예상했던 것보다 간단했다. 역시 겁먹지 말고 계속 코딩해보는 게 중요한 것 같다. 2) jQuery Datepicker - 얘도 간단한데 커밋하고 나니 생년월일에서 년도 찾는게 너무 번거로워서 yearRange를 변경해줬다. 3) radio 버튼 옆 텍스트를 눌러도 radio 버튼이 클릭되게 하는 법 남성 - 위와 같이 label의 for 속성 값으로 input의 id를 넣는다. 4) ..

# 블록 요소 vs 인라인 요소 - 포함 : 모든 인라인 요소 포함 가능, 다른 블록 요소도 일부 포함 가능 - 넓이 : ★가로폭 전체★의 넓이를 가지는 직사각형 형태. ★한 줄 다 차지★ - 레이아웃 : width, height, margin, padding 등을 사용해서 크기나 위치 지정 가능 → width/height/margin/padding 등 사용해서 크기나 위치를 지정하려면 블록 요소여야 한다. - 줄바꿈 : (O). 블록요소 다음에는 줄바꿈됨 - inline으로 변경하는 방법 : CSS에서 display : inline; - 블록요소 종류 : , , , , , 등 (1) 영역 잡는 애들 (2) 테이블, 리스트 (3) 데이터 입력 (4) 기타 : description list : descri..

CSS는 'Cascading Style Sheet'라는 이름에서부터 알 수 있듯이, cascading(폭포, 단계적으로 행하다.)이라는 특징을 가지고 있다. 'cascading이 뭐야?'라고 묻는다면 '단계적으로 스타일이 적용된다', 즉, '하나의 대상에 여러 가지의 스타일이 중복 적용된다'는 것을 의미한다. 그렇다면, 하나의 태그에 여러개의 충돌되는 스타일이 지정되어 있다면, 태그는 어떤 스타일을 따르게 될까? (예를 들어 어디에서는 p 태그의 font-size=20px, color: #FFFFFF;(흰색)이고, 다른 곳에서는 font-size: 10px; color: #000000;(검정색) 라고 지정해놓았음) 결론은 첫째, 개별성(specificity)이 높은 스타일을 적용하며, 둘째, 개별성이 같..

1. HTML/CSS 1) cascading과 specificity 정리 https://webstudynote.tistory.com/81 - 예전에는 CSS가 우선 적용되는 순서를 외워야 한다고 생각했는데, 이제와 보니 그냥 말 그대로 specific하게 스타일을 지정할수록 우선순위가 높은 거였다. 상식적으로 생각하면 되니 외울 필요 없는 거였다. 2) 블록 요소 vs 인라인 요소 정리 https://webstudynote.tistory.com/84?category=842817 2. 2차 프로젝트 - My page 제작 중 - 폰트 추가 - 로렘입숨 한글로 바꿈 3. 느낀 점 - HTML/CSS를 많이 알고 있다고 근거없는 자신감을 가졌는데 블로그에 정리하다보니, 이때까지 나는 HTML/CSS를 너무 '..

1. JavaScript 인강 - 리스트/반복처리, 이벤트 시점, 값 복사 vs 값 참조