리액트 함수 컴포넌트 10가지 반환값
·
프론트엔드/React
들어가기전 리액트 함수 컴포넌트의 10가지 반환값을 알아보겠습니다. 1. div요소 안녕하세요 2. 컴포넌트 3. 문자열 "안녕" 4. 숫자 1 5. 배열 ['안녕'] 6. null null 7. boolean {false} {true} 8. 배열안 요소 [안녕,하슈] 배열은 key값이 필요. 리액트가 가상돔에서 연산을 효율적으로 하도록 돕는다. 9. 안녕 하슈 // React.Fragment 생략가능 안녕 하슈 리액트 문법상 모든 코드를 감싸는 태그가 있어야합니다. 은 실제 돔에는 반영이 되지 않아 렌더링되지 않습니다. 감싸는 태그가 불필요할 때 대신하여 쓸 수 있습니다. * 의 축약형 : 10. ReactDOM.createPortal {ReactDOM.createPortal( p>안녕하세요 좋은 아침..
리액트 컴포넌트의 상태값과 속성값 개념을 구분하여 알자
·
프론트엔드/React
들어가기전 리액트에서는 UI 데이터를 상태값과 속성값으로 관리를 합니다. 단순한 개념들이지만 이 두 개념을 구분해보도록 하겠습니다. 상태값 상태값은 우리가 흔히 쓰는 setState로 관리하는 값이 상태값입니다. color 변수는 setColor를 통해 상태값이 바뀌게 됩니다. import React, { useState } from 'react'; import Counter from './Counter'; export default function App() { const [color, setColor] = useState('red'); // 상태값 function onClick() { setColor('blue'); } return ( 좋아요 ); } 속성값 속성값은 변하지 않는 불변 변수. 부모컴포..
Get과 Post 방식
·
CS/Network
프로토콜이란 통신 프로토콜 또는 통신 규약은 컴퓨터나 원거리 통신 장비 사이에서 메시지를 주고 받는 양식과 규칙의 체계이다. 통신 프로토콜은 신호 체계, 인증, 그리고 오류 감지 및 수정 기능을 포함할 수 있다. HTTP (HyperText Transfer Protocol) HTTP이란 웹상에서 Client와 Sever 간에 요청/응답으로 데이터를 주고 받는 프로토콜입니다. Client가 HTTP 프로토콜을 통해 Sever에게 요청을 보내면 서버는 요청에 맞는 응답을 클라이언트에게 전송합니다. 이 때, HTTP 요청에 포함되는 HTTP 메소드는 서버가 요청을 수행하기 위해 해야할 행동을 표시하는 용도로 사용합니다. Get과 Post는 HTTP 메소드 중 하나입니다. Get 서버로부터 정보를 조회하기 위한..
자바스크립트 클로저
·
프론트엔드/Javascript
클로저란 무엇인가 함수와 그 함수가 선언됐을 때의 렉시컬 환경(Lexical environment)과의 조합이다. 렉시컬 환경이란 함수가 선언된 위치에 따라 정해지는 스코프를 말한다. player를 리턴하는 익명함수는 getClosure 내부에 선언되었으므로, 익명함수의 렉시컬 환경은 자신과 getClousure, 전역범위까지 해당한다. function getClosure() { var player = '손흥민'; return function() { return player; }; } var closure = getClosure(); console.log(closure()); // '손흥민' getClosure함수는 익명함수를 반환하고 실행이 완료되었지만, 반환된 익명함수에는 player변수가 남아있다...