Context를 사용하면 컴포넌트를 재사용하기 어려워 질 수 있다.Prop drilling을 피하기 위한 목적이라면 Component Composition (컴포넌트 합성)을 먼저 고려해보자.Use the useContext HookContext 적용 전Context
useEffect accepts two arguments. The second argument is optional.No dependency passed:An empty array:Props or state values:
{ "posts": { "id": 1, "title": "json-server", "author": "typicode" } , "comments": { "id": 1, "body": "some comment", "postId": 1 } , "p
Get : 데이터를 가져올 때 쓰임 (fetch하면 기본 명령어 속성이 Get임)Post : 데이터를 생성할 때 쓰임.Put : 데이터를 수정할 때 쓰임(Patch 라고도 불림)Delete: 데이터를 삭제할때 쓰임/items + get 명령어 = 아이템읽어오기/item
배열의 순서를 정렬한다. 해당 배열 자체를 바꾼다.인자로 비교 인자를 받는다.이해가 잘 간다.그러나 아래의 코드를 보자.원래같으면10, 24, 34, 115, 264가 리턴돼야 할 텐데이렇게 정렬이 된 이유는아스키코드 순서이기 때문에 무언가 뒤죽박죽이다.해결하는 방법은
1세대 웹은 브라우저를 통해 웹 서버로부터 HTML 파일을 받아오는 형식이었다.초창기 웹 사이트는 단순히 정보 제공 위주였기 때문에 user interaction이 많이 요구되지 않았다.HTML, CSS를 주로 사용했다.2세대 웹은 웹서버로부터 html 파일을 받는것에
기준점을 잡았으면 다음 네 가지 속성을 이용해서 요소의 위치를 옮길 수 있다.요소의 Position 기준에 맞춰 위쪽, 아래쪽, 왼쪽, 오른쪽에서의 거리를 설정한다.top : 요소의 position 기준에 맞는 위쪽에서의 거리(위치)를 설정bottom : 요소의 pos
"사이트에 이미지를 넣는 방법은 두 가지가 있습니다. <img> 태그를 사용하는 것과 <div> 태그에 background-image 속성을 추가하는 것. 두 가지 방법의 차이점과 각각 어떠한 경우에 사용하면 좋은지 설명해보세요."과거의 웹 문서는 많은 정보
그리드 레이아웃에서 칼럼이나 줄의 크기를 지정할 때 px을 이용하면 항상 크리가 고정되므로 반응형 웹 디자인에는 적합하지 않다. 그래서 그리드 레이아웃에서는 상대적인 크기를 지정할 수 있도록 fr 단위를 사용한다 . 예를 들어 너비가 같은 칼럼을 3개 배치한다면 fr
flex-wrap 속성은 플렉스 컨테이너 너비보다 많은 플렉스 항목이 있을 경우 줄을 바꿀지 여부를 지정한다. 속성 값으로는 wrap 이나 wrap-reverse로 지정한 후 웹 브라우저 화면의 너비를 늘리거나 줄여 보면 플렉스 컨테이너 너비에 따라 여러 줄로 표시되는
< meta name="viewport" content="속성1=값1", "속성2=값2",...">뷰포트의 속성뷰포트 단위vw(viewport width): 1vw는 뷰포트 너비의 1%와 같다.vh(viewport height): 1vh는 뷰포트 높이의 1%와 같
@keyframes <이름> { <선택자> {<스타일>} } animation-name: <키프레임 이름> | noneanimation-duration: <시간>animation-direction: nomal | reverse | altern
웹 요소를 이동시키는 변형 함수는 translate()인데, 예를 들면 웹 요소를 x축으로 50px, y축으로 100px 이동하는 클래스 선택자 .photo를 정의하려면 다음과 같이 사용한다..photo { transform: translate(50px,100px);
npm install gh-pages --save-dev "homepage" 주소를 추가합니다."homepage": "http://{gitID}.github.io/{react-project-name}"형식은 http://{사용자 이름}.github.i