Step 1. Set Up Your Next.js Project
1-0. Initialize Your Next.js Project:
$ npx create-next-app@latest
1-1. had domain
$ cd my_project_directory
$ echo -e 'sidcode.me' > public/CNAME
$ cat public/CNAME
sidcode.me
1-2. Update next.config.js
or next.config.mjs
/** @type {import('next').NextConfig} */
const nextConfig = {
output: 'export',
images: {
unoptimized: true,
},
reactStrictMode: true,
assetPrefix: '.',
};
export default nextConfig;
1-3. Update postcss.config.js
or postcss.config.mjs
/** @type {import('postcss-load-config').Config} */
const config = {
plugins: {
tailwindcss: {},
autoprefixer: {},
},
};
export default config;
1-3-1. autoprefixer install
$ npm install autoprefixer --save-dev
1-4. Github
git init
git add .
git commit -m "Initial commit"
git remote add origin https://<id>:<token>@github.com/<username>/<repo>.git
git push -u origin master
Step 2: Deploy to GitHub Pages
2-1. Install gh-pages
: Install the gh-pages
package to help deploy your app:
$ npm install gh-pages --save-dev
2-2. Update package.json
: Add the following scripts to your package.json
:
"scripts": {
"dev": "next dev",
"start": "next start",
"lint": "next lint",
"build": "next build",
"deploy": "touch out/.nojekyll && gh-pages -d out -t true",
"deploy-npm": "npm run build && npm run deploy"
},
// "deploy": "gh-pages -d out -f" // one time force / 안될때 1회성
2-3. Deploy Your Pages: Run the following command to deploy your Pages to GitHub Pages:
$ npm run deploy-npm
Like this!
Top comments (2)
great
great