Switching from Google Web Toolkit (GWT) to AngularJS has probably been the greatest single productivity boost to My Gear Pack development. In other posts, I’ll extoll the virtues of using angularjs for development. However, the first task for me was to get it configured in our automated build system and deploying to an amazon S3 bucket. Below I’ve outlined what our configuration looks like.
The angularjs application is developed inside /app. Our project makes heavy use of grunt for automated tests, minification, and packaging of the final application.
The result of the grunt script ends up in /dist, so everything under /dist is deployed to S3 as the final application structure.
Build Environment Configuration (Ubuntu)
The build requires node.js package manager (npm), grunt, and s3cmd.
Don’t use the default nodejs that is included with ubuntu. It is outdated and will not have the same featureset as newer versions.
Install the latest node.js which includes npm.
sudo apt-get update sudo apt-get install -y python-software-properties python g++ make sudo add-apt-repository -y ppa:chris-lea/node.js sudo apt-get update sudo apt-get install nodejs
sudo npm install -g grunt-cli
Install s3cmd (instructions from s3tools.org):
wget -O- -q http://s3tools.org/repo/deb-all/stable/s3tools.key | sudo apt-key add - sudo wget -O/etc/apt/sources.list.d/s3tools.list http://s3tools.org/repo/deb-all/stable/s3tools.list sudo apt-get update && sudo apt-get install s3cmd
Configure s3cmd with your credentials
Execute this in your jenkins home directory as your jenkins user. It will prompt you for your s3 credentials.
Amazon Web Services S3 Configuration
In your Amazon Web Services S3 Console, configure your bucket for static web hosting. It’s in a section under properties.
Configure your job to have an Execute Shell build step, and use something like this for your shell script. This assumes that you want to distribute the contents of your /dist directory.
npm install grunt-cli npm install grunt s3cmd sync -r -P $WORKSPACE/dist/* s3://[YOUR_BUCKET_NAME]
Run your job and watch the results get synchronized with s3! Hooray!
Check out My Gear Pack, get organized, and start your adventure.