개발공부 임고미

개념 데이터를 다룰 때 사용되는 개념이다. 비교 props(속성) state(상태) 부모 컴포넌트가 자식 컴토넌트에게 주는 값 부모 컴포넌트가 자식 컴포넌트한테 전달하는 데이터로, (자식 입장에서)읽기 전용이다. 자식 컴포넌트에서는 props를 받아오기만 하고 받아온 props를 직접 수정할 수는 없다. 동적인 데이터를 다룰 땐 state를 사용합니다. 자신이 들고 있는 값을 말한다. 읽기전용인 props와 비교하면 쓰기전용이라고 볼 수 있습니다. 컴포넌트 내부에서 선언하며 내부에서 값을 변경할 수 있습니다. 변해야하는 상태관리를 할 때 사용합니다! props 개념 부모 컴포넌트가 자식 컴토넌트에게 주는 값 부모 컴포넌트가 자식 컴포넌트한테 전달하는 데이터로, (자식 입장에서)읽기 전용이다. 자식 컴포넌..

JSX 1. 개념 유래는 Java Script + XML을 합쳐서 탄생한 기존 자바스크립트의 확장 문법입니다.(= JSX은 js입니다.) 두가지를 합쳐서 얻는 장점은?? 개발자가 자바스크립트 내부에 마크업 코드를 작성해 줄 수 있게 해줍니다. 단순히 XML만 아니라 변수나 프로퍼티의 바인딩 기능도 제공합니다. 꼭 닫혀야 하는 태그 열었으면 닫아라 (→ Syntax error ) 두개 이상의 엘리먼트는 무조껀 하나의 엘리먼트로 감싸져 있어야 합니다 hello bye (x) 두 개 이상의 태그가 하나로 묶여있지 않은 상황이라, 문법적 에러 발생 console: Syntax error : Adjacent JSX elements must wrapped in an enclosing tag 해결 방법 : 1.'di..

개념정리 리액트란? 프론트앤드 라이브러리 사용하는 이유? 요즘의 웹은 단순히 웹 페이지 가 아니라, 웹 애플리케이션으로 브라우저 상으로도 정말 자연스러운 흐름으로 매우 많은것들을 할 수가 있다. 어떠한 유저인터페이스를 동적으로 나타내기위해서는 정말 수많은 상태를 관리해줘야한다. 웹 개발을 하게 될 때, 귀찮은 DOM 관리와 상태값 업데이트 관리를 최소화하고, 오직 기능 개발, 그리고 사용자 인터페이스를 구현하는 것에 집중 할 수 있도록 하기위해서 정말 여러 라이브러리들 혹은 프레임워크들이 만들어졌다. ( 대표적으로 Angular, Ember, Backbone, Vue, React ) - 상태 관리하기가 매우 편함 버츄어 돔이란? DOM의 상태를 메모리에 저장하고 변경 전과 변경 후의 상태를 비교한 뒤 최..

함수 일정시간 뒤에 함수가 실행되게 하고싶을때는 ? setTimeout( function () { ... }, delay); 어떤때 활용하는가 ? i. 접속 후 몇 초 후에 팝업 또는 배너창 띄우기 ii. 방문자의 스크롤이 브라우저 일정 위치에 올 경우 몇 초 뒤에 애니메이션 실행 iii. 검색창 또는 일부 섹션 몇 초 뒤에 사라질 경우 iv. 방문자 접속 후 20-30초가 지난 뒤 메일 구독을 신청하는 팝업창을 띄울 경우 setTimeout(function() { alert('http://webisfree.com'); }, 3000); clearTimeout( ) ; 삭제하는 방법은 ? var clear = setTimeout( ) =함수를 변수에 담고 clearTimeout ( clear ) = 함수..

iframe 개념 아이프레임이란 내부 프레임(inline frame)이라는 의미로 하나의 HTML문서내에서 다른 HTML문서를 보여주고자 할때 사용합니다. / 동영상, 뮤비도 넣을 수 있습니다. 특징 모든 브라우저에서 작동합니다. DOCTYPE문서 에서는 작동하지만 script문서에서는 작동하지 않습니다 src 속성 inline frame 내에 불러올 문서의 주소를 적어주면 됩니다. 홈짱 홈페이지를 불러오는 예제를 만들어 보겠습니다. 1) width와 height 속성 inline frame의 너비와 높이를 지정할 수 있습니다. 2) frameborder 속성 inline frame의 경계선의 두께를 지정할 수 있습니다. 3) marginwidth와 marginheight inline frame의 여백을..