https://velog.io/@byjihye/react-github-pages
๐ React ํ๋ก์ ํธ GitHub Pages ๋ฐฐํฌํ๊ธฐ
์ ๋ ํ๋ก์ ํธ create-react-app ์ผ๋ก ๋ง๋ค์์ต๋๋ค :)
๐ 1. GitHub ์ ์ฅ์ ๋ง๋ค๊ธฐ
๋จผ์ ์์ ์ github์ ์ ์ฅ์๋ฅผ ํ๋ ์์ฑํด์ค๋๋ค.
์ ๋ react-github-pages๋ก ๋ง๋ค์์ต๋๋ค :)
์ ์ฅ์์ด๋ฆ, ์ค๋ช ์์ฑํ๊ณ Create repository ํด๋ฆญ
๐ 2. ํ๋ก์ ํธ์์ git ์ ์ฅ์ ์ค์นํ๊ธฐ
์ฐจ๋ก๋๋ก ๋ช ๋ น์ด ์คํ
git init
git add *
git commit -m 'first commit'
git remote add origin https://github.com/JIHYE-P/react-github-pages.git
git push -u origin master
๋ช
๋ น์ด์ ๋ํด์ ๊ฐ๋จํ ์ค๋ช
์ ๋ง๋ถํ์๋ฉด,,,
git init - ํ๋ก์ ํธ์ git์ค์น
git add * - .gitignore์ ์๋ ํ์ผ ์ ์ธํ๊ณ ๋ชจ๋ ์ฌ๋ฆฌ๊ธฐ
git commit -m 'first commit' - commit ๋ฉ์ธ์ง ์์ฑ
git remote add origin https://github.com/JIHYE-P/react-github-pages.git - git ์ ์ฅ์ ์ฐ๊ฒฐ
git push -u origin master - git master๋ก push
push๊น์ง ์๋ฃ๋๋ฉด github ํ์ด์ง๋ก ๋์๊ฐ์ ์๋ก๊ณ ์นจํ๋ฉด ์์ค๋ค์ด ์ฌ๋ผ์์๋ค.
๐ 3. github pages ๋ฐฐํฌํ๊ธฐ
๋จผ์ ํ๋ก์ ํธ์ gh-pages ํจํค์ง๋ฅผ ์ค์นํด์ผํฉ๋๋ค.
npm install gh-pages --save-dev
์ค์น๊ฐ ์๋ฃ๋๋ฉด ํ๋ก์ ํธ์ ์๋ package.json ํ์ผ์ ์ด์ด "homepage" ์ฃผ์๋ฅผ ์ถ๊ฐํฉ๋๋ค.
//....
"homepage": "http://JIHYE-P.github.io/react-github-pages"
ํ์์ http://{์ฌ์ฉ์ ์ด๋ฆ}.github.io/{์ ์ฅ์ ์ด๋ฆ}๋ก ์์ฑํฉ๋๋ค.
๊ทธ๋ค์, script ๋ถ๋ถ์ predeploy, deploy ๋ฅผ ์ถ๊ฐํฉ๋๋ค.
"scripts": {
//...
"predeploy": "npm run build",
"deploy": "gh-pages -d build"
}
์ ์ฅํ๊ณ ํฐ๋ฏธ๋์ฐฝ์ ์ด์ด npm run deploy๋ฅผ ์คํํฉ๋๋ค.
ํ์ธ์ ์ํด github ํด๋น ์ ์ฅ์ ํ์ด์ง๋ก ๋์๊ฐ ์ฐ์ธก์ ์๋ Settings -> Options ์์ GitHub Pages ์์ ํ์ธํ์ค ์ ์์ต๋๋ค.
(๋ง์ฝ ์ฌ์ดํธ์์ README.md ํ์ผ ๋ด์ฉ์ด ๋์ฌ ๊ฒฝ์ฐ GitHub Pages์
Source ๋ถ๋ถ์์ gh-pages branch๋ก ๋ณ๊ฒฝํ๋ฉด ์ฌ์ดํธ๊ฐ ์ ์์ ์ผ๋ก ๋ฐฐํฌ๋ฉ๋๋ค!!)
๋ฐฐํฌ์๋ฃ! ๐
๐ 4. ์ฐธ๊ณ (2021.01.14)
๋ค๋ฅธ ํ๋ก์ ํธ๋ฅผ ๋ฐฐํฌํ๋ ๊ณผ์ ์์
hompage : "http://{์ฌ์ฉ์ ์ด๋ฆ}.github.io/{์ ์ฅ์ ์ด๋ฆ}" ๋ก ์ค์ ๋ ์ฃผ์๋ก ์ ์ํ๋๊น 404 ํ์ด์ง๊ฐ ๋์๋ค.
์ด๋ด๋ http://{์ฌ์ฉ์ ์ด๋ฆ}.github.io/{์ ์ฅ์ ์ด๋ฆ}/index.html ๋ก ์ ์ํ๋ฉด ๋์จ๋ค.