본문 바로가기
728x90

[프론트엔드]27

[React] React에서 이미지 경로 설정과 넣는 방법 1. css 폴더 내에서 이미지 넣기 2. 직접 App.js에서 넣기 3. public 폴더 이용하기 1. css 폴더 내에서 이미지 넣기 .main-bg { height : 300px; background-image : url('./bg.png'); background-size: cover; background-position: center; } 다음과 같이 background-image : url ('./사진이름); 으로 넣어주면 되는데 만약 src 내부의 새로운 폴더 이름이 img인 폴더를 만들어서 그 안에 img파일을 넣고 경로를 넣어주게 된다면 다음과 같이 나타낼 수 있다. background-image : url('./img/bg.png'); 2. 직접 App.js에 넣기 맨 처음 상단에서 i.. 2023. 4. 4.
[React] React Bootstrap 사용하기 1. 크롬에서 react bootstrap 검색하기 2. 들어가서 보이는 Get started 3. New Terminal에서 npm install react-bootstrap bootstrap 입력 4. CSS 파일 넣기 import~ 를 App.js에 넣어주거나 link ~ 를 index.html에 넣어준다. 5. button을 가져온다고 한다면 import ~ 부분은 App.js에 넣어줍니다. 그 다음 원하는 모양의 버튼을 복사해서 붙여줍니다. 다음과 같이 잘 나온 것을 확인 할 수 있습니다. 2023. 4. 3.
[React] 새로운 프로젝트 생성 방법 [ 새로운 프로젝트 만들기 ] 1.새로운 프로젝트 만드려는 폴더에서 우클릭 → Windows PowerShell 2. npx create-react-app 폴더이름으로 생성 3. Happy hacking! 이라면서 만들어지고 작업 폴더가 잘 생성되었는지 확인합니다. 4. 이제 Visual Studio Code 아까 만들었던 firstshop폴더 → New Terminal → npm start 해줍니다. 2023. 4. 2.
[React] 자식이 부모의 state 가져다 쓸 때 props 이 글은 코딩애플 님의 강의를 듣고 작성한 글입니다. ★방법★ 부모의 state를 자식에게 전송하려면 props 문법을 쓴다. . . . 1. 2023. 4. 2.
728x90