본문 바로가기

전체 글111

react 이미지 경로 문제 Module not found: You attempted to import ../img/1.jpg which falls outside of the project src/ directory. Relative imports outside of src/ are not supported 클래스 안에 이미지 태그를 넣어주고, 경로를 설정해줬는데 다음과 같은 문제가 발생했습니다. 이미지를 src폴더 밖에서 불러온게 문제라고 하는데, 뭐가 문제일까요? 이미지가 불려지는 경우는 다음과 같습니다. 1. 이미지 태그에 src속성으로 바로 설정 2. 맨 상단에서 이미지 자체 import 3. css 파일에서 backgound-imgae로 사용 2번과 3번의 경우 불러올 이미지가 src폴더 아래에 꼭 있어야 했고, 1번의 경.. 2021. 6. 23.
5. Component(코딩애플) 어떤걸 Component로 만드는게 좋을까? 반복출현하는 HTML 덩얼이들 자주 변경되는 HTML UI들 1. 한 페이지 내에서 생성 function 컴포넌트이름() { return( 원하는 HTML담기 ) } . . . 필요한 곳 가서 or 넣기 Component 유의사항 이름은 대괄호 return() 안에 있는건 태그 하나로 묶어야함 (형제태그x) -정 여러태그 써야한다면 function 컴포넌트이름() { return( // 로 감싸기 ) } 2021. 6. 22.
4. 이벤트 리스너(핸들러)장착하는 법(코딩애플) 1. html 태그에 onClick {console.log(1) } } icon //span태그 속 아이콘을 누르면 1이 출력이 된다. 2.state 지정 2021. 6. 21.
3. state (코딩애플) 데이터를 넣는 법 1.변수 2.state ( 자주 바뀌고, 중요한 데이터 저장할때 활용) state? 변수 대신 쓰는 데이터 저장공간 useState()를 이용해서 만들어야함 문자,숫자,array,object 다 저장가능 쓰는 이유? 더보기 변수는 변경되어도 자동 재렌더링이 안되지만 state는 변경되면 html이 자동으로 재렌더링됨 (새로고침 없이 변경됨) //App.js import React, { useState } from 'react'; // 해석 : react에 useState 라는 내장함수를 쓰겠습니다~ useState()를 이용해서 state 만들기 function App(){ let [state데이터,state데이터 변경 함수] = useState('data01','data02','dat.. 2021. 6. 21.

티스토리툴바