Auto deploy website from github to Google Storage or AWS S3 using Travis-CI

Its a redundant task to push static website to github and then upload it to Cloud (Google Storage or AWS S3). Lets reduce the redundancy and learn basics of Travis in the process.

Travis is a continuous integration platform. It is used for running automated unit tests and build scripts for every code push. It can also be used to deploy code into several platform like GCS, S3 and many more. Travis is free for open source projects.

We will just use the deployment feature for this tutorial. Lets begin.

Step 1: Import Github project to travis-ci.org
Login to www.travis-ci.org using your github account. Travis will ask you to import a repository. You can do it from your profile page or You may also click on + icon to import a repository.

Click on + icon to import a repository.

Now you have to add a configuration file to inform Travis how to build and where to deploy.

We will add those things in local machine and push the configuration files to github. Travis will automatically pick it up and do the rest.

Step 2: Install travis cli
Travis cli makes it easy to write travis configuration file .travis.yml.
You can find the repository here and installation details here.

Step 3: Create travis configuration file
Goto your project directory and run travis init from terminal. Put node as main programming language. This will create a .travis.yml file.

It will contain information that Travis will use node version 0.11 to run the test. You can now manually specify a test which which will always pass.

Here I have added a line node -v which displays the node version and returns.

Why node ? Travis does not directly allow deploying files. Its a continuous integration tool. It’s made for automated testing and building. Travis uses build script to check if application is compiling or building properly, if the scripts passes it deploys the application. So we will create a fake build script, which will always pass.

Commit this change and push it to github. Now goto https://travis-ci.org. You will notice that travis has already started running build script. It will install node and run the script which will pass. If it does not, check for error in build logs provided in the dashboard.

You are good to go, Lets write the deployment configuration.

Step 4: Update deployment information in .travis.yml
Run travis setup gcs or travis setup s3 from the project’s root directory.
You can get access key and secret for GCS from here. Just select the project and turn on interoperability. Now generate an access key and secret.
You can get access key and secret for S3 from IAM page. Just create a user with write access to s3 and generate an access key and secret.

Add the bucket name where you want all the files to be uploaded.
Don’t fill anything on Local project directory . It is only required when you want to upload only specific directory for example dist directory which is created after build script is run.

Select default option for other questions, or just keep pressing return. Deployment configuration is complete. It should look something like this.

You can commit and push the changes. Travis will automatically deploy it to cloud. There is just a small issue, those files will not be publicly accessible. A website must be publicly accessible ^_^
So we will update the script and add a line to make uploaded files publicly accessible acl: public-read. Here is the updated configuration file.

Step 5: Check travis-ci.org
Now commit the changes and push to github. Monitor travis dashboard for build logs. Once build passes it will be deployed to GCS or S3.

Cheers. Let me know if I missed something or if there is a better way to achieve it. Feedback is appreciated.