04/28-1

props로 가져온 값(변수)는 원본값을 바꿀 수 없다.

그러므로 원본값을 바꾸고자 한다면 부모에서 값을 바꾸는 함수(메서드)를 작성하고 그것을 들고와서 실행해줘야 한다

예를 들어 id=3인 props를 들고 왔는데 id 값에 1을 추가하고 싶다면 let addNum=()=>{id=id+1} 을 id=3 와 같은 공간에 적어주고 addNum도 props로 받아와서 props 쓰는 공간에 addNum();을 넣어주면 동작을 한다.

이전에 JS에서 기능을 끌고 오는것과 react에서 기능을 끌고 오는 것은 조금씩 다르다.

fontawesome의 아이콘들을 react를 이용해서 사용

https://fontawesome.com/docs/web/use-with/react/ – pro를 뺀 나머지 인스톨

npm i @fortawesome/fontawesome-svg-core

npm i @fortawesome/free-solid-svg-icons

npm i @fortawesome/free-regular-svg-icons

npm i @fortawesome/free-brands-svg-icons

npm i @fortawesome/react-fontawesome@latest

https://fontawesome.com/docs/web/use-with/react/add-icons – Add Individual Icons Explicitly 참고

import { FontAwesomeIcon } from ‘@fortawesome/react-fontawesome’ – FintAwesomeIcon 컴포넌트 사용

import { faEnvelope } from ‘@fortawesome/free-solid-svg-icons’ -사용하고 싶은 아이콘 찾기

만약 똑같은 이름이 쓰인다면 as 다른이름 을 붙여셔 구별을 해둔다

import { faCoffee as fasFaCoffee } from ‘@fortawesome/pro-solid-svg-icons’

import { faCoffee as farFaCoffee } from ‘@fortawesome/pro-regular-svg-icons’

쓰기 위한 코드 형식

<Fontawesome icon={faEnvelope}/>