코딩 정보/React36 [React] 디버깅의 방법을 예를 통해 알아보자 오류 예제 코드https://codesandbox.io/p/sandbox/debugging-start-vy38s8?file=%2Fsrc%2Findex.js%3A7%2C1 https://codesandbox.io/p/sandbox/debugging-start-vy38s8?file=%2Fsrc%2Findex.js%3A7%2C1 codesandbox.io리액트 디버깅하기 위와 같은 코드에서 아래와 같은 오류가 생겼다면 다음과 같이 해석할 수 있다. valueEndOfYear이 정의 되지 않았다.따라서 그 값부터 확인해보자 또한 아래 메세지들은 스택 트레이스로 이 오류로 인해 이어지는 코드의 목록이다.따라서 다음과 같이 해결할 수 있다. -> caculatorInvestmentResults 함수를 보면 duat.. 2024. 6. 30. [React] css에 대해 알아보자 [styled component] 목차 이전 바닐라 css편 참고https://be-senior-developer.tistory.com/125 React 스타일링에 대해 알아보자 [바닐라 css]목차 React에서는 css 스타일링의 방법이 여러가지가 있다그 중에서 바닐라 css 여러 사용방법과 장단점에 대해 알아보자 바닐라 css우리가 잘아는 바닐라 css로 아래와 같이 사용한다.import "./Lecturbe-senior-developer.tistory.com React에서는 css 스타일링의 방법이 여러가지가 있다.그 중에서 styled component에 대해서 알아보자 기본적인 사용법import styled from "styled-components";const MessageWrapper = styled.div` disp.. 2024. 6. 30. [React] css에 대해 알아보자 [바닐라 css] 목차 React에서는 css 스타일링의 방법이 여러가지가 있다그 중에서 바닐라 css 여러 사용방법과 장단점에 대해 알아보자 바닐라 css우리가 잘아는 바닐라 css로 아래와 같이 사용한다.import "./Lecture3.css";//이런식으로 불러서 사용import Lecture2 from "./Lecture2";function Lecture3() { return ( hello world );}export default Lecture3; 문제점css규칙들은 컴포넌트에 속하지 않기 때문에 스코핑이 되지 않는다이해하기 어렵다면 아래 코드를 보면 된다.function Lecture2() { return ( hello world2 );}expo.. 2024. 6. 29. [React] 틱택토 게임을 통해 개념 다지기 목차 간단한 틱택토 게임 모습 코드 참고https://github.com/sins051301/TIC_TAC_TO_GAME/tree/sucess/src TIC_TAC_TO_GAME/src at sucess · sins051301/TIC_TAC_TO_GAMEContribute to sins051301/TIC_TAC_TO_GAME development by creating an account on GitHub.github.com코드는 틱택토게임 폴더를 확인하면 된다. 알아두면 좋을것 같은 부분을 설명하고자 한다. 스프레드 연산자를 활용한 접근function deriveGameBoard(gameTurns) { //스프레드 연산자를 통해 이중 배열을 복사하는 방식 //기존 배열을 복사해준 뒤 일부만 변.. 2024. 6. 28. 이전 1 ··· 5 6 7 8 9 다음 728x90
