Skip to content

Instantly share code, notes, and snippets.

@good-idea
Last active April 15, 2022 23:37
Show Gist options
  • Save good-idea/a398f2ab2e3d9dba265b6a0681936617 to your computer and use it in GitHub Desktop.
Save good-idea/a398f2ab2e3d9dba265b6a0681936617 to your computer and use it in GitHub Desktop.

Congratulations! You've set up some basic scripts that allow you to deploy your website's code to the Vercel hosting platform.

Haven't installed anything yet? See the SETUP.md file here for instructions.

You should see three new .command files in your folder. You can click on these to perform actions:

  • preview-local.command: View your local changes in the browser. You can visit http://localhost:3000 in your browser. This command will continue to run in the terminal that opens. To exit, press Control+C, or close the Terminal pane. (You will see some warnings about a process still running - it is OK to close)
  • deploy.command: Deploy your current changes to production - i.e. the "live" site. This will be visible at https://<your-project-name>.vercel.app. To deploy these changes to your own domain, follow these instructions.
  • deploy-preview.command: Deploy your current changes to a preview URL. After the command runs, it will display a link to the deployment, https://<your-project-name>-<your-account-name>.vercel.app.
  • note: The first time you open deploy.command or deploy-preview.command, your terminal will prompt you to log into your Vercel account. Follow the instructions there. If you log in by entering your username and password, you won't see anything like *** while entering your password. Type it anyway, then press enter.
#!/bin/bash
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)";
brew update;
brew doctor;
export PATH="/usr/local/bin:$PATH";
brew install node;

A few scripts to run to make Vercel deploys friendly to non-cli users. on OS X.

First, set up an account at vercel.com

If you do not have node installed, run:

curl <link to raw install-node.sh> | bash

Then, cd into the directory where you will be working on your website. If you are not familiar with the command line:

  1. Open Terminal from your Applications folder
  2. Type cd (with a space after cd) - do not press enter, yet
  3. Drag your website's folder into the terminal - it should append something like /Users/me/some/directory to what you have typed
  4. Press enter

Finally:

curl <link to raw vercel-clickable-deploys.sh> | bash

After running this command, you will see three new .command files in your folder. You can click on these to perform actions:

  • preview-local.command: View your local changes in the browser. You can visit http://localhost:3000 in your browser. This command will continue to run in the terminal that opens. To exit
  • deploy.command: Deploy your current changes to production - i.e. the "live" site. This will be visible at https://<your-project-name>.vercel.app. To deploy these changes to your own domain, follow these instructions
  • deploy-preview.command: Deploy your current changes to a preview. After the command runs, it will display a link to the deployment, https://<your-project-name>-<your-account-name>.vercel.app
#!/bin/bash
# Set up packages & directories
mkdir public;
echo "<body>hello :)</body>" > public/index.html;
npm init -y;
npm install --save-dev vercel;
npm install --save-dev serve;
# Add Readme
curl "https://gist.githubusercontent.com/good-idea/a398f2ab2e3d9dba265b6a0681936617/raw/813f2b9b3b898ad9d6aaa58fc2cc6ebb45eb5ace/README.md" > README.md
# Create clickable deploy scripts
CD_CURRENT='cd "$(dirname "$0")"'
(
echo "#!/bin/bash"
echo $CD_CURRENT
echo "npx vercel deploy --prod"
) > deploy.command;
(
echo "#!/bin/bash"
echo $CD_CURRENT
echo "npx vercel deploy"
) > deploy-preview.command;
(
echo "#!/bin/bash"
echo $CD_CURRENT
echo "npx serve public"
) > preview-local.command;
chmod +x *.command
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment