diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml index 37a0663..366c4aa 100644 --- a/.github/workflows/deploy.yml +++ b/.github/workflows/deploy.yml @@ -4,19 +4,24 @@ on: push: branches: - main + pull_request: + types: + - opened + - synchronize + - reopened permissions: - contents: write + contents: read jobs: - build-and-deploy: + build: runs-on: ubuntu-latest steps: - name: Checkout - uses: actions/checkout@v4 + uses: actions/checkout@v6 - name: Set up Node.js - uses: actions/setup-node@v4 + uses: actions/setup-node@v6 with: node-version: 20 cache: 'npm' @@ -24,12 +29,42 @@ jobs: - name: Install dependencies run: npm ci + - name: Lint + run: npm run lint + - name: Build run: npm run build - - name: Deploy - uses: JamesIves/github-pages-deploy-action@v4 + - name: Upload Pages artifact + uses: actions/upload-pages-artifact@v5 + with: + path: dist + + deploy-production: + needs: build + if: github.event_name == 'push' && github.ref == 'refs/heads/main' + runs-on: ubuntu-latest + permissions: + pages: write + id-token: write + environment: + name: github-pages + url: ${{ steps.deployment.outputs.page_url }} + steps: + - name: Deploy to GitHub Pages + id: deployment + uses: actions/deploy-pages@v5 + + deploy-preview: + needs: build + if: github.event_name == 'pull_request' + runs-on: ubuntu-latest + permissions: + pages: write + id-token: write + steps: + - name: Deploy PR preview to GitHub Pages + id: deployment + uses: actions/deploy-pages@v5 with: - folder: dist - branch: gh-pages - clean: true + preview: true diff --git a/.gitignore b/.gitignore index a547bf3..3b1db30 100644 --- a/.gitignore +++ b/.gitignore @@ -10,6 +10,7 @@ lerna-debug.log* node_modules dist dist-ssr +stats.html *.local # Editor directories and files diff --git a/README.md b/README.md index 2db13f5..279da5d 100644 --- a/README.md +++ b/README.md @@ -22,3 +22,102 @@ This project is built with: - React - shadcn-ui - Tailwind CSS + +## GitHub Pages deployment setup (beginner step-by-step) + +This repository uses GitHub Actions to build and deploy: + +- **Production deploy**: only from `main` +- **Preview deploy**: from pull requests + +### 1) Confirm Pages source is GitHub Actions + +1. Open the repository on GitHub. +2. Click **Settings**. +3. In the left sidebar, click **Pages**. +4. Under **Build and deployment**: + - Set **Source** to **GitHub Actions**. +5. Click **Save** if shown. + +### 2) Configure production environment protection + +1. Go to **Settings** → **Environments**. +2. Open environment **github-pages** (create it if it does not exist). +3. In deployment branch rules: + - Allow only branch **main**. +4. (Recommended) Add required reviewers for production deployments. +5. Save the environment. + +### 3) Configure preview behavior + +PR preview deployments are created from pull request branches, not from `main`. + +To avoid branch-rule conflicts, this workflow does not assign an environment to the preview deployment job. Keep production protections on `github-pages` and let preview deploy from pull requests. + +### 4) Understand workflow behavior in this repository + +The workflow is in `.github/workflows/deploy.yml`. + +- `push` on `main`: + - `build` runs + - `deploy-production` runs (production deploy) +- `pull_request`: + - `build` runs + - `deploy-preview` runs (preview deploy) + +### 5) Local validation before pushing changes + +From the repository root: + +```sh +npm ci +npm run lint +npm run build +``` + +### 6) Daily development flow + +1. Pull latest `main`. +2. Create a feature branch. +3. Make your changes. +4. Run local validation (`npm run lint` and `npm run build`). +5. Push branch and open a pull request. +6. Wait for CI checks to finish. +7. Open the preview deployment URL and verify behavior. +8. Merge when everything looks correct. +9. Confirm production deploy after merge to `main`. + +### 7) How to verify preview deploy + +1. Open the pull request. +2. Open the **Checks** tab. +3. Open the **Deploy to GitHub Pages** workflow run. +4. Confirm: + - `build` job passed + - `deploy-preview` job passed +5. Open the deployment URL from the workflow/deployment details. + +### 8) How to verify production deploy + +1. Merge PR to `main`. +2. Open **Actions**. +3. Open latest **Deploy to GitHub Pages** run for `main`. +4. Confirm: + - `build` job passed + - `deploy-production` job passed +5. Open the live site and verify the latest change is visible. + +### 9) Troubleshooting quick map + +- **Lint/build fails**: run locally with `npm ci`, `npm run lint`, `npm run build` and fix reported errors. +- **Artifact upload fails**: check that build output path is `dist`. +- **Preview deploy blocked**: check repository/organization deployment policies and ensure PR deployments are allowed. +- **Production deploy blocked**: check `github-pages` environment branch rules, approvals, and permissions. + +### 10) Maintenance checklist + +Monthly or quarterly: + +1. Review workflow action versions in `.github/workflows/deploy.yml`. +2. Update to supported major versions when needed. +3. Test updates in a pull request before merging. diff --git a/src/assets/bioengine.jpeg b/src/assets/bioengine.jpeg new file mode 100644 index 0000000..c892704 Binary files /dev/null and b/src/assets/bioengine.jpeg differ diff --git a/src/components/ProjectsSection.tsx b/src/components/ProjectsSection.tsx index 7e10b5d..036e4bb 100644 --- a/src/components/ProjectsSection.tsx +++ b/src/components/ProjectsSection.tsx @@ -8,6 +8,9 @@ import secureDatasetSharingImg from "@/assets/Secure_dataset_sharing.png?w=800&f import dpoSrcSet from "@/assets/dpo.png?w=600;800;1200;1600&format=webp&as=srcset&quality=100"; import dpoImg from "@/assets/dpo.png?w=800&format=webp&quality=100"; // Fallback +import bioengineSrcSet from "@/assets/bioengine.jpeg?w=600;800;1200;1600&format=webp&as=srcset&quality=100"; +import bioengineImg from "@/assets/bioengine.jpeg?w=800&format=webp&quality=100"; // Fallback + import ptexImg from "@/assets/ptex.png?w=800&format=webp"; import startupImg from "@/assets/startup.jpg?w=800&format=webp"; import artifactsImg from "@/assets/artifacts.jpg?w=800&format=webp"; @@ -39,6 +42,17 @@ interface Project { } const projects: Project[] = [ + { + id: 9, + title: "BioEngine", + subtitle: "bioRxiv Paper on Agent-Readable Bioimage AI", + role: "Co-author", + date: "April 2026", + description: "I co-authored a bioRxiv paper introducing BioEngine, a platform for scalable execution and adaptation of bioimage AI through agent-readable interfaces.", + image: bioengineImg, + srcSet: bioengineSrcSet, + url: "https://www.biorxiv.org/content/10.64898/2026.04.19.719496v1", + }, { id: 0, title: "RI-SCALE Model Hub",