최대 1 분 소요

프로젝트 타이틀 수정하기

pubilc 폴더에 index.html의 title 부분에서 수정해준다.
그리고 meta 부분에 description 부분에서 content의 내용을 “나만의 감정 일기장” 으로 바꿔준다.
html lang=’ko’ 로도 바꾸어 준다.

페이지 별 타이틀 붙히기

리액트에서 html 의 타이틀을 수정할 수 있는 방법이 있다.

// Home.js
useEffect(() => {
  const titleElem = document.getElementsByTagName("title")[0];
  titleElem.innerHTML = `감정 일기장`;
}, []);
// Diary.js
useEffect(() => {
  const titleElem = document.getElementsByTagName("title")[0];
  titleElem.innerHTML = `감정 일기장-${id}번 일기`;
}, []);
// Edit.js
useEffect(() => {
  const titleElem = document.getElementsByTagName("title")[0];
  titleElem.innerHTML = `감정 일기장-${id}번 일기 수정`;
}, []);
// New.js
useEffect(() => {
  const titleElem = document.getElementsByTagName("title")[0];
  titleElem.innerHTML = `새 일기`;
}, []);

타이틀 옆에 아이콘 바꾸기

public 폴더에 favicon.ico을 넣으면 된다.

빌드 하기

꼭 필요한 코드들만, 공백 없이 zip 파일처럼 만드는 것! 결국 공백도 다 용량이기 때문에,,

  1. 명령어로 npm run build 치기
  2. build 폴더 생성
  3. npm install -g serve -> 전역적으로 serve 며영어 깔기
  4. serve -s build -> git bash로 진행할 것(권한 문제)
  5. Local 주소를 크롬에 입력 -> 실행되지 않는다면 검사를 통해서 확인해보기
  6. 에러가 있어서 수정사항이 생겼다면 수정하고 다시 1번부터 수행(3번은 제외)

태그:

카테고리:

업데이트:

댓글남기기