본문 바로가기

web

(3)
React - State, Hook 최근 배운 리액트에서 state란 개념에 대해 공부하였다. 동적인 웹을 만들기 위해서는 리액트에서 state를 잘 활용하는 것이 매우 중요하다고 생각하여 공식 문서를 통해 공부한 내용을 기록해 본다. state란 리액트 컴포넌트의 상태를 다룰 때 사용하는 하는 자바스크립트 객체이다. 이것이 뭔말인고 하니.. 간단히 말하자면 컴포넌트 내에서 사용하는 상태 관리 변수라고 볼 수 있다. 값이 변경되는 값을 지정해 주고자 할 때 setState를 사용하여 값을 변경하여 사용할 수 있다. 여기서 state는 변할 수 없는 읽기 전용 객체이고 따라서 state를 직접 변경하는 것이 아닌 setState 함수를 사용해 새 객체를 만들어 값을 넣어 주는 형식이다. setState를 통해 값을 변경할 경우 이를 파악하여..
javascript - URL URL(Uniform Resource Locator)은 우리가 알고있는 브라우저 웹에서 사용되는 개념으로 웹에 게시된 자원(이미지, HTML 페이지, CSS문서 등)을 찾기 위해 사용되는 메커니즘이다. 먼저 URL의 구조를 알아보자 http://www.example.com:80/path/to/myfile.html?key1=value1&key2=value2#SomewhereInTheDocument Protocol http는프로트콜(규약)으로 브라우저가 어떡 규약을 사용하는 지를 나타낸다. Domain Name www.example.com은 도메인 이름으로 원래는 보통 인터넷 프로토콜(IP)를 입력해서 온라인상을 위치를 표현한는데 이는 너무 복잡하고 접근하기 어려우니까 인간친화적인 방식으로 만들어 IP에 이..
javascript - template literal template literal은 문자열 표기법 중의 하나로 보통의 ( ', " ) 대신 ( ` )의 기호를 사용한다. 템플릿 리터럴의 강력한 기능 중의 하나는 일반적인 문자열은 줄바꿈을 위해 \n을 사용해야하는 것에 반해 ( enter )키 한번으로 여러줄의 문자열을 작성할 수 있다는 것이 장점이다. 또한 ( + )연산자의 사용을 하지 않아도 ${변수표현식} 의 꼴로 삽입하여 사용이 가능하다는 장점이 있다. 이처럼 template literal을 쓰면 가독성이나 코드 작성에 있어서 편리하다는 장점이 있다. //기존의 문자열 방식 var name = 'kk9921'; var letter = 'Dear '+name+'\nLorem ipsum dolor sit amet, consectetur adipisici..