Promise 프로미스는 주로 서버에서 받아온 데이터를 화면에 표시할 때 사용한다. 일반적으로 웹 애플리케이션을 구동할 때 API를 사용하여 서버에 데이터를 요청하고 받아온 데이터를 사용하여 화면을 출력하는데, 데이터를 다 받아오기 전에 화면에 데이터를 표시하려고 하면 빈 화면이나 오류가 발생하는데 이를 해결하기 위한 방법 중 하나가 프로미스이다. Promise 예제 코드 function getData(callback) { // new Promise() 추가 return new Promise(function(resolve, reject) { $.get('url 주소/products/1', function(response) { // 데이터를 받으면 resolve() 호출 resolve(res..
🍣 props - Component 속성을 설정할 때 사용하는 요소 - 해당 컴포넌트를 불러와 사용하는 부모 컴포넌트에서 사용가능 1️⃣ 컴포넌트를 사용할 때 pros 값 지정하기 부모 컴포넌트인 App 컴포넌트에서 MyComponent의 props 값을 지정, MyComponenet에서 props 사용 2️⃣ 비구조화 할당 문법을 통해 props 내부 값 추출하기 객체에서 값을 추출하는 문법 === 비구조화 할당(destructuring assignment) === 구조 분해 문법 함수의 파라미터가 객체라면 그 값을 바로 비구조화해서 사용할 수 있다. # 객체에서 값을 추출하는 비구조화 할당 const MyComponent = (props) => { const { name, title } = props..
🏫 오늘의 미션 React의 state와 event 기능을 사용하여 전에 js로 구현했던 로그인 버튼 활성화 기능을 React로 변환해 보겠다. #Routes.js import LoginSejun from './pages/sejun/Login/Login'; class Routes extends React.Component { constructor(props) { super(props); this.state = { id: 0, pw: 0, }; } render() { return ( . . . #Login.js import React from 'react'; import { Link } from 'react-router-dom'; import './Login.scss'; class Login extends..
