seung_hyeon 님의 블로그

탭 title 수정document.title = "HOMERUN";  탭 이미지 수정const changeFavicon = (iconURL) => { const link = document.querySelector("link[rel~='icon']"); if (link) { link.href = iconURL; } else { const newLink = document.createElement("link"); newLink.rel = "icon"; newLink.href = iconURL; document.head.appendChild(newLink); }};changeFavicon("/icon.png");→. png는 public 파일 안에 넣어야 함 수정 전 수정 후

#3 TypeScript • TypeScriptJavaScript를 기반으로 한 프로그래밍 언어strongly-typed 언어: 프로그래밍 언어가 작동하기 전에 type 확인 - TypeScript 설치 1.  새로 시작npx create-react-app 내 앱 이름 --template typescriptnpm i --save-dev @types/styled-componentsnpm i styled-components 2. 기존 프로젝트에 추가1. npm install --save typescript @types/node @types/react @types/react-dom @types/jest2. src 폴더 안에 있던 App.js와 index.js 파일을 App.tsx와 index.tsx 로 바꾼다..

#2 Styled components styled components 설치npm i styled-components+) npm start 안될 경우 cd my-app    • styled componentsclassName, style 사용할 필요 없다(알아서 만들어 준다) const Father = styled.div`display: flex;`;function App() { return ( )} ➣ styled.태그명` (유효한 html 태그만 가능)백틱 안 css`;  1. props 이용하여 컴포넌트 설정const Box = styled.div`background-color : ${(props) => props.bgColor};width: 100px;height: 100px;`;func..

#14  Routing bonus   [toDo, ...currentArray]); [6, array]→ [6, [1, 2, 3]] (6과" data-og-host="shyeeon.tistory.com" data-og-source-url="https://shyeeon.tistory.com/12" data-og-url="https://shyeeon.tistory.com/12" data-og-image="https://blog.kakaocdn.net/dna/er6X2Q/hyWzDG8Cg2/AAAAAAAAAAAAAAAAAAAAAFeHNvaa3a2oQhqaV78Kyr-vh5RMOLZP_1iOZRDbQmU0/img.png?credential=yqXZFxpELC7KVnFOS48ylbz2pIh7yKj8&expires=1769871599&allow_ip=&allow_referer=&signature=MljwMg9gITr2LnA724P4Z3cliyM%3D

#12 Making the Movie App / #13 Conclusions • Axiosfetch 위에 있는 작은 layerHTTP 요청을 간편하게 할 수 있게 도와주는 라이브러리 axios 설치npm install axios   getMovies = async () => { const movies = await axios.get("https://yts-proxy.nomadcoders1.now.sh/list_movies.json"); }➣ async함수 앞에 붙여서 해당 함수가 *Promise 반환하도록 만든다*Promise: 비동기 작업의 완료 or 실패 나타내는 객체 ➣ axios.getURL 데이터 가져오고 변수에 저장 ➣ await비동기 함수 내에서 Promise가 해결될 때까지 기다리..