개발자연습노트

태그 사용하기 유저의 입력을 받을 수 있는 박스를 생성하고 싶으면 html에선 다음과 같은 태그들을 이용가능합니다. 이거 말고도 다양한 종류의 인풋 박스가 많으니 필요할 때 찾아쓰도록 합시다.      에 뭔가 입력시 코드를 실행하려면 유저가 에 뭔가 입력시 코드를 실행해주고 싶을 때가 많습니다.그러고 싶으면 onChange 아니면 onInput 이벤트핸들러를 부착하면 됩니다.   { 실행할코드 }}/>onChange, onInput은에 유저가 뭔가 입력할 때마다 안에 있는 코드를 실행해줍니다. 진짜인지 console.log(1) 이런거 넣어서 테스트해봅시다.   (참고)이벤트 핸들러들은 매우 많습니다.onMouseOver={ } 이건 이 요소에 마우스를 댔을 때 안의 코드를 실행해줍니다.onScroll..

Q. 지금 누른 글제목이 모달창안에 뜨게 하고 싶으면 어떻게 코드를 짜야할까요?0번 글을 누르면 0번 글제목이 모달창안에 등장하고1번 글을 누르면 1번 글제목이 모달창안에 등장하고그런 식으로 동작하게 만들어봅시다. 다 배운내용이라 강의 듣지말고 알아서 해봅시다.   약간의 힌트는  직접 뭐라도 해보라고 드리는 힌트인데 모달창안의 제목도 일종의 동적인 UI입니다. 동적인 UI 어떻게 만들라고 했습니까  1. html css로 미리 디자인해놓고 2. 현재 UI의 상태를 state로 만들어두고3. state 종류에 따라서 UI가 어떻게 보일지 작성하랬습니다. 그러면 끝임 이제 나중에 필요할 때 스위치 (state) 조작만 하면 됩니다.       1. html css로 미리 디자인해놓고  다 한것 같군요 패스..

JSX 문법 1. html에 class 넣을 땐 className JSX 문법 2. 변수를 html에 꽂아넣을 때는 {중괄호} function App(){   var data = 'red';   return (                     개발 blog         안녕하세요               ) } 온갖 곳에 {} 중괄호를 열어서 변수들을 집어넣을 수 있습니다. href, id, className, src 등 여러가지 html 속성들에도 가능합니다. 위처럼 쓰면  이렇게 되겠군요. JSX 문법 3. html에 style속성 넣고싶으면   글씨  4. 변수 말고 , state 담기 이전 강의에서는 그냥 let posts = '어쩌구' 이렇게 변수에 데이터를 저장했었는데 리액트에선 변수 말..