# 컴포넌트

22개의 포스트
post-thumbnail

📗[React 주요 개념] 1. 컴포넌트, props

자주 사용되지는 않는다고는 함.javascript함수 작성ES6 class이곳부터.. state와 생명주기

2021년 1월 9일
·
0개의 댓글
post-thumbnail

[말로 풀어쓴 React] state (함수형, 클래스형 컴포넌트 비교)

state 설명 (props와 비교)함수형 컴포넌트 useState클래스형 컴포넌트 초기값(constructor, state), setStatestate는 컴포넌트 내부에서 바꿀 수 있는, 바뀔 수 있는 값입니다. props는 부모 컴포넌트에서 설정하여 자식 컴포넌트로

2020년 12월 29일
·
0개의 댓글

[Vue] 컴포넌트

2020 12 15Vue 프론트엔드를 작업하다가 컴포넌트화를 시켜야 할 필요성을 느껴서 공부를 하려고 한다. React는 컴포넌트를 만들고 컴포넌트별로 관리하기 편리했었는데 Vue는 어떤지 잘 몰라서 공부를 한 번 해 보았다.Vue에서 컴포넌트는 재사용 가능한 코드를

2020년 12월 23일
·
0개의 댓글
post-thumbnail

[React] 4. Component와 Props

UI를 재사용이 가능하게 하는 여러 조각으로 개념적으로는 JavaScript 함수와 유사하다.리액트 엘리먼트는 사용자 정의 컴포넌트로도 나타 낼 수 있다.리액트가 사용자 정의 컴포넌트로 작성한 엘리먼트(Welcome)를 발견하면 JSX 어트리뷰트와 자식을 해당 컴포넌트

2020년 11월 24일
·
0개의 댓글
post-thumbnail

React | Component의 Lifecycle

React는 컴포넌트 단위로 화면에 렌더링하는데, 이 때 각각의 컴포넌트는 Lifecycle을 갖는다. 다음은 라이프사이클 다이어그램이다. 이번에는 리액트의 LifeCycle API에 대해 알아보자. Lifecycle 자세한 다이어그램은 이곳에서 볼 수 있다.컴포넌트

2020년 11월 2일
·
0개의 댓글
post-thumbnail

React | Component의 State

state란 말 그대로 컴포넌트의 상태 값입니다. state와 props는 둘 다 object이고, 화면에 보여줄 정보(상태)를 가지고 있다는 점에서 서로 비슷한 역할을 합니다. props는 컴포넌트를 사용하는 부모쪽에서 전달해야만 사용할 수 있고, state는 컴포넌

2020년 11월 2일
·
0개의 댓글
post-thumbnail

[React] 7. 컴포넌트 종류(클래스, 함수, 배열, 하이어오더)

클래스형 컴포넌트는 두 종류의 클래스를 사용합니다.Component 클래스는 props, state와 생명주기 함수가 들어있는 구조의 컴포넌트를 만들 때 사용합니다.이 클래스는 지금까지 컴포넌트를 만들 때 사용했습니다.PureComponent 클래스PureCompone

2020년 10월 19일
·
0개의 댓글
post-thumbnail

[React] 5. 컴포넌트와 구성요소(props, state)

오늘은 컴포넌트를 알아보겠습니다.컴포넌트는 리액트에서 가장 중요한 요소입니다.기존의 웹 프레임워크는 MVC방식으로 MVC방식은 정보(model), 화면(view), 구동(controller)로 코드관ㄹㅣ를 효율적으로 할 수 있다는 장점이 있으나 각 요소의 의존성이 높

2020년 10월 19일
·
0개의 댓글
post-thumbnail

React스터디_라우터로 SPA 개발하기

SPA는 Single Page Application(싱글 페이지 애플리케이션)의 약어입니다.말 그대로 한 개의 페이지로 이루어진 애플리케이션이라는 의미입니다.

2020년 9월 9일
·
0개의 댓글
post-thumbnail

[JavaScript] React - CRA

