I started building and managing websites with HubSpot recently because it offers the flexibility to allow other team members, especially those who are in the marketing team, to create and customize a landing page.
Instead of following recommended deployment method by HubSpot, I need to find a way to make the development process seamless while also allowing the rest of the team members to make changes in the Design Tools. It means that the rest of the team members don’t have to use version control if they prefer to update the code directly.
I decided to write a shell script that allows me to choose which folder to fetch, upload, and watch. Here is the content of the shell script:
#!/usr/bin/env zsh
# List of projects in their respective folder
# "folder_paths" is a dictionary, you can add more folders
# if you need to specify a different project to watch.
declare -A folder_paths
folder_paths[root]="Default/"
folder_paths[carbon]="Templates/Carbon/"
folder_paths[publishers]="Templates/Publishers/"
# Default Options
portal=${portal:-DEV}
project=${project:-root}
action=${action:-watch}
while [ $# -gt 0 ]; do
if [[ $1 == *"--"* ]]; then
param="${1/--/}"
declare $param="$2"
# echo $1 $2 // Optional to see the parameter:value result
fi
shift
done
# Main Commands
echo "[Working Portal] : \""${portal} "portal"\"
echo "[Selected Folder] : \"${folder_paths[${project}]}\""
hs ${action} --account=${portal} "${folder_paths[${project}]}" "${folder_paths[${project}]}"
How It Works
For example, if I need to upload the changes I made to the Carbon website, I can run this command:
zsh deploy.sh --action upload --portal PROD --project carbon
The available commands are based on HubSpot CLI. You can also run other commands such as --action watch if you wish to watch and preview the changes you’ve made locally on the staging or production.
I want to share why this shell script is important in the daily workflow. When it comes to the business, we need to be able to prioritize. If you’re like me, you probably want to follow the best practice to deploy changes to the production website. However, there are other factors to take into consideration.
- The team members must be able to make changes using HubSpot Design Tools without waiting for developers.
- Developers must be able to use keep the version history of the changes they’ve made to the project.
- Several developers should still be able to collaborate through the shared remote repository.
Although it’s ideal to set up Continuous Integration with the GitHub repository, I feel that creating a simple shell script above can accommodate the current needs of the business where we need the flexibility from both marketers and developers to push updates quickly.
One thing I’ve learned from being on the side of “not” working with codes and working with codes directly is to choose the most efficient and resilient method when it comes to solving a problem.