공부/React & Next.js 14

노마드 코더 Coin Tracker 챌린지 문제

노마드 코더 Coin Tracker 챌린지 문제 - 가지고 있는 달러를 내가 원하는 코인으로 변환 했을 때 얼마나 되는지 계산하는 문제 import React, { useEffect, useState } from 'react'; function App() { const [loading, setLoading] = useState(true); const [coins, setCoins] = useState([]); const [dollars, setDallars] = useState(""); const [result, setResult] = useState(""); useEffect(() => { fetch("https://api.coinpaprika.com/v1/tickers") .then((response..

[React] 리액트 , ES6 문법 잘모르는 거 정리

1. 리액트 상태 변경 시, constants을 보낼때와 function을 보낼때 차이 const [toDo, setToDo] = useState(""); const [toDos, setToDos] = useState([]); setToDos((currentArray) => [toDo, ...currentArray]); //setToDos에 함수를 보낸다. => 함수를 보낼때 첫번째 인자는 현재state다! 따라서 currentArray 인자는 현재 상태를 뜻한다. setToDo(""); //setToDo에 constants를 보낸다. 풀코드 import { useState } from "react"; function App() { const [toDo, setToDo] = useState(""); co..

[React] React의 상태 관리

[React 상태 관리] - React는 변수 대신 state를 사용 - state 왜 사용? >> state가 변경되면 새로고침 없이 HTML이 자동으로 리렌더링 된다. (변수를 쓰면은 새로고침해야 바뀜) 1. setState - 클래스형 컴포넌트에서 사용하는 방법 - 요즘은 클래스형 컴포넌트 잘 사용하지 않음 2. useState - 함수형 컴포넌트에서 state 사용하는 방법 (가장 기본적인 방법인듯..) - React Hook 라이브러리에 포함된 함수 import React, { useState } from 'react'; const CalResultView = ({inputData, inintCalResult}) => { //{inputData} => 부모로 부터 받아온 props const [..

[React] 클래스형 컴포넌트 vs 함수형 컴포넌트

React 공부를 시작했다.. props와 state에 적응하기 위해 첫번째 프로젝트로 간단한 계산기를 만들고 있다.. 근데 대부분 클래스형으로 만들었는데, 요즘엔 함수형을 더 많이 사용한다고 한다. (함수형이 좀 더 빠르고 메모리도 덜 잡아먹는다) 그래서 다시 클래스형을 함수형으로 바꾸고 있다... ㅋㅋ 클래스형 적응 완료 했는데, React Hooks의 useState 요 놈 잘 지켜보겠다. 기록 남길 겸.. 간단한 예제를 남겨보겠다. 개념은 구글링하면 잘 정리된 사이트가 많으니 생략! import React, { Component } from 'react'; //클래스형 컴포넌트 class CalResultView extends Component { state = { claResult : '' } ..

1 2

반응형