diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml index 7fc217b..f2a98fe 100644 --- a/.github/workflows/deploy.yml +++ b/.github/workflows/deploy.yml @@ -1,7 +1,7 @@ # Builds and pushes frontend to gh-pages branch # Pushes backend to server branch -name: CI +name: deploy next.js site to gh pages # Controls when the action will run. on: @@ -14,35 +14,75 @@ on: # Allows you to run this workflow manually from the Actions tab workflow_dispatch: +# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages +permissions: + contents: read + pages: write + id-token: write + +# Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued. +# However, do NOT cancel in-progress runs as we want to allow these production deployments to complete. +concurrency: + group: 'pages' + cancel-in-progress: false + jobs: # pushes frontend code to gh-pages branch - client-integration: - name: integrate-client + build: runs-on: ubuntu-latest steps: - # Checks-out your repository under $GITHUB_WORKSPACE, so your job can access it - - uses: actions/checkout@v2 - - # building the website - - uses: actions/setup-node@v2 - with: - node-version: '18' - - name: build site + # Checks out your repository under $GITHUB_WORKSPACE, so your job can access it + - name: Checkout + uses: actions/checkout@v4 + - name: Detect package manager + id: detect-package-manager run: | - npm ci - npm run build - npm run export - touch out/.nojekyll - echo "# Hi!" > out/README.md - echo "You're currently looking at the build artifacts of my website. To check out the code, switch over to my [personal-website repository!](https://github.com/samuel-ping/personal-website)!" >> out/README.md - echo "#### Note - This message was automatically generated." >> out/README.md - working-directory: ./ - - - name: push build artifacts to samuel-ping.github.io - uses: s0/git-publish-subdir-action@develop - env: - REPO: git@github.com:samuel-ping/samuel-ping.github.io.git - BRANCH: gh-pages - FOLDER: ./out - SSH_PRIVATE_KEY: ${{ secrets.DEPLOY_PRIVATE_KEY }} \ No newline at end of file + echo "manager=npm" >> $GITHUB_OUTPUT + echo "command=ci" >> $GITHUB_OUTPUT + echo "runner=npx --no-install" >> $GITHUB_OUTPUT + exit 0 + - name: Setup Node + uses: actions/setup-node@v4 + with: + node-version: '20' + cache: npm + - name: Setup Pages + uses: actions/configure-pages@v4 + with: + # Automatically inject basePath in your Next.js configuration file and disable + # server side image optimization (https://nextjs.org/docs/api-reference/next/image#unoptimized). + # + # You may remove this line if you want to manage the configuration yourself. + static_site_generator: next + - name: Restore cache + uses: actions/cache@v3 + with: + path: | + .next/cache + # Generate a new cache whenever packages or source files change. + key: ${{ runner.os }}-nextjs-${{ hashFiles('**/package-lock.json') }}-${{ hashFiles('**.[jt]s', '**.[jt]sx') }} + # If source files changed but packages didn't, rebuild from a prior cache. + restore-keys: | + ${{ runner.os }}-nextjs-${{ hashFiles('**/package-lock.json') }}- + - name: Install dependencies + run: npm ci + - name: Build with Next.js + run: npx next build + - name: Static HTML export with Next.js + run: npx next export + - name: Upload artifact + uses: actions/upload-pages-artifact@v3 + with: + path: ./out + + deploy: + environment: + name: github-pages + url: ${{ steps.deployment.outputs.page_url }} + runs-on: ubuntu-latest + needs: build + steps: + - name: Deploy to GitHub Pages + id: deployment + uses: actions/deploy-pages@v4 diff --git a/README.md b/README.md index 727d481..c546a66 100644 --- a/README.md +++ b/README.md @@ -6,6 +6,9 @@ This is my personal website's repository! Hopefully you're here because you like I built my website using Next.js and Tailwind CSS. +## Getting Started +Run `npm i` to install packages. Then `npm run dev` to run the site locally in dev mode. + ### Past Stuff #### Netlify CMS diff --git a/app/about/page.js b/app/about/page.js new file mode 100644 index 0000000..fe270af --- /dev/null +++ b/app/about/page.js @@ -0,0 +1,17 @@ +import { getMDXComponent } from 'mdx-bundler/client'; + +import { Components as MDXComponents } from '@/components/mdx/components'; + +import { GetAboutMDX } from '@/utils/mdxUtils'; + +export default async function Page() { + const { code } = await GetAboutMDX('about'); + const Component = getMDXComponent(code); + + return ( +
+ About me + +
+ ); +} diff --git a/app/error.js b/app/error.js new file mode 100644 index 0000000..3f0c4d7 --- /dev/null +++ b/app/error.js @@ -0,0 +1,7 @@ +'use client'; + +import NotFound from '@/components/notFound'; + +export default function Error() { + return ; +} diff --git a/app/layout.js b/app/layout.js new file mode 100644 index 0000000..45183f1 --- /dev/null +++ b/app/layout.js @@ -0,0 +1,26 @@ +import Navbar from '@/components/navbar'; +import Footer from '@/components/footer'; + +import NavbarButtons from '@/config/navbarButtons.config'; + +import './styles/globals.css'; + +export const metadata = { + title: { + default: 'Samuel Ping', + template: '%s | Sam Ping', + }, + description: 'Welcome to Next.js', +}; + +export default function RootLayout({ children }) { + return ( + + + +
{children}
+