2024.05.20 Today Yoonsung Learned

TIL

스탠다드반 타임어택

1. 더하기 빼기 계산기 (20분 이내에 제출)

• useState을 활용한 계산기를 만들어야함
• 튜터님이 공유해주신 소스코들를 fork해서 내가 만든 폴더에 Clone함

mkdir timeattack1
cd timeattack1
git cone [github 클론받을 주소] ./

• 1) input 안에 숫자를 입력 후, [더할게요] 클릭 시 결과에 해당 숫자만큼 + 처리
  

import React, { useState } from "react";
/* 상태를 useState로 관리 */

/* 결과 값 저장 */
export default function App() {
  const [result, setResult] = useState(0);
  const [inputValue, setInputValue] = useState("");

  /* state로 리렌더링 */
  const handleInputChange = (e) => {
    setInputValue(e.target.value);
  };

  /* 더하기 후에 input 초기화 */
  const handleAdd = () => {
    setResult(result + parseInt(inputValue));
    setInputValue("");
  };

• 2) input 안에 숫자를 입력 후, [뺄게요] 클릭 시 결과에 해당 숫자만큼 - 처리

/* 빼기 후에 input 초기화 */
  const handleSubtract = () => {
    setResult(result - parseInt(inputValue));
    setInputValue("");
  };

• 3) [초기화] 클릭 시 최초의 상태로 초기화 처리

/* reset 클릭시 초기화 */
  const handleReset = () => {
    setResult(0);
    setInputValue("");
  };

• 4) GitHub 'caculate' 브랜치에 Push 하기

git push origin calculator