I had recently started using sage for theme development of a new design upgrade for an old WordPress website. This website was hosted on Digital Ocean droplet having OpenLiteSpeed server installed on it.
If you look at the roots ecosystem, you will see that they Trellis project which take care of Production, Staging and Development environments. But in my case I couldn't change the host. To solve this problem I used Github Actions to setup continuous deployment.
Steps Involved
- Setting up Github Repository
- Setting up your host machine
- Command to push code to Host from local
Setting up Github Repository
I am considering that you have your sage code pushed to your remote github repository.
We will start by adding actions.
- Click on the "Actions" tab in your repository.
- Click on the button "Skip this and set up a workflow yourself ->" next. You will find it in the top section.
- You will be taken to a page where which would be at
your-repo/.github/workflows/main.yml
. Change the name of the file todeployment.yml
as we are creating actions to deploy our code. - Copy the code from below and paste it in your
deployment.yml
file.
- In line no. 27 you will have to change the value of
dest
. This is what the value of dist will be for you<user>@<host ip>:<path-to-your-theme>
. So for examplebhanu@111.11.111.111:/var/www/html/wp-content/themes/theme-name
- After this is done you have to on "Start Commit" button and merge it into your master branch.
- You will have to add a secret
DEPLOY_KEY
which we will revisit after setting up our host.
Setting up your host machine
ssh
into your machine. We will create a SSH key and add it our github repository in order for our give our github repository access to our host machine.
We do this in the following steps.
ssh-keygen -t rsa -b 4096 -C "your_email@example.com"
Don't forget to change the email ID to yours.
This will give you some prompts.
> Generating public/private rsa key pair.
> Enter a file in which to save the key (/home/you/.ssh/id_rsa): [Press enter]
> Enter passphrase (empty for no passphrase): [Type a passphrase]
> Enter same passphrase again: [Type passphrase again]
You have to press enter and skip all of the above. In some cases you may already have an SSH key and you can overwrite it in order to create a fresh one.
You have now created a new ssh at ~/.ssh/id_rsa
.
Adding SSH key to the ssh-agent
Enter the following command.
eval $(ssh-agent -s)
> Agent pid 59566
ssh-add ~/.ssh/id_rsa
Now we need to add our public key id_rsa.pub
to the authorized_keys.
You can do this by.
# Getting inside SSH file
$ cd ~/.ssh/
# Copying pub key into your clipboard
$ cat id_rsa.pub
# This would print the content on the screen which you have to copy
# paste the content inside authorized_keys
$ nano authorized_keys
# To save press Ctrl+X -> y -> Press Enter
# Copy the content of public key
$ cat id_rsa
# This will paste the content of the public key which you have to copy starting from Start here till the end.
This is the point where we go back to point 7 of Setting up Github Repository
In your Github repository you go
-> settings tab
-> Secrets
-> Click on New secret
button
-> Type the name of the secret as DEPLOY_KEY
-> Paste the content of public key copied above here and hit Add secret
.
We are almost done. We just have to test if everything is working fine or not.
Go to your local development and git push all the changes you want to deploy. When you are satisfied with the changes and you have pushed those in your master branch use this command.
git push origin master:production
This will push all the contents of master branch to production branch.
Now if you look closely at our deployment.yml
file you can see these lines of code.
name: Deployment
on:
push:
branches: [ production ]
These lines tells that this action gets triggered when there is a push in the production branch.
You can look at your progress by going to the Actions
tab. You would see a action is running. You can click on deploy to check the status and log of the same.
Let me know if you have any questions regarding this method, or you are stuck somewhere in the process.
Top comments (3)
this is super helpful, thanks for sharing it!
I have mode this blog to my own website and would be updating the blog if and when needed there.
bhanusingh.in/deploying-sagewordpr...
Very simple to understand and follow. Great Job Bhanu :). I have taught you well. :P