Skip to content

Commit

Permalink
[2.5] Web updates (#2977)
Browse files Browse the repository at this point in the history
* Add flare series section, enhancements (#2948)

* improvements, add series section

* address comments

* add research links redirects (#2953)

Co-authored-by: Yuan-Ting Hsieh (謝沅廷) <[email protected]>

* add web versioning (#2974)

Co-authored-by: Chester Chen <[email protected]>

---------

Co-authored-by: Yuan-Ting Hsieh (謝沅廷) <[email protected]>
Co-authored-by: Chester Chen <[email protected]>
  • Loading branch information
3 people authored Oct 2, 2024
1 parent ea97593 commit 80b1119
Show file tree
Hide file tree
Showing 22 changed files with 695 additions and 295 deletions.
53 changes: 26 additions & 27 deletions .github/workflows/deploy.yml
Original file line number Diff line number Diff line change
@@ -1,27 +1,34 @@
name: Deploy to GitHub Pages
name: Deploy to gh-pages

on:
# Trigger the workflow every time you push to the `main` branch
# Using a different branch name? Replace `main` with your branch’s name
# Trigger the workflow if any web/** files are modified
push:
branches: [ main ]
# Allows you to run this workflow manually from the Actions tab on GitHub.
branches:
- "main"
- "2.5"
paths:
- 'web/**'
workflow_dispatch:

env:
site_path: ./web
version_path: /

# Allow this job to clone the repo and create a page deployment
permissions:
contents: read
contents: write
pages: write
id-token: write

jobs:
build:
runs-on: ubuntu-latest
steps:
- name: Checkout your repository using git
- name: Update version_path for non-main branches
if: ${{ github.ref_type == 'branch' && github.ref_name != 'main'}}
run: echo version_path=/version/${{ github.ref_name }}/ >> $GITHUB_ENV

- name: Checkout your repository
uses: actions/checkout@v4

- name: Setup Node
Expand All @@ -31,28 +38,20 @@ jobs:
cache: npm
cache-dependency-path: "${{ env.site_path }}/package-lock.json"

- name: Install
shell: "bash"
working-directory: ${{ env.site_path }}
- name: Install dependencies
run: npm install

- name: Build
shell: "bash"
working-directory: ${{ env.site_path }}

- name: Build project
run: npm run build
env:
PUBLIC_GH_BRANCH: ${{ github.ref_name }}
working-directory: ${{ env.site_path }}

- name: Upload Pages Artifact
uses: actions/upload-pages-artifact@v3
- name: Deploy
uses: JamesIves/github-pages-[email protected]
with:
path: "${{ env.site_path }}/dist/"

deploy:
needs: build
runs-on: ubuntu-latest
environment:
name: github-pages
url: ${{ steps.deployment.outputs.page_url }}
steps:
- name: Deploy to GitHub Pages
id: deployment
uses: actions/deploy-pages@v4
branch: gh-pages
folder: ${{ env.site_path }}/dist
target-folder: ${{ env.version_path }}
clean-exclude: version
16 changes: 0 additions & 16 deletions research/auto-fed-rl/index.html

This file was deleted.

16 changes: 0 additions & 16 deletions research/condist-fl/index.html

This file was deleted.

16 changes: 0 additions & 16 deletions research/fed-bpt/index.html

This file was deleted.

16 changes: 0 additions & 16 deletions research/fed-ce/index.html

This file was deleted.

16 changes: 0 additions & 16 deletions research/fed-sm/index.html

This file was deleted.

16 changes: 0 additions & 16 deletions research/one-shot-vfl/index.html

This file was deleted.

16 changes: 0 additions & 16 deletions research/quantifying-data-leakage/index.html

This file was deleted.

4 changes: 3 additions & 1 deletion web/astro.config.mjs
Original file line number Diff line number Diff line change
@@ -1,8 +1,10 @@
import { defineConfig } from "astro/config";
import tailwind from "@astrojs/tailwind";

const branch = process.env.PUBLIC_GH_BRANCH;

export default defineConfig({
site: "https://nvidia.github.io",
base: "/NVFlare",
base: branch === 'main' ? '/NVFlare' : `/NVFlare/version/${branch}`,
integrations: [tailwind()],
});
29 changes: 10 additions & 19 deletions web/src/components/code.astro
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,8 @@ import 'prismjs/plugins/line-numbers/prism-line-numbers.css'
import GoogleColab from '../images/google_colab.svg.png'
const gh_branch = import.meta.env.PUBLIC_GH_BRANCH;
// PyTorch Code Sections --------------------------------------------------
const installCode_pt = `
Expand Down Expand Up @@ -625,8 +627,8 @@ python3 fedavg_cifar10_tf_job.py
const frameworks = [
{
id: "pytorch",
colab_link: "https://colab.research.google.com/github/NVIDIA/NVFlare/blob/main/examples/getting_started/pt/nvflare_pt_getting_started.ipynb",
github_link: "https://github.com/NVIDIA/NVFlare/blob/main/examples/getting_started/pt/nvflare_pt_getting_started.ipynb",
colab_link: `https://colab.research.google.com/github/NVIDIA/NVFlare/blob/${gh_branch}/examples/getting_started/pt/nvflare_pt_getting_started.ipynb`,
github_link: `https://github.com/NVIDIA/NVFlare/blob/${gh_branch}/examples/getting_started/pt/nvflare_pt_getting_started.ipynb`,
sections: [
{
id: "install-pytorch",
Expand Down Expand Up @@ -679,8 +681,8 @@ const frameworks = [
},
{
id: "lightning",
colab_link: "https://colab.research.google.com/github/NVIDIA/NVFlare/blob/main/examples/getting_started/pt/nvflare_lightning_getting_started.ipynb",
github_link: "https://github.com/NVIDIA/NVFlare/blob/main/examples/getting_started/pt/nvflare_lightning_getting_started.ipynb",
colab_link: `https://colab.research.google.com/github/NVIDIA/NVFlare/blob/${gh_branch}/examples/getting_started/pt/nvflare_lightning_getting_started.ipynb`,
github_link: `https://github.com/NVIDIA/NVFlare/blob/${gh_branch}/examples/getting_started/pt/nvflare_lightning_getting_started.ipynb`,
sections: [
{
id: "install-lightning",
Expand Down Expand Up @@ -733,8 +735,8 @@ const frameworks = [
},
{
id: "tensorflow",
colab_link: "https://colab.research.google.com/github/NVIDIA/NVFlare/blob/main/examples/getting_started/tf/nvflare_tf_getting_started.ipynb",
github_link: "https://github.com/NVIDIA/NVFlare/blob/main/examples/getting_started/tf/nvflare_tf_getting_started.ipynb",
colab_link: `https://colab.research.google.com/github/NVIDIA/NVFlare/blob/${gh_branch}/examples/getting_started/tf/nvflare_tf_getting_started.ipynb`,
github_link: `https://github.com/NVIDIA/NVFlare/blob/${gh_branch}/examples/getting_started/tf/nvflare_tf_getting_started.ipynb`,
sections: [
{
id: "install-tensorflow",
Expand Down Expand Up @@ -838,7 +840,7 @@ const frameworks = [
</div>

<!-- Google Colab Button -->
<a id="colab-button" href="https://colab.research.google.com/github/NVIDIA/NVFlare/blob/main/examples/getting_started/pt/nvflare_pt_getting_started.ipynb" target="_blank" rel="noopener noreferrer" class="text-xs font-semibold text-gray-900 dark:text-gray-400 m-0.5 hover:bg-gray-100 dark:bg-gray-800 dark:border-gray-600 dark:hover:bg-gray-700 rounded-lg py-2 px-2.5 inline-flex items-center justify-center bg-white border-gray-200 border">
<a id="colab-button" href=`https://colab.research.google.com/github/NVIDIA/NVFlare/blob/${gh_branch}/examples/getting_started/pt/nvflare_pt_getting_started.ipynb` target="_blank" rel="noopener noreferrer" class="text-xs font-semibold text-gray-900 dark:text-gray-400 m-0.5 hover:bg-gray-100 dark:bg-gray-800 dark:border-gray-600 dark:hover:bg-gray-700 rounded-lg py-2 px-2.5 inline-flex items-center justify-center bg-white border-gray-200 border">
<span id="default-message" class="inline-flex items-center">
<svg class="w-0 h-3" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 18 20">
<img class="w-6 me-1.5" src={GoogleColab.src} alt="NVIDIA logo">
Expand All @@ -848,7 +850,7 @@ const frameworks = [
</a>

<!-- View on Github Button -->
<a id="github-button" href="https://github.com/NVIDIA/NVFlare/blob/7055e1ad2adc97c114678f65f36b189f8641ef3e/examples/getting_started/pt/nvflare_pt_getting_started.ipynb" target="_blank" rel="noopener noreferrer" class="text-xs font-semibold text-gray-900 dark:text-gray-400 m-0.5 hover:bg-gray-100 dark:bg-gray-800 dark:border-gray-600 dark:hover:bg-gray-700 rounded-lg py-2 px-2.5 inline-flex items-center justify-center bg-white border-gray-200 border">
<a id="github-button" href=`https://github.com/NVIDIA/NVFlare/blob/${gh_branch}/examples/getting_started/pt/nvflare_pt_getting_started.ipynb` target="_blank" rel="noopener noreferrer" class="text-xs font-semibold text-gray-900 dark:text-gray-400 m-0.5 hover:bg-gray-100 dark:bg-gray-800 dark:border-gray-600 dark:hover:bg-gray-700 rounded-lg py-2 px-2.5 inline-flex items-center justify-center bg-white border-gray-200 border">
<span id="default-message" class="inline-flex items-center">
<svg class="w-4 h-4 text-black dark:text-white mr-2" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 24 24">
<path fill-rule="evenodd" d="M12.006 2a9.847 9.847 0 0 0-6.484 2.44 10.32 10.32 0 0 0-3.393 6.17 10.48 10.48 0 0 0 1.317 6.955 10.045 10.045 0 0 0 5.4 4.418c.504.095.683-.223.683-.494 0-.245-.01-1.052-.014-1.908-2.78.62-3.366-1.21-3.366-1.21a2.711 2.711 0 0 0-1.11-1.5c-.907-.637.07-.621.07-.621.317.044.62.163.885.346.266.183.487.426.647.71.135.253.318.476.538.655a2.079 2.079 0 0 0 2.37.196c.045-.52.27-1.006.635-1.37-2.219-.259-4.554-1.138-4.554-5.07a4.022 4.022 0 0 1 1.031-2.75 3.77 3.77 0 0 1 .096-2.713s.839-.275 2.749 1.05a9.26 9.26 0 0 1 5.004 0c1.906-1.325 2.74-1.05 2.74-1.05.37.858.406 1.828.101 2.713a4.017 4.017 0 0 1 1.029 2.75c0 3.939-2.339 4.805-4.564 5.058a2.471 2.471 0 0 1 .679 1.897c0 1.372-.012 2.477-.012 2.814 0 .272.18.592.687.492a10.05 10.05 0 0 0 5.388-4.421 10.473 10.473 0 0 0 1.313-6.948 10.32 10.32 0 0 0-3.39-6.165A9.847 9.847 0 0 0 12.007 2Z" clip-rule="evenodd"/>
Expand Down Expand Up @@ -908,17 +910,6 @@ const frameworks = [
<!-- Run wrapper -->
<div id="run-wrapper" class="mx-auto max-w-5xl py-4 text-left"></div>

<!-- Tutorial Catalog Button -->
<div class="mt-32 text-center">
<p class="text-lg mt-4 mb-8 text-slate-600 w-3/4 m-auto">
To dive deeper into what NVIDIA FLARE has to offer, explore our catalog of various tutorials and examples showcasing everything from the core features to advanced applications.
</p>
<a
href="/NVFlare/catalog"
class="rounded-md bg-nvidia px-3.5 py-2.5 text-mg font-semibold text-white shadow-sm hover:bg-green-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-nvidia"
>Tutorial Catalog -></a
>
</div>
</div>
</div>

Expand Down
5 changes: 4 additions & 1 deletion web/src/components/footer.astro
Original file line number Diff line number Diff line change
@@ -1,11 +1,14 @@
---
import NvidiaLogo from '../images/nvidia_eye.png';
const base_url = import.meta.env.BASE_URL;
---
<footer class="bg-gray-100 dark:bg-gray-900">
<div class="mx-auto w-full max-w-screen-xl p-4 py-6 lg:py-8">
<div class="md:flex md:justify-between">
<div class="mb-6 md:mb-0">
<a href="/NVFlare" class="flex items-center">
<a href={base_url} class="flex items-center">
<img class="flex items-center h-8 me-3" src={NvidiaLogo.src} alt="NVIDIA logo">
<span class="self-center text-2xl font-semibold whitespace-nowrap dark:text-white">NVIDIA FLARE</span>
</a>
Expand Down
16 changes: 9 additions & 7 deletions web/src/components/gettingStarted.astro
Original file line number Diff line number Diff line change
@@ -1,4 +1,6 @@
---
const gh_branch = import.meta.env.PUBLIC_GH_BRANCH;
const walkthrough = [
{
id: "step1",
Expand All @@ -17,7 +19,7 @@ const walkthrough = [
description:
"Use the ModelController API to write a federated control flow for FedAvg.",
button_text: "View Source",
link: "https://github.com/NVIDIA/NVFlare/blob/main/nvflare/app_common/workflows/fedavg.py",
link: `https://github.com/NVIDIA/NVFlare/blob/${gh_branch}/nvflare/app_common/workflows/fedavg.py`,
video: "https://developer.download.nvidia.com/assets/Clara/flare/Flare%202.5.0%20Getting%20Started%20-%20Part%202%20-%20Server.mp4",
},
{
Expand All @@ -27,7 +29,7 @@ const walkthrough = [
description:
"Use the Client API to write local training code for a PyTorch CIFAR-10 trainer.",
button_text: "View Source",
link: "https://github.com/NVIDIA/NVFlare/blob/main/examples/getting_started/pt/src/cifar10_fl.py",
link: `https://github.com/NVIDIA/NVFlare/blob/${gh_branch}/examples/getting_started/pt/src/cifar10_fl.py`,
video: "https://developer.download.nvidia.com/assets/Clara/flare/Flare%202.5.0%20Getting%20Started%20-%20Part%203%20-%20Client.mp4",
},
{
Expand All @@ -37,7 +39,7 @@ const walkthrough = [
description:
"Formulate the NVIDIA FLARE job and simulate a federated run with the multi-process simulator.",
button_text: "View Notebook",
link: "https://colab.research.google.com/github/NVIDIA/NVFlare/blob/main/examples/getting_started/pt/nvflare_pt_getting_started.ipynb",
link: `https://colab.research.google.com/github/NVIDIA/NVFlare/blob/${gh_branch}/examples/getting_started/pt/nvflare_pt_getting_started.ipynb`,
video: "https://developer.download.nvidia.com/assets/Clara/flare/Flare%202.5.0%20Getting%20Started%20-%20Part%204%20-%20Job.mp4",
},
{
Expand All @@ -47,7 +49,7 @@ const walkthrough = [
description:
"Learn more about NVIDIA FLARE and taking federated learning from simulation to the real world.",
button_text: "Tutorial Catalog",
link: "/NVFlare/catalog",
link: "catalog",
video: "https://developer.download.nvidia.com/assets/Clara/flare/Flare%202.5.0%20Getting%20Started%20-%20Part%205%20-%20Next%20Steps.mp4",
},
];
Expand All @@ -70,7 +72,7 @@ const km = [
description:
"What is Kaplan-Meier Analysis and how can we adapt it to a federated setting?",
button_text: "View Source",
link: "https://github.com/NVIDIA/NVFlare/tree/main/examples/advanced/kaplan-meier-he",
link: `https://github.com/NVIDIA/NVFlare/tree/${gh_branch}/examples/advanced/kaplan-meier-he`,
video: "https://developer.download.nvidia.com/assets/Clara/flare/Flare%202.5.0%20KM%20-%20Part%202%20-%20Kaplan%20Meier.mp4",
},
{
Expand All @@ -80,7 +82,7 @@ const km = [
description:
"Dive into an end-to-end implementation of federated Kaplan-Meier.",
button_text: "View Source",
link: "https://github.com/NVIDIA/NVFlare/tree/main/examples/advanced/kaplan-meier-he/src",
link: `https://github.com/NVIDIA/NVFlare/tree/${gh_branch}/examples/advanced/kaplan-meier-he/src`,
video: "https://developer.download.nvidia.com/assets/Clara/flare/Flare%202.5.0%20KM%20-%20Part%203%20-%20Implementation.mp4",
},
];
Expand Down Expand Up @@ -108,7 +110,7 @@ const series = [
<div class="mt-5 mb-2 border-b border-gray-200 dark:border-gray-700">
<ul class="flex flex-wrap -mb-px text-xl font-medium text-center place-content-center space-x-24" id="default-styled-tab" data-tabs-toggle="#default-styled-tab-content" data-tabs-active-classes="text-nvidia hover:text-nvidia dark:text-nvidia-light dark:hover:text-nvidia-light border-nvidia dark:border-nvidia-light" data-tabs-inactive-classes="dark:border-transparent text-gray-500 hover:text-gray-600 dark:text-gray-400 border-transparent hover:border-gray-300 dark:border-gray-700 dark:hover:text-gray-300" role="tablist">
<li class="me-2" role="presentation">
<button class="inline-block p-4 border-b-2 rounded-t-lg font-bold hover:text-gray-600 hover:border-gray-300 dark:hover:text-gray-300" id="walkthrough-tab" data-tabs-target="#series0" type="button" role="tab" aria-controls="settings" aria-selected="false">NVIDIA FLARE Walkthrough: CIFAR-10</button>
<button class="inline-block p-4 border-b-2 rounded-t-lg font-bold hover:text-gray-600 hover:border-gray-300 dark:hover:text-gray-300" id="walkthrough-tab" data-tabs-target="#series0" type="button" role="tab" aria-controls="settings" aria-selected="false">Walkthrough: CIFAR-10</button>
</li>
<li class="me-2" role="presentation">
<button class="inline-block p-4 border-b-2 rounded-t-lg font-bold" id="km-tab" data-tabs-target="#series1" type="button" role="tab" aria-controls="profile" aria-selected="false">End-to-End: Kaplan-Meier</button>
Expand Down
Loading

0 comments on commit 80b1119

Please sign in to comment.