Use GitHub actions as your CI/CD to fetch from Figma, transform the tokens, build the static site, and ship to AWS S3.
This uses the ubuntu:latest image. It is designed to fire manually from the UI, or to be scheduled through the GitHub scheduling interface. This pipeline will fetch the tokens, build the code, and upload it to an S3 bucket. It leverages the fact that GitHub provides the AWS CLI tooling natively. The second step could be removed and replaced with a command to ship the artifact to a host of your choice.
1# A name for your job 2name: Handoff Token Automation Workflow 3 4on: 5 # Trigger on Push 6 push: 7 branches: [main] 8 # Trigger twice a day on schedule 9 schedule: 10 # * is a special character in YAML so you have to quote this string 11 - cron: "30 */12 * * *" 12 # Manual Trigger 13 workflow_run: 14 15# The main job 16jobs: 17 build: 18 # Use Ubuntu Latest for the build 19 runs-on: ubuntu-latest 20 # These env vars are required 21 env: 22 AWS_DEFAULT_REGION: us-east-1 23 AWS_DEFAULT_OUTPUT: json 24 FIGMA_PROJECT_ID: ${{ secrets.FIGMA_PROJECT_ID }} 25 DEV_ACCESS_TOKEN: ${{ secrets.DEV_ACCESS_TOKEN }} 26 AWS_CLOUDFRONT_DIST_ID: ${{ secrets.AWS_DISTRIBUTION }} 27 AWS_S3_BUCKET: ${{ secrets.AWS_BUCKET }} 28 AWS_ACCESS_KEY_ID: ${{ secrets.AWS_ACCESS_KEY_ID }} 29 AWS_SECRET_ACCESS_KEY: ${{ secrets.AWS_SECRET_ACCESS_KEY }} 30 # Build against node 18 31 strategy: 32 matrix: 33 node-version: [18.x] 34 35 steps: 36 # Use the GitHub Checkout toolchain 37 - uses: actions/checkout@v3 38 # Verify that node 18 is ready 39 - name: Use Node.js ${{ matrix.node-version }} 40 uses: actions/setup-node@v3 41 with: 42 node-version: ${{ matrix.node-version }} 43 # Set git defaults so we can commit fetched tokens on the next step 44 # Change the email address here so this is committed by the right user 45 - name: Set Git Defaults 46 run: | 47 git config --global user.email "handoff@convertiv.com" 48 git config --global user.name "Handoff Development" 49 # Fetch tokens from Figma and push them back to the repository 50 - name: Fetch from Figma 51 run: | 52 npm install --legacy-peer-deps 53 npm run fetch 54 git commit -a -m "[skip ci] updating changelog with latest Figma changes" 55 git push 56 # Build a static site 57 - name: Build static site 58 run: | 59 npm run build 60 # Deploy built artifacts to S3 61 - name: Deploy to S3 Bucket 62 run: | 63 aws s3 sync --delete dist/ s3://${{env.AWS_S3_BUCKET}}/ 64 aws cloudfront create-invalidation --distribution-id ${{ secrets.AWS_DISTRIBUTION }} --paths /\*