DEV Community

Cover image for Deploying a Vite app on GitHub Pages using GitHub Actions with GitHub Secrets

Deploying a Vite app on GitHub Pages using GitHub Actions with GitHub Secrets

Douglas Toledo on November 22, 2023

First of all -- I'll assume that you already have a Vite React App created in a GitHub repository. In this article, I will use my portfo...
Read full post
Collapse
 
akselipalmer profile image
Akseli Palmer •

Hey Douglas. This helped me a lot.

I ran into an issue when I was on step 6. Name the new workflow as "deploy"..

I actually had to change the file name to include ".yml" in order for it to work. So after renaming, the file was named "deploy.yml"

I think it would be helpful to have an extra instruction to verify that the file is named correctly.

Thanks again for creating this awesome post!
Other than that small hiccup, it was incredibly easy and straightforward to follow.

Collapse
 
dwtoledo profile image
Douglas Toledo •

Thanks, I just adjusted the post with your seggestion.

Collapse
 
hemantgovekar profile image
Hemant Govekar •

Thanks for this article. Will definitely try👍

Collapse
 
hashim_here profile image
Legend id Id •

Quick question: If we are just injecting environment variables and then simply building the app(In workflow context), won't the build have environment variables in it? or someway won't the environment variables be accessible? Is that something to be concerned off?

Collapse
 
dwtoledo profile image
Douglas Toledo •

You're absolutely right, this is a valid concern!
In the article, I exposed my OPEN_AI_API_KEY environment variable after the project build. To address the issue, I created a custom backend to securely handle and hide this sensitive information.

Thank you for pointing this out! I’ll make sure to update the article to emphasize this concern.

This tutorial is best suited for cases where no sensitive information is at risk of being exposed — perhaps for handling basics and general configuration variables.