React React 선택 이유? > 프로젝트를 진행하면서 JS에서 직접 DOM으로만 개발했을때 너무 복잡했었지만, 특정 부분을 컴포넌트로 만들어 사용할 수 있다는 점과 오로지 view를 위한 라이브러리로서 많은 매력을 느끼게 되어 리엑트를 선택했다. React란?

2020년 9월 4일
·
0개의 댓글
post-thumbnail

컴포넌트 라이프사이클 메서드

모든 리액트 컴포넌트에서는 라이프사이클이 존재한다. 컴포넌트의 수명은 페이지에서 렌더링되기 전인 준비 과정에서 시작하여 페이지에서 사라질 때 끝이난다. 리액트 프로젝트를 진행하다 보면 가끔 컴포넌트를 처음으로 렌더링할 때 어떤 작업을 처리해야하거나 컴포넌트를 업데이

2020년 8월 5일
·
0개의 댓글

클래스형 컴포넌트 & 함수형 컴포넌트

함수형 컴포넌트클래스형 컴포넌트둘의 역할은 같다. 하지만,차이점 : 클래스형컴포넌트의 경우 state 기능, lifecycle 기능 사용, 임의의 메소드 정의 클래스형컴포넌트는 render() 함수가 꼭 필요하고 , 그 안에 JSX 를 반환해야한다. 함수형 컴포

2020년 8월 3일
·
0개의 댓글
post-thumbnail

컴포넌트

코딩에서 자주 강조하던 코드의 유지보수, 그리고 재사용성을 위한 리액트의 가장 기본UI를 이루는 한 단위의 그룹들이라고 생각할 수 있음.기존 class나 function들로 하는 것과 유사함.리액트 컴포넌트는 딱 함수만 나눈다기보다는 보여지는 기능들을 단위로 쪼갰다고

2020년 5월 17일
·
0개의 댓글

리액트 - Component & props & state

함수로 Welcome 컴포넌트 구현하기 class로 Welcome 컴포넌트 구현하기class로 컴포넌트를 만드려면 React.Component 를 extend해서 생성한다. 컴포넌트를 생성할 때 render() 메서드는 무조건 정의해야하고, return도 해주어야 한다

2020년 5월 9일
·
0개의 댓글
post-thumbnail

[리액트(React) 스터디] - npm과 npx, 컴포넌트 제작(props), state, 이벤트(bind, setState)

npm(Node Package Manager)node.js에서 사용하는 모듈들을 패키지로 만들어 npm을 통해 관리하고 배포한다.python - pip 같은 친구!nodejsnode.js 사이트에서 node.js installer를 다운로드 한다.window라면 git

2020년 4월 28일
·
0개의 댓글
post-thumbnail

[리액트(React) 스터디]리액트 컴포넌트

React설치를 완료하고, 이제 React 컴포넌트를 만들어보자.'src'디렉토리에 'Hello.js'라는 파일을 만들어보자.Hello.js파이썬 문법이랑 매우 비슷하다. import.. from ...갑자기 '마이레시피'프로젝트가 떠오르네..App.js컴포넌트는 일종

2020년 4월 14일
·
0개의 댓글

컴포넌트란?

많은 하드웨어 제품들은 각각 독립된 기능을 가진 모듈로 만들어진다.이 제품들은 회사 상관없이 서로 조합하여 하나의 제품이 만들어진다.이러한 제품들의 부품은 문제가 발생했을 시, 해당 부품만 다른 부품으로 바꾸어도 제품은 문제없이 작동한다. 컴퓨터와 스마트폰과 같은 제품

2020년 4월 3일
·
0개의 댓글

(TIL 46일차) 코인원 프로젝트 2차 후기

2차 프로젝트 코인원 후기

2020년 3월 22일
·
0개의 댓글

(TIL 45일차) useEffect 및 Eslint 자동적용 문제 (소켓 통신)

useEffect 올바른 사용법 eslint 자동적용 문제

2020년 3월 18일
·
0개의 댓글