기타 추가 사항React+REST API 게시판 구현/FE - React2022. 3. 18. 01:07
Table of Contents
Favicon / OG tag / title 변경하기
- 이제 프로젝트의 기능을 모두 구현했으므로 Favicon과 OG 태그, 브라우저에 보일 프로젝트의 제목을 설정하자.
- public 디렉토리 아래의 index.html 파일을 아래와 같이 수정해보자
- 또한 반응형 웹 어플리케이션을 사용하기 위해 initial-scale=1.0인 메타 태그도 하나 추가하자
- 전체 넓이를 디바이스의 넓이로 사용한다는 의미이다!
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<!--반응형을 위해-->
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<!--Favicon %PUBLIC_URL%은 public 폴더를 의미-->
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
<!--OG태그 - 제목, 설명, 사진-->
<meta property="og:title" content="Duckgugong" />
<meta property="og:description" content="Duckgugong의 게시판" />
<meta property="og:image" content="%PUBLIC_URL%/img/duckgugong.png" />
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
<!--TITLE-->
<title>Duck90</title>
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div>
<!--
This HTML file is a template.
If you open it directly in the browser, you will see an empty page.
You can add webfonts, meta tags, or analytics to this file.
The build step will place the bundled scripts into the <body> tag.
To begin the development, run `npm start` or `yarn start`.
To create a production bundle, use `npm run build` or `yarn build`.
-->
</body>
</html>- 나는 아래 링크에서 간단하게 이모지를 파비콘으로 사용했다!
https://favicon.io/emoji-favicons/memo
Favicon.io - The Ultimate Favicon Generator (Free)
With Favicon.io you can quickly generate a favicon for your website for free!
favicon.io
'React+REST API 게시판 구현 > FE - React' 카테고리의 다른 글
| 댓글 보기(페이지네이션), 추가 구현 (2) | 2021.10.25 |
|---|---|
| 게시물 수정, 삭제 구현 (0) | 2021.10.19 |
| 게시물 상세보기 페이지 구현 (0) | 2021.10.18 |
| 게시판/내 게시물 페이지 구현 - 페이지네이션 (0) | 2021.10.13 |
| 게시물 등록하기 페이지 구현 (0) | 2021.10.11 |
@덕구공 :: Duck9s'
주니어 개발자에욤
포스팅이 좋았다면 "좋아요❤️" 또는 "구독👍🏻" 해주세요!
