tag:blogger.com,1999:blog-63559802550069051162024-03-13T03:28:05.169-06:00Bodybuilding.com Tech BlogDarkKnighthttp://www.blogger.com/profile/06752740042810462237noreply@blogger.comBlogger11125tag:blogger.com,1999:blog-6355980255006905116.post-75957570774912434482016-09-02T10:36:00.000-06:002016-09-02T10:38:36.744-06:00Why do we need DevOps?<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both;">
<span style="font-family: Arial, Helvetica, sans-serif;">Engineering Manager, Eugene Dina, discusses dev-ops and how the company is leveraging it to streamline its process, and minimize its time to market.</span></div>
<div class="separator" style="clear: both;">
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div class="separator" style="clear: both;">
<span style="font-family: Arial, Helvetica, sans-serif;">By empowering its engineers at every step of the development and deployment pipeline, and utilizing automation, infrastructure as code, and automatic provisioning, teams are able to build and deploy software more efficiently, and with fewer defects.</span></div>
<div class="">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<iframe allowfullscreen="" class="YOUTUBE-iframe-video" data-thumbnail-src="https://i.ytimg.com/vi/wd8_jxYtetA/0.jpg" frameborder="0" height="266" src="https://www.youtube.com/embed/wd8_jxYtetA?feature=player_embedded" width="320"></iframe></div>
<br />Anonymousnoreply@blogger.com0tag:blogger.com,1999:blog-6355980255006905116.post-41754266919242890612016-06-08T09:00:00.000-06:002016-06-08T09:36:48.799-06:00Developer Interviews: Justin Podzimek<span style="clear: left; display: inline; float: left; font-family: "arial" , "helvetica" , sans-serif; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="https://3.bp.blogspot.com/-nAPjEBtNsg4/VfH-kW8NJiI/AAAAAAAAAEU/RK5VKHOwLBo/s1600/justin1.png" /></span><br />
<h3>
<b style="font-size: 14px;"><span style="font-family: "arial" , "helvetica" , sans-serif; font-size: small;"><br /></span></b></h3>
<h3>
<b style="font-size: 14px;"><span style="font-family: "arial" , "helvetica" , sans-serif; font-size: small;">What do you do and how long have you been at bbcom?</span></b></h3>
<div>
<blockquote class="tr_bq">
<span style="font-family: "arial" , "helvetica" , sans-serif;">I’m currently a Principal Software Engineer and have been working at <a class="" href="http://bodybuilding.com/">Bodybuilding.com</a> for about 8 years now. In addition to normal development, I’m responsible for helping my team of client-side engineers, software engineers, and QA in whatever project we’re currently working on. I also have a helping hand in guiding the technology we use at <a class="" href="http://bodybuilding.com/">Bodybuilding.com</a> along with the other technical leaders.</span></blockquote>
</div>
<div>
<br /></div>
<h3>
<b><span style="font-family: "arial" , "helvetica" , sans-serif; font-size: small;">Linux or Mac?</span></b></h3>
<div>
<blockquote class="tr_bq">
<span style="font-family: "arial" , "helvetica" , sans-serif;">Mac, but only slightly. There are some applications and utilities on my Mac that just aren’t there, or aren’t as good, on Linux. That being said, a good portion of my work is spent in the command line, so as long as it’s not Windows, I’m not super picky.</span></blockquote>
</div>
<h3>
<b><span style="font-family: "arial" , "helvetica" , sans-serif; font-size: small;">What is a typical day like for you?</span></b></h3>
<div>
<blockquote class="tr_bq">
<span style="font-family: "arial" , "helvetica" , sans-serif;">The mornings are fairly consistent, with a daily scrum to discuss what we’ve been working on and what’s coming up. After that, my day is spent in a combination of working with the other members of my team, meetings, and heads down with my headphones on getting some work done.</span></blockquote>
</div>
<h3>
<b><span style="font-family: "arial" , "helvetica" , sans-serif; font-size: small;">What is in your developer tool box? </span></b></h3>
<blockquote class="tr_bq">
<span style="font-family: "arial" , "helvetica" , sans-serif;">#1 - An IDE. Depending on what I’m working on, it’s either IntelliJ or Sublime Text.</span><span style="font-family: "arial" , "helvetica" , sans-serif;"> </span><span style="font-family: "arial" , "helvetica" , sans-serif;">#2 - Slack. Getting push notifications on my phone when someone needs me and I’m not online is a huge help. </span><span style="font-family: "arial" , "helvetica" , sans-serif;">#3 - Google Chrome as my preferred browser. </span><span style="font-family: "arial" , "helvetica" , sans-serif;">#4 - Spotify. Music is important to my development mojo. </span><span style="font-family: "arial" , "helvetica" , sans-serif;">#5 - Terminal.</span></blockquote>
<h3>
<b><span style="font-family: "arial" , "helvetica" , sans-serif; font-size: small;">What are your favorite pro tips?</span></b></h3>
<div>
<blockquote class="tr_bq">
<span style="font-family: "arial" , "helvetica" , sans-serif;">alias yolo=‘git commit -am “Deal with it” && git push -f origin master’</span></blockquote>
</div>
<div>
<blockquote class="tr_bq">
<span style="font-family: "arial" , "helvetica" , sans-serif;">Kidding. </span></blockquote>
</div>
<div>
<blockquote class="tr_bq">
<span style="font-family: "arial" , "helvetica" , sans-serif;">Honestly, the best tip I can give is "stay in the flow”. It’s tough to get back in once it’s broken, so do everything you can to minimize distractions.</span></blockquote>
</div>
<h3>
<b><span style="font-family: "arial" , "helvetica" , sans-serif;"><span style="font-size: small;">What did you code up today?</span><span style="font-size: 14px;"> </span></span></b></h3>
<div>
<blockquote class="tr_bq">
<span style="font-family: "arial" , "helvetica" , sans-serif;">We’re currently in the process of migrating upwards of 28,000 articles to a new CMS system living in Amazon Web Services (AWS). Today, I continued on with the migration script to download every image from an article and upload it to S3. In addition, tweaking and fine-tuning the process to make sure the cutover is as seamless as possible to our readers.</span></blockquote>
</div>
<h3>
<b><span style="font-family: "arial" , "helvetica" , sans-serif;"><span style="font-size: small;">What has been the most challenging problem you’ve had to solve? </span> </span></b></h3>
<div>
<blockquote class="tr_bq">
<span style="font-family: "arial" , "helvetica" , sans-serif;">Last year, we update the wrapper (header, footer, and sidebars) across our entire site. This was a HUGE project. Every technical team was involved in updating around 15 different Java and PHP applications, migrating our front-end code to use a new build system and AngularJS, site-wide feature enhancements like search and a new navigation, and countless other features. This was all completed in just a few months before the holidays. In all my years working at <a class="" href="http://bodybuilding.com/">Bodybuilding.com</a>, never have I seen collaboration between such a large group work as smoothly as it did.</span></blockquote>
</div>
<h3>
<b><span style="font-family: "arial" , "helvetica" , sans-serif; font-size: small;">Any crazy Bbcom stories?</span></b></h3>
<div>
<blockquote class="tr_bq">
<span style="font-family: "arial" , "helvetica" , sans-serif;">The only one that comes to mind is the “poo-nami”. I think that one should be left up to the imagination.</span></blockquote>
</div>
<h3>
<b><span style="font-family: "arial" , "helvetica" , sans-serif; font-size: small;">What is the best thing about working at Bbcom?</span></b></h3>
<div>
<blockquote class="tr_bq">
<span style="font-family: "arial" , "helvetica" , sans-serif;">You get to work on the coolest, most cutting edge products, with the coolest, most knowledge people around. There’s a lot to love about working at <a class="" href="http://bodybuilding.com/">Bodybuilding.com</a>.</span></blockquote>
</div>
Anonymousnoreply@blogger.com0tag:blogger.com,1999:blog-6355980255006905116.post-78745082728920039452016-05-19T14:14:00.000-06:002016-05-19T14:14:05.061-06:00Everything You Need to Know About Bower, Part 2<div style="-webkit-text-stroke-width: 0px; background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 20px; margin: 0px; orphans: auto; padding: 0px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 1; word-spacing: 0px;">
In<span class="Apple-converted-space"> </span><a href="http://techblog.bodybuilding.com/2015/11/everything-you-need-to-know-about-bower_30.html" style="color: #326ca6; text-decoration: none;">Part 1</a><span class="Apple-converted-space"> </span>of this two-part rant on Bower, I discussed many of the arguably non-intuitive quirks of SemVer as implemented by NPM and Bower. In Part 2, we round that out by sharing how we've dealt with those peculiarities and successfully collaborate using a private bower server.</div>
<h1 id="EverythingYouNeedtoKnowAboutBower,Part2-TechBlog-HowtoMakeitWork" style="-webkit-text-stroke-width: 0px; background-color: white; border-bottom-color: rgb(46, 61, 84); color: black; font-family: Arial, sans-serif; font-size: 24px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 1.25; margin: 30px 0px 0px; orphans: auto; padding: 0px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 1; word-spacing: 0px;">
How to Make it Work</h1>
<div style="-webkit-text-stroke-width: 0px; background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 20px; margin: 10px 0px 0px; orphans: auto; padding: 0px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 1; word-spacing: 0px;">
At Bodybuilding.com, different teams are often making distinct changes in the same code base, and we need to be able differentiate between their releases. Git branches are obviously going to keep the work separate, but in order to consume or deploy the changes, we need to pre-release the app to Bower, and then it's out there for anyone to consume. Here's where the whole "stable release" restriction and shorthands can cause trouble.</div>
<h2 id="EverythingYouNeedtoKnowAboutBower,Part2-TechBlog-WeNeedtoBeRestrictive" style="-webkit-text-stroke-width: 0px; background-color: white; border-bottom-color: rgb(46, 61, 84); color: black; font-family: Arial, sans-serif; font-size: 20px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 1.5; margin: 30px 0px 0px; orphans: auto; padding: 0px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 1; word-spacing: 0px;">
<span style="color: black;">We Need to Be Restrictive</span></h2>
<p style="-webkit-text-stroke-width: 0px; background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 20px; margin: 10px 0px 0px; orphans: auto; padding: 0px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 1; word-spacing: 0px;">
Third-party apps are generally fine to leave open-ended, using the <code style="font-family: monospace;">^</code> or <code style="font-family: monospace;">~</code><span class="Apple-converted-space"> </span>shorthands. More often than not, we want the latest bug fix. But as we're developing our own interdependent apps, we need to lock down the version request. It's verbose, but in most cases the only way to restrict the version to a set tuple, while allowing pre-releases within that tuple, while also rejecting any version outside of that tuple, is:</p>
<div style="-webkit-text-stroke-width: 0px; background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 20px; margin: 10px 0px 0px; orphans: auto; padding: 0px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 1; word-spacing: 0px;">
<code style="font-family: monospace;">>=x.y.z-0 <x.y.z+1<span class="Apple-converted-space"> </span></code>(where<code style="font-family: monospace;"><span class="Apple-converted-space"> </span>-0</code><span class="Apple-converted-space"> </span>is literal text and <code style="font-family: monospace;"></code><code style="font-family: monospace;"><span class="Apple-converted-space"></span>z+1</code><span class="Apple-converted-space"> </span>is one more than the number represented by<code style="font-family: monospace;"><span class="Apple-converted-space"> </span>z</code>)</div>
<div style="-webkit-text-stroke-width: 0px; background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 20px; margin: 10px 0px 0px; orphans: auto; padding: 0px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 1; word-spacing: 0px;">
Or, if using a pre-release tag:</div>
<div style="-webkit-text-stroke-width: 0px; background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 20px; margin: 10px 0px 0px; orphans: auto; padding: 0px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 1; word-spacing: 0px;">
<code style="font-family: monospace;">>=x.y.z-tag.0 <x.y.z-tag.100</code></div>
<div style="-webkit-text-stroke-width: 0px; background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 20px; margin: 10px 0px 0px; orphans: auto; padding: 0px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 1; word-spacing: 0px;">
<i>Ya gotta tell Bower what ya want.</i></div>
<div style="-webkit-text-stroke-width: 0px; background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 20px; margin: 10px 0px 0px; orphans: auto; padding: 0px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 1; word-spacing: 0px;">
For example, use<span class="Apple-converted-space"> </span><code style="font-family: monospace;">>=</code><code style="font-family: monospace;">1.2.3-0 <1.2.4</code>. Note that we need to explicitly use the<span class="Apple-converted-space"> </span><code style="font-family: monospace;">-0</code> part of the version; without it, Bower will only look for stable releases, and, in effect, we could have just said<span class="Apple-converted-space"> </span><code style="font-family: monospace;">=1.2.3</code>. With the<span class="Apple-converted-space"> </span><code style="font-family: monospace;">-0</code>, though, we gain several things:</div>
<ul style="-webkit-text-stroke-width: 0px; background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 20px; list-style-type: disc; margin: 10px 0px 0px; orphans: auto; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 1; word-spacing: 0px;">
<li>Bower will consider pre-releases acceptable, and pick up the latest<span class="Apple-converted-space"> </span><code style="font-family: monospace;">1.2.3-x</code> version.</li>
<li>Bower will refuse<span class="Apple-converted-space"> </span><code style="font-family: monospace;">1.2.4</code> and higher, pre-release or otherwise, ensuring that the team gets the version they're working on.</li>
<li>Bower will consider the<span class="Apple-converted-space"> </span><code style="font-family: monospace;">1.2.3</code> release valid for that range and prefer it over the pre-releases, meaning the app that is requesting the version doesn't necessarily need to update its<span class="Apple-converted-space"> </span><code style="font-family: monospace;">bower.json</code> in order to release. Ideally, at release time,<span class="Apple-converted-space"> </span><code style="font-family: monospace;">bower.json</code> specifies exact version numbers, but if a version was missed then this notation won't break the desired behavior.</li>
</ul>
<div style="-webkit-text-stroke-width: 0px; background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 20px; margin: 10px 0px 0px; orphans: auto; padding: 0px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 1; word-spacing: 0px;">
Similarly, if a different team uses<span class="Apple-converted-space"> </span><code style="font-family: monospace;">>=1.2.4-0 <1.2.5</code>, they will ensure that they don't accidentally pick up version<span class="Apple-converted-space"> </span><code style="font-family: monospace;">1.2.3</code> when it becomes an official release.</div>
<div style="-webkit-text-stroke-width: 0px; background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 20px; margin: 10px 0px 0px; orphans: auto; padding: 0px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 1; word-spacing: 0px;">
<img border="0" height="243" src="https://1.bp.blogspot.com/-TqQNXxrK0lY/Vz4TCC3A8BI/AAAAAAAAAA8/1OBNR53s8BAkq-imQTOTsNy7TfB4gSEqwCK4B/s320/holy-grail.png" width="320" /></div>
<h2 id="EverythingYouNeedtoKnowAboutBower,Part2-TechBlog-Examples" style="-webkit-text-stroke-width: 0px; background-color: white; border-bottom-color: rgb(46, 61, 84); color: black; font-family: Arial, sans-serif; font-size: 20px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 1.5; margin: 30px 0px 0px; orphans: auto; padding: 0px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 1; word-spacing: 0px;">
Examples</h2>
<p style="-webkit-text-stroke-width: 0px; background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 20px; margin: 10px 0px 0px; orphans: auto; padding: 0px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 1; word-spacing: 0px;">
Note that you can try these with your own private Bower registry. Create a new git repo, register it with your Bower server, and then iterate over changes to the readme file, while releasing the various tags. Then you can test with<span class="Apple-converted-space"> </span><code style="font-family: monospace;">bower info [your-bower-project]#[request version here]</code>. </p>
<div style="-webkit-text-stroke-width: 0px; background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 20px; margin: 10px 0px 0px; orphans: auto; padding: 0px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 1; word-spacing: 0px;">
Further note that you need to either escape the <code style="font-family: monospace;">></code>, <code style="font-family: monospace;"><</code>, and <code style="font-family: monospace;">space</code><span class="Apple-converted-space"> </span>characters – for example, <code style="font-family: monospace;">bower info test-semver#\>=1.0.0-0\ \<1.0.1</code><span class="Apple-converted-space"> </span>– or else wrap the whole<span class="Apple-converted-space"> </span><code style="font-family: monospace;">package#version</code> part in quotes, like <code style="font-family: monospace;">bower info "test-semver#>=1.0.0-0 <1.0.1"</code>. (For reference: how the command line uses<span class="Apple-converted-space"> </span><a class="external-link" href="https://en.wikipedia.org/wiki/Command-line_interface#The_space_character" rel="nofollow" style="color: #326ca6; text-decoration: none;">spaces</a><span class="Apple-converted-space"> </span>and<span class="Apple-converted-space"> </span><a class="external-link" href="http://linuxcommand.org/lc3_lts0070.php" rel="nofollow" style="color: #326ca6; text-decoration: none;">angle brackets</a>)</div>
<h3 id="EverythingYouNeedtoKnowAboutBower,Part2-TechBlog-ExamplesofFavoringStableReleases" style="-webkit-text-stroke-width: 0px; background-color: white; color: black; font-family: Arial, sans-serif; font-size: 16px; font-style: normal; font-variant: normal; letter-spacing: normal; line-height: 1.5; margin: 30px 0px 0px; orphans: auto; padding: 0px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 1; word-spacing: 0px;">
Examples of Favoring Stable Releases</h3>
<div style="-webkit-text-stroke-width: 0px; background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 20px; margin: 10px 0px 0px; orphans: auto; padding: 0px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 1; word-spacing: 0px;">
The examples below assume the following available versions:</div>
<ul class="ul1" style="-webkit-text-stroke-width: 0px; background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 20px; list-style-type: disc; margin: 10px 0px 0px; orphans: auto; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 1; word-spacing: 0px;">
<li class="li1"><span class="s2"><code style="font-family: monospace;">0.0.0</code></span></li>
<li class="li1"><span class="s2"><code style="font-family: monospace;">0.0.1</code></span></li>
<li class="li1"><span class="s2"><code style="font-family: monospace;">0.0.2-0</code></span></li>
<li class="li1"><span class="s2"><code style="font-family: monospace;">0.0.2-1</code></span></li>
<li class="li1"><span class="s2"><code style="font-family: monospace;">0.0.2-2</code></span></li>
<li class="li1"><span class="s2"><code style="font-family: monospace;">0.0.2</code></span></li>
<li class="li1"><span class="s2"><code style="font-family: monospace;">0.0.3-0</code></span></li>
<li class="li1"><span class="s2"><code style="font-family: monospace;">0.0.3-1</code></span></li>
<li class="li1"><span class="s2"><code style="font-family: monospace;">0.0.3</code></span></li>
<li class="li1"><span class="s2"><code style="font-family: monospace;">0.0.4-0</code></span></li>
<li class="li1"><span class="s2"><code style="font-family: monospace;">0.0.4-1</code></span></li>
<li class="li1"><span class="s2"><code style="font-family: monospace;">0.0.5-0</code></span></li>
<li class="li1"><span class="s2"><code style="font-family: monospace;">0.0.5-1</code></span></li>
</ul>
<div class="li1" style="-webkit-text-stroke-width: 0px; background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 20px; margin: 10px 0px 0px; orphans: auto; padding: 0px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 1; word-spacing: 0px;">
<br /></div>
<div class="table-wrap" style="-webkit-text-stroke-width: 0px; background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 20px; margin: 10px 0px 0px; orphans: auto; overflow-x: auto; padding: 0px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 1; word-spacing: 0px;">
<table class="confluenceTable tablesorter" style="border-collapse: collapse; color: #333333; margin: 0px; overflow-x: auto;"><thead>
<tr class="sortableHeader" style="color: #333333;"><th class="confluenceTh sortableHeader" data-column="0" style="background: 100% 50% no-repeat rgb(240, 240, 240); border: 1px solid rgb(221, 221, 221); color: black; cursor: pointer; font-weight: bold; padding: 7px 15px 7px 10px; text-align: left; vertical-align: top;"><div class="tablesorter-header-inner" style="color: black; margin: 0px; padding: 0px;">
Requested version</div>
</th><th class="confluenceTh sortableHeader" data-column="1" style="background: 100% 50% no-repeat rgb(240, 240, 240); border: 1px solid rgb(221, 221, 221); color: black; cursor: pointer; font-weight: bold; padding: 7px 15px 7px 10px; text-align: left; vertical-align: top;"><div class="tablesorter-header-inner" style="color: black; margin: 0px; padding: 0px;">
Resolved version</div>
</th><th class="confluenceTh sortableHeader" colspan="1" data-column="2" style="background: 100% 50% no-repeat rgb(240, 240, 240); border: 1px solid rgb(221, 221, 221); color: black; cursor: pointer; font-weight: bold; padding: 7px 15px 7px 10px; text-align: left; vertical-align: top;"><div class="tablesorter-header-inner" style="color: black; margin: 0px; padding: 0px;">
Notes</div>
</th></tr>
</thead><tbody>
<tr style="color: #333333;"><td class="confluenceTd" style="border: 1px solid rgb(221, 221, 221); color: #333333; padding: 7px 10px; text-align: left; vertical-align: top;"><code style="font-family: monospace;">^0.0.0</code><span class="Apple-converted-space"> </span>or <code style="font-family: monospace;">~0.0.0</code></td><td class="confluenceTd" style="border: 1px solid rgb(221, 221, 221); color: #333333; padding: 7px 10px; text-align: left; vertical-align: top;"><code style="font-family: monospace;">0.0.3</code></td><td class="confluenceTd" colspan="1" style="border: 1px solid rgb(221, 221, 221); color: #333333; padding: 7px 10px; text-align: left; vertical-align: top;">Bower assumes you want the latest stable release.<span class="Apple-converted-space"> </span><code style="font-family: monospace;">0.0.4</code><span class="Apple-converted-space"> </span>and<span class="Apple-converted-space"> </span><code style="font-family: monospace;">0.0.5</code><span class="Apple-converted-space"> </span>exist only in pre-release versions, so<span class="Apple-converted-space"> </span><code style="font-family: monospace;">0.0.3</code><span class="Apple-converted-space"> </span>is resolved.</td></tr>
<tr style="color: #333333;"><td class="confluenceTd" style="border: 1px solid rgb(221, 221, 221); color: #333333; padding: 7px 10px; text-align: left; vertical-align: top;"><pre style="margin: 0px; padding: 0px;">>0.0.3</pre>
</td><td class="confluenceTd" style="border: 1px solid rgb(221, 221, 221); color: #333333; padding: 7px 10px; text-align: left; vertical-align: top;"><code style="font-family: monospace;">0.0.5-1</code></td><td class="confluenceTd" colspan="1" style="border: 1px solid rgb(221, 221, 221); color: #333333; padding: 7px 10px; text-align: left; vertical-align: top;">Only pre-release versions are greater than<span class="Apple-converted-space"> </span><code style="font-family: monospace;">0.0.3</code><span class="Apple-converted-space"> </span>(because we aren't including<span class="Apple-converted-space"> </span><code style="font-family: monospace;">0.0.3</code><span class="Apple-converted-space"> </span>itself), so even though Bower would assume you want the latest stable version, there is no latest stable version in this case, and the latest pre-release is returned.</td></tr>
<tr style="color: #333333;"><td class="confluenceTd" style="border: 1px solid rgb(221, 221, 221); color: #333333; padding: 7px 10px; text-align: left; vertical-align: top;"><code style="font-family: monospace;">~0.0.4</code></td><td class="confluenceTd" style="border: 1px solid rgb(221, 221, 221); color: #333333; padding: 7px 10px; text-align: left; vertical-align: top;"><code style="font-family: monospace;">0.0.5-1</code></td><td class="confluenceTd" colspan="1" style="border: 1px solid rgb(221, 221, 221); color: #333333; padding: 7px 10px; text-align: left; vertical-align: top;">Essentially the same as the above example. We want the latest patch greater than or equal to<span class="Apple-converted-space"> </span><code style="font-family: monospace;">0.0.4</code>, and since there are no stable releases in that range, we get the latest pre-release.</td></tr>
<tr style="color: #333333;"><td class="confluenceTd" colspan="1" style="border: 1px solid rgb(221, 221, 221); color: #333333; padding: 7px 10px; text-align: left; vertical-align: top;"><code style="font-family: monospace;">0.0.5 or =0.0.5</code></td><td class="confluenceTd" colspan="1" style="border: 1px solid rgb(221, 221, 221); color: #333333; padding: 7px 10px; text-align: left; vertical-align: top;">none</td><td class="confluenceTd" colspan="1" style="border: 1px solid rgb(221, 221, 221); color: #333333; padding: 7px 10px; text-align: left; vertical-align: top;">Declaring a stable version with no range will not return any version if the stable version doesn't exist; Bower assumes you want the exact stable version requested and will not return the pre-release versions.</td></tr>
</tbody></table>
</div>
<h3 id="EverythingYouNeedtoKnowAboutBower,Part2-TechBlog-ExamplesofPre-releaseTags" style="-webkit-text-stroke-width: 0px; background-color: white; color: black; font-family: Arial, sans-serif; font-size: 16px; font-style: normal; font-variant: normal; letter-spacing: normal; line-height: 1.5; margin: 30px 0px 0px; orphans: auto; padding: 0px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 1; word-spacing: 0px;">
Examples of Pre-release Tags</h3>
<div style="-webkit-text-stroke-width: 0px; background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 20px; margin: 10px 0px 0px; orphans: auto; padding: 0px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 1; word-spacing: 0px;">
<img border="0" height="198" src="https://1.bp.blogspot.com/-LfsKtzRcpgo/Vz4TD2GVNeI/AAAAAAAAABE/Qx0gu5TGvRw0DYxJdFt1kMQ62Wo9NPvTgCK4B/s320/tag.png" width="320" /></div>
<div style="-webkit-text-stroke-width: 0px; background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 20px; margin: 10px 0px 0px; orphans: auto; padding: 0px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 1; word-spacing: 0px;">
<br /></div>
<div style="-webkit-text-stroke-width: 0px; background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 20px; margin: 10px 0px 0px; orphans: auto; padding: 0px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 1; word-spacing: 0px;">
The following examples assume the following available versions (released in order):</div>
<ul style="-webkit-text-stroke-width: 0px; background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 20px; list-style-type: disc; margin: 10px 0px 0px; orphans: auto; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 1; word-spacing: 0px;">
<li><code style="font-family: monospace;">1.0.0-alpha.0</code></li>
<li><code style="font-family: monospace;">1.0.0-alpha.1</code></li>
<li><code style="font-family: monospace;">1.0.0-beta.0</code></li>
<li><code style="font-family: monospace;">1.0.0-beta.1</code></li>
<li><code style="font-family: monospace;">1.0.1-foo.0</code></li>
<li><code style="font-family: monospace;">1.0.1-foo.1</code></li>
<li><code style="font-family: monospace;">1.0.1-bar.0</code></li>
<li><code style="font-family: monospace;">1.0.1-bar.1</code></li>
<li><code style="font-family: monospace;">1.0.1-z.0</code></li>
<li><code style="font-family: monospace;">1.0.1-z.1</code></li>
<li><code style="font-family: monospace;">1.0.1-a.0</code></li>
<li><span style="line-height: 1.42857;"><code style="font-family: monospace;">1.0.1-a.1</code></span><span style="line-height: 1.42857;"><br /></span></li>
</ul>
<div style="-webkit-text-stroke-width: 0px; background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 20px; margin: 10px 0px 0px; orphans: auto; padding: 0px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 1; word-spacing: 0px;">
<span style="line-height: 1.42857;"><br /></span></div>
<div class="table-wrap" style="-webkit-text-stroke-width: 0px; background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 20px; margin: 10px 0px 0px; orphans: auto; overflow-x: auto; padding: 0px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 1; word-spacing: 0px;">
<table class="confluenceTable tablesorter" style="border-collapse: collapse; color: #333333; margin: 0px; overflow-x: auto;"><thead>
<tr class="sortableHeader" style="color: #333333;"><th class="confluenceTh sortableHeader" data-column="0" style="background: 100% 50% no-repeat rgb(240, 240, 240); border: 1px solid rgb(221, 221, 221); color: black; cursor: pointer; font-weight: bold; padding: 7px 15px 7px 10px; text-align: left; vertical-align: top;"><div class="tablesorter-header-inner" style="color: black; margin: 0px; padding: 0px;">
Requested version</div>
</th><th class="confluenceTh sortableHeader" data-column="1" style="background: 100% 50% no-repeat rgb(240, 240, 240); border: 1px solid rgb(221, 221, 221); color: black; cursor: pointer; font-weight: bold; padding: 7px 15px 7px 10px; text-align: left; vertical-align: top;"><div class="tablesorter-header-inner" style="color: black; margin: 0px; padding: 0px;">
Resolved version</div>
</th><th class="confluenceTh sortableHeader" data-column="2" style="background: 100% 50% no-repeat rgb(240, 240, 240); border: 1px solid rgb(221, 221, 221); color: black; cursor: pointer; font-weight: bold; padding: 7px 15px 7px 10px; text-align: left; vertical-align: top;"><div class="tablesorter-header-inner" style="color: black; margin: 0px; padding: 0px;">
Notes</div>
</th></tr>
</thead><tbody>
<tr style="color: #333333;"><td class="confluenceTd" style="border: 1px solid rgb(221, 221, 221); color: #333333; padding: 7px 10px; text-align: left; vertical-align: top;"><code style="font-family: monospace;">>=1.0.0-alpha.0</code></td><td class="confluenceTd" style="border: 1px solid rgb(221, 221, 221); color: #333333; padding: 7px 10px; text-align: left; vertical-align: top;"><code style="font-family: monospace;">1.0.1-z.1</code></td><td class="confluenceTd" style="border: 1px solid rgb(221, 221, 221); color: #333333; padding: 7px 10px; text-align: left; vertical-align: top;"><div style="background-color: transparent; color: #333333; margin: 0px; padding: 0px;">
Apparently, Bower considers anything with a pre-release tag as simply a marker to get a pre-release. It considers the "latest" to be the highest in an alphabetically sorted list of tags. Therefore, pre-release<span class="Apple-converted-space"> </span><code style="font-family: monospace;">z</code><span class="Apple-converted-space"> </span>is chosen.</div>
</td></tr>
<tr style="color: #333333;"><td class="confluenceTd" colspan="1" style="border: 1px solid rgb(221, 221, 221); color: #333333; padding: 7px 10px; text-align: left; vertical-align: top;"><code style="font-family: monospace;">>=1.0.0-alpha.0 <1.0.1</code></td><td class="confluenceTd" colspan="1" style="border: 1px solid rgb(221, 221, 221); color: #333333; padding: 7px 10px; text-align: left; vertical-align: top;"><code style="font-family: monospace;">1.0.0-beta.1</code></td><td class="confluenceTd" colspan="1" style="border: 1px solid rgb(221, 221, 221); color: #333333; padding: 7px 10px; text-align: left; vertical-align: top;">The range really only limits the numeric triad to<span class="Apple-converted-space"> </span><code style="font-family: monospace;">1.0.0</code>, so we filter out all of the<span class="Apple-converted-space"> </span><code style="font-family: monospace;">1.0.1</code>s. But the "latest" version is the highest alphabetically, so<span class="Apple-converted-space"> </span><code style="font-family: monospace;">beta</code><span class="Apple-converted-space"> </span>is returned.</td></tr>
<tr style="color: #333333;"><td class="confluenceTd" style="border: 1px solid rgb(221, 221, 221); color: #333333; padding: 7px 10px; text-align: left; vertical-align: top;"><code style="font-family: monospace;">>=1.0.0-made-up-stuff</code></td><td class="confluenceTd" style="border: 1px solid rgb(221, 221, 221); color: #333333; padding: 7px 10px; text-align: left; vertical-align: top;"><code style="font-family: monospace;">1.0.1-z.1</code></td><td class="confluenceTd" style="border: 1px solid rgb(221, 221, 221); color: #333333; padding: 7px 10px; text-align: left; vertical-align: top;">Note that the pre-release tag doesn't even exist, and moreover there is no "dot number." Bower sees no foul in this. It muses, "Ah, you want a pre-release. Here's the latest pre-release!"</td></tr>
<tr style="color: #333333;"><td class="confluenceTd" style="border: 1px solid rgb(221, 221, 221); color: #333333; padding: 7px 10px; text-align: left; vertical-align: top;"><code style="font-family: monospace;">>=1.0.0-alpha.0 <1.0.0-alpha.100</code></td><td class="confluenceTd" style="border: 1px solid rgb(221, 221, 221); color: #333333; padding: 7px 10px; text-align: left; vertical-align: top;"><code style="font-family: monospace;">1.0.0-alpha.1</code></td><td class="confluenceTd" style="border: 1px solid rgb(221, 221, 221); color: #333333; padding: 7px 10px; text-align: left; vertical-align: top;">This actually works! Cumbersome as heck, but it does enable separation of pre-release tags.</td></tr>
</tbody></table>
</div>
<h2 id="EverythingYouNeedtoKnowAboutBower,Part2-TechBlog-TheEnd(v1.0.0-a.1)" style="-webkit-text-stroke-width: 0px; background-color: white; border-bottom-color: rgb(46, 61, 84); color: black; font-family: Arial, sans-serif; font-size: 20px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 1.5; margin: 30px 0px 0px; orphans: auto; padding: 0px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 1; word-spacing: 0px;">
The End (v1.0.0-a.1)</h2>
<p style="-webkit-text-stroke-width: 0px; background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 20px; margin: 10px 0px 0px; orphans: auto; padding: 0px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 1; word-spacing: 0px;">
Hopefully this guide to how Bower handles SemVers reduces your aches and pains. If you'd like to read more, check out the section below.</p>
<h1 id="EverythingYouNeedtoKnowAboutBower,Part2-TechBlog-ReferencesandFurtherReading" style="-webkit-text-stroke-width: 0px; background-color: white; border-bottom-color: rgb(46, 61, 84); color: black; font-family: Arial, sans-serif; font-size: 24px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 1.25; margin: 30px 0px 0px; orphans: auto; padding: 0px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 1; word-spacing: 0px;">
References and Further Reading</h1>
<div style="-webkit-text-stroke-width: 0px; background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 20px; margin: 10px 0px 0px; orphans: auto; padding: 0px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 1; word-spacing: 0px;">
Official SemVer spec: <a class="external-link" href="http://semver.org/" rel="nofollow" style="color: #326ca6; text-decoration: none;">http://semver.org/</a></div>
<div style="-webkit-text-stroke-width: 0px; background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 20px; margin: 10px 0px 0px; orphans: auto; padding: 0px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 1; word-spacing: 0px;">
Official node-semver spec: <a class="external-link" href="https://github.com/npm/node-semver#versions" rel="nofollow" style="color: #326ca6; text-decoration: none;">https://github.com/npm/node-semver#versions</a></div>
<div style="-webkit-text-stroke-width: 0px; background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 20px; margin: 10px 0px 0px; orphans: auto; padding: 0px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 1; word-spacing: 0px;">
A decent introduction to SemVer ranges: <a class="external-link" href="http://developer.telerik.com/featured/mystical-magical-semver-ranges-used-npm-bower/" rel="nofollow" style="color: #326ca6; text-decoration: none;">http://developer.telerik.com/featured/mystical-magical-semver-ranges-used-npm-bower/</a></div>
<div style="-webkit-text-stroke-width: 0px; background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 20px; margin: 10px 0px 0px; orphans: auto; padding: 0px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 1; word-spacing: 0px;">
A short and easy-to-read attempt at making the SemVer spec more approachable: <a class="external-link" href="https://github.com/dominictarr/semver-ftw" rel="nofollow" style="color: #326ca6; text-decoration: none;">https://github.com/dominictarr/semver-ftw</a></div>
<div style="clear: both;">
</div>
Anonymousnoreply@blogger.com0tag:blogger.com,1999:blog-6355980255006905116.post-35855036375774896802016-02-24T14:29:00.000-07:002016-02-24T14:29:01.953-07:00Building an Upload Microservice using AWS Lambda<div class="p1">
<span class="s1">One of Bodybuilding.com’s core missions is to help people transform their lives through the adoption of a healthy lifestyle and exercise. One way we motivate people to begin such a journey is through our yearly “<span class="s2"><a href="http://www.bodybuilding.com/fun/transformation-challenge.html">transformation challenge</a>.</span>” Over the course of 12 weeks, participants in the challenge are encouraged to </span><span class="s3">adopt a training plan and set new habits that will lead to a fitter, healthier body. Prizes are awarded to the people who make the most profound transformation over the course of the contest. </span></div>
<div class="p2">
<span class="s1"></span><br /></div>
<div class="p3">
<span class="s1">In order to participate, contestants are required to upload photos of themselves before and after the challenge. As one might imagine, the time period shortly before and shortly after each challenge tends to produce a spike in photo-upload traffic to our servers. Historically, these periods have been problematic for the scalability of our backend systems. In order to improve our end-user experience (not to mention our own), we decided to re-architect our photo-upload system in late 2015.</span><br />
<span class="s1"><br /></span>
<span class="s1">This tech talk describes how we created a new microservice-based architecture using Amazon Web Services technologies as well as a Java/Spring stack. Our goal was to greatly improve our ability to handle spikes in image-upload traffic without manual intervention. As a result, we created autoscaling RESTful services using <a href="http://projects.spring.io/spring-boot/"><span class="s2">Spring Boot</span></a> and <a href="https://aws.amazon.com/elasticbeanstalk/"><span class="s2">AWS Elastic Beanstalk</span></a>. Image-processing logic has been encapsulated into highly scalable <a href="https://aws.amazon.com/lambda/"><span class="s2">Amazon Lambda</span></a> functions.</span></div>
<div class="p2">
<br />
<span class="s1"></span></div>
<div class="p3">
<span class="s1">We recently launched the 2016 transformation challenge. With our new image-upload infrastructure in place, we have been able to handle peak loads without a hitch.</span></div>
<div class="p3">
<br />
<div class="separator" style="clear: both; text-align: center;">
<iframe allowfullscreen="" class="YOUTUBE-iframe-video" data-thumbnail-src="https://i.ytimg.com/vi/z2gIw4O6pt8/0.jpg" frameborder="0" height="400" src="https://www.youtube.com/embed/z2gIw4O6pt8?feature=player_embedded" width="550"></iframe></div>
<br /></div>
Anonymousnoreply@blogger.com0tag:blogger.com,1999:blog-6355980255006905116.post-76606326036314070602016-01-27T13:09:00.000-07:002016-01-27T13:09:40.524-07:00Video: What is RESTful? (2.0.0)Roughly two years ago, the Bodybuilding.com Commerce Engineering Team set out to deliver native mobile phone applications for iOS and Android that offered the same rich user experience that hundreds of thousands of customers enjoy within our web applications each day. We started with a couple of UI/UX mockups, a firm knowledge that we needed to develop an API, and a strong desire to make that API RESTful. A large, dedicated team spent 18 months of their lives learning and growing to achieve a soft launch of the applications in May of 2015 in the Google <a href="https://play.google.com/store/apps/details?id=com.bodybuilding.store&hl=en">Play Store</a> and <a href="https://itunes.apple.com/us/app/bodybuilding.com-supplement/id981971812?mt=8">iTunes</a>. We believe a project of such magnitude must, beyond its primary goals, create useful and reusable assets to be considered a success. By that definition, this project was a huge success. We have a few libraries we plan to open source, a bunch of best practices to document and present, and a ton of knowledge and opinions to share with the development community.<br />
<br />
Other than the applications themselves, the most valuable assets developed during the project have been our opinions on what defines a RESTful architecture. Even months into the project, we found ourselves in long debates that led to redefining our views of RESTful architecture. Each of these cycles triggered new breakthroughs and pitfalls in our implementation. Even now, months after the launch, we still find ourselves re-evaluating past decisions and making significant changes in our implementation to align with the newest visions. The pieces of that newest vision were collected together into a presentation named "What Is RESTful?" that was used multiple times internally to achieve a common base understanding from which the more interesting conversations around implementation grew. Even this presentation has gone under multiple revisions and has recently achieved the <a href="http://semver.org/">SemVer</a> status of 2.0.0. <a href="https://prezi.com/ryygci1bdlii/what-is-restful-200/">This 2.0.0 version</a> was recently presented at the <a href="http://www.bodybuilding.com/fun/fall-2015-boise-tech-talk.html">Bodybuilding.com Fall 2015 Tech Talk</a> and is now available for online viewing. We expect to use this presentation in future posts and presentations as a launching point to dive deep into the finer aspects of our implementation and the software technology that grew from our vision. It is certain that we have not gotten everything right, and we encourage feedback, both constructive and critical, in order to develop the 3.0.0 version of this vision.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<iframe allowfullscreen="" class="YOUTUBE-iframe-video" data-thumbnail-src="https://i.ytimg.com/vi/u_pZBBELeEQ/0.jpg" frameborder="0" height="315" src="https://www.youtube.com/embed/u_pZBBELeEQ?feature=player_embedded" width="560"></iframe></div>
<br />
<div>
<br /></div>
Anonymousnoreply@blogger.com0tag:blogger.com,1999:blog-6355980255006905116.post-68640472049357445612015-12-16T14:49:00.000-07:002016-01-21T14:22:30.758-07:00Introducing Argos Dashboard<div style="color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 16px;">
<div style="font-family: Arial, sans-serif;">
If you've seen our previous posts or <a href="http://techblog.bodybuilding.com/2015/09/improving-fault-and-latency-tolerance.html">tech talks</a><span id="goog_1902153930"></span><span id="goog_1902153931"></span><a href="https://www.blogger.com/"></a>, you know that we are huge fans of Hystrix, the resiliency library by Netflix. The Hystrix dashboard has been great for monitoring a single application or service, but as the number of applications and microservices increased, we found ourselves needing a more holistic view of our infrastructure. We currently trend all our Hystrix metrics into <a href="http://graphite.wikidot.com/">Graphite</a> for correlation and forecasting, but we really needed something concise and real-time. Inspired by the usefulness of the Hystrix dashboard, we have created <a data-mce-href="http://www.github.com/bbcom/argos-dashboard" href="http://www.github.com/bbcom/argos-dashboard" style="color: rgb(59, 115, 175) !important; text-decoration: none;">Argos Dashboard</a>.</div>
<div style="font-family: Arial, sans-serif;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="http://1.bp.blogspot.com/-0pGZGbWIT4A/VnGxxb9mO8I/AAAAAAAAAAg/vyCBX12KBQU/s1600/argos-dashboard.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="190" src="http://1.bp.blogspot.com/-0pGZGbWIT4A/VnGxxb9mO8I/AAAAAAAAAAg/vyCBX12KBQU/s400/argos-dashboard.png" width="400" /></a></div>
<div style="font-family: Arial, sans-serif;">
<br /></div>
<div style="font-family: Arial, sans-serif; margin-top: 10px;">
</div>
<div style="font-family: Arial, sans-serif; margin-top: 10px;">
Argos Dashboard provides a real-time view of multiple Hystrix clusters by aggregating data for each cluster onto a single dashboard. The new dashboard has been extremely useful for monitoring how requests flow through the dependencies of each application. It also helps easily monitor what happens when we do performance and resiliency testing. Today, we are releasing Argos Dashboard on GitHub at <a data-mce-href="http://www.github.com/bbcom/argos-dashboard" href="http://www.github.com/bbcom/argos-dashboard" style="color: rgb(59, 115, 175) !important; text-decoration: none;">http://www.github.com/bbcom/argos-dashboard</a>. We hope you find Argos Dashboard valuable and look forward to feedback and pull requests.</div>
</div>
Anonymousnoreply@blogger.com0tag:blogger.com,1999:blog-6355980255006905116.post-71528242779988818642015-11-30T14:46:00.000-07:002015-11-30T14:46:10.404-07:00Everything You Need to Know About Bower, Part 1<div style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; padding: 0px;">
Here at <a class="external-link" href="http://bodybuilding.com/" rel="nofollow" style="color: #326ca6; line-height: 1.42857; text-decoration: none;">Bodybuilding.com</a>, we decided to migrate to a private <span style="color: #003366;"><a class="external-link" href="http://bower.io/" rel="nofollow" style="color: #326ca6; text-decoration: none;">Bower</a></span> registry to use as our artifact repository. There were numerous growing pains, and we’re hopeful that if we share them with others, maybe they can be spared some groans.</div>
<div style="background-color: white; border-bottom-color: rgb(46, 61, 84); font-family: Arial, sans-serif; font-size: 24px; font-weight: normal; line-height: 1.25; margin: 30px 0px 0px; padding: 0px;">
Semantic Versioning (SemVer)</div>
<div style="background-color: white; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin-top: 10px; padding: 0px;">
<span style="color: #333333;">Before we can dive in, first we need to visit the idea of <a href="http://semver.org/" rel="nofollow" target="_blank">semantic versioning</a></span><span style="color: #333333;">. The gist of SemVer is this: a version number consists of a triad of numbers, for example: </span><code style="color: #333333;">1.2.3</code><span style="color: #333333;">. The individual numbers are referred to, from left to right, as </span><strong style="color: #333333;">Major</strong><span style="color: #333333;">, </span><strong style="color: #333333;">Minor</strong><span style="color: #333333;">, and </span><strong style="color: #333333;">Patch</strong><span style="color: #333333;">. As your project develops, you should adjust different sections of the version number depending on how significant the change was between this release and the previous one:</span></div>
<ul style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin: 10px 0px 0px;">
<li>Increment the <strong>Major</strong> when releasing a feature that breaks the API and is not backwards-compatible.</li>
<li>Increment the <strong>Minor</strong> when releasing a feature that doesn't break the API.</li>
<li>Increment the <strong>Patch</strong> when releasing a bug fix (or a dozen).</li>
</ul>
<div style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin-top: 10px; padding: 0px;">
</div>
<div style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin-top: 10px; padding: 0px;">
And that's more or less semantic versioning. (By the way, did you notice that the SemVer spec is actually versioned using SemVer? How meta!)</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="http://4.bp.blogspot.com/-BWtPSNoxmXk/VlyaHtBxMiI/AAAAAAAAABQ/9Q9elXEs-KA/s1600/bower-part-1_semver.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Major.Minor.Patch" border="0" src="http://4.bp.blogspot.com/-BWtPSNoxmXk/VlyaHtBxMiI/AAAAAAAAABQ/9Q9elXEs-KA/s1600/bower-part-1_semver.png" title="Major.Minor.Patch" /></a></div>
<div style="background-color: white; border-bottom-color: rgb(46, 61, 84); font-family: Arial, sans-serif; font-size: 20px; font-weight: normal; line-height: 1.5; margin: 30px 0px 0px; padding: 0px;">
The Subtle Nuances of Node's and Bower's SemVer</div>
<div style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin-top: 10px; padding: 0px;">
But when used with npm and Bower, SemVer is more complicated than that. There are several pitfalls in the many exceptions, shorthands, and minutiae of the way <a href="https://github.com/npm/node-semver" rel="" target="_blank">node-semver</a> handles ranges.</div>
<div style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin-top: 10px; padding: 0px;">
This information is technically available in the version section of the <a href="https://github.com/npm/node-semver#versions" rel="" target="_blank">node-semver README</a>. Go ahead, read that document; we dare you. I'll wait...</div>
<div style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin-top: 10px; padding: 0px;">
Ah. Back already? Right, because that documentation reads like, well, <a href="http://git-man-page-generator.lokaltog.net/" rel="nofollow" target="_blank">Git documentation</a>. It's obtuse and assumes you're a lawyer.</div>
<div style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin-top: 10px; padding: 0px;">
It's simple enough to say, "This bug fix is a patch release, therefore my new version is x.y.z+1." But when you need to say, "My software depends on library X and library Y, and specifically these versions," Bower can accommodate, by expanding the SemVer spec with some extra syntax.</div>
<div style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin-top: 10px; padding: 0px;">
You can use <code>>,</code> <code>>=</code>, <code><</code>, <code><=</code>, and <code>^</code> and <code>~</code> to ask for the latest within a range of versions. For example, <code>>=1.2.3</code> will resolve to the latest version, as long as it's at least <code>1.2.3</code>, but under <code>2.0.0</code>. <code>>=1.2.3 <1.3.0</code> will resolve to any <code>1.2.x</code> version, as long as <code>x</code> is at least <code>3</code>. <code>^</code> is shorthand for the first example (<code>^1.2.3</code> will get any <code>1</code> release greater than or equal to <code>1.2.3</code>) and <code>~</code> is shorthand for the second example (<code>~1.2.3</code> will get <code>1.2.3</code>, <code>1.2.4</code>, etc, but not <code>1.3.0</code>). Don't worry about writing this down; there will be an examples section in part two.</div>
<div style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin-top: 10px; padding: 0px;">
At this point, let's cover some of the wrong assumptions you might be making about Bower.</div>
<h3 id="EverythingYouNeedtoKnowAboutBower,Part1-TechBlog-BowerisJustGit" style="background-color: white; font-family: Arial, sans-serif; font-size: 16px; line-height: 1.5; margin: 30px 0px 0px; padding: 0px;">
Bower is Just Git</h3>
<div style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin-top: 10px; padding: 0px;">
It's helpful to know that Bower is really just a layer between you and <a href="https://git-scm.com/" target="_blank">Git</a> tags. Bower "knows" about releases by scanning Git tags for SemVer-like tag names. When you register a Bower project, you have to give it a name and a Git endpoint–and that's it. Bower then treats Git tags that look like SemVers as released versions, takes care of resolving the request for you, and performs Git actions on your behalf.</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="http://4.bp.blogspot.com/-50riEdcveG0/VlyyQWwdAmI/AAAAAAAAABk/quHlusSCqhQ/s1600/bower-part-1_bower-is-git.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="81" src="http://4.bp.blogspot.com/-50riEdcveG0/VlyyQWwdAmI/AAAAAAAAABk/quHlusSCqhQ/s400/bower-part-1_bower-is-git.png" width="400" /></a></div>
<div style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin-top: 10px; padding: 0px;">
</div>
<div style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin-top: 10px; padding: 0px;">
Where this bit us is that Bower is set up to periodically scan Git repos for tags. It caches the Git tag list, which is reasonable, but when we're working with our own libraries and apps, it can be tedious to wait up to 10 minutes for a fresh version to show up in Bower. We have since reduced this refresh rate to 1 minute, but it's still possible to be moving fast, catch Bower at the very beginning of that refresh cycle, and try to install your new lib/app but not have it show up because Bower doesn't know about it yet.</div>
<div style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin-top: 10px; padding: 0px;">
To actually do this with your private Bower server, edit the config file property <code>repositoryCache.git.refreshTimeout</code> from the default of 10 to something more reasonable. </div>
<div style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin-top: 10px; padding: 0px;">
To see if a version is available yet, perform a <code>bower info</code> command. Simply feed it the name of the project (such as <code>bower info project-name</code>), and, optionally, a version request (such as <code>bower info project-name#>=1.2.3</code>). Without the version request it will return a full list of available versions, and with the version request you'll see which version it resolves to, which will hopefully be your freshly-released version.</div>
<h4 id="EverythingYouNeedtoKnowAboutBower,Part1-TechBlog-RandomBower-relatedGitTip" style="background-color: white; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin: 20px 0px 0px; padding: 0px;">
Random Bower-related Git Tip</h4>
<div style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin-top: 10px; padding: 0px;">
Say you're curious which branch was used to release a given version of an app – we typically work in descriptive branch names that may not indicate the version number. You can find a branch related to a tag with the following:</div>
<div style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin-top: 10px; padding: 0px;">
<code>git branch -r --contains 1.2.3</code></div>
<h3 id="EverythingYouNeedtoKnowAboutBower,Part1-TechBlog-BowerPrefersStableVersions" style="background-color: white; font-family: Arial, sans-serif; font-size: 16px; line-height: 1.5; margin: 30px 0px 0px; padding: 0px;">
Bower Prefers Stable Versions</h3>
<div style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin-top: 10px; padding: 0px;">
This should be tattooed on your forehead, and you should have a mirror at all times so you don't forget it. Or at least, it should be added to the <a href="http://bower.io/">bower.io</a> masthead.</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="http://3.bp.blogspot.com/-d2BZVu4ztMk/VlyyuuDp-4I/AAAAAAAAABs/Dlq3ZC9jg0U/s1600/bower-part-1_bower-masthead.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="128" src="http://3.bp.blogspot.com/-d2BZVu4ztMk/VlyyuuDp-4I/AAAAAAAAABs/Dlq3ZC9jg0U/s400/bower-part-1_bower-masthead.png" width="400" /></a></div>
<div style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin-top: 10px; padding: 0px;">
When we say that it "prefers stable versions," let's explain by way of example. Let's suppose we have these two versions available:</div>
<ul style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin: 10px 0px 0px;">
<li><code>1.2.3</code></li>
<li><code>1.2.4-0</code> (a pre-release version)</li>
</ul>
<div style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin-top: 10px; padding: 0px;">
And then let's suppose we specify that we want <code>~1.2.3</code> of this library. It's reasonable to think that the resolved version would be <code>1.2.4-0</code>, because it's the latest release and the version is less than <code>1.3.0</code>, so it fits the description. However, it actually resolves to <code>1.2.3</code>–because it prefers stable versions. It doesn't matter if a newer, fresher pre-release is available; if a stable version matches the request, Bower declares that you roll with that.</div>
<div style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin-top: 10px; padding: 0px;">
But what if there are no stable versions that match? Then, Bower sighs heavily and looks at you with an exasperated "if that's what you really want" kind of look and gives you the latest pre-release. For example, <code>~1.2.4</code> would resolve to <code>1.2.4-0</code>.</div>
<div style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin-top: 10px; padding: 0px;">
Just to follow this logic through, if <code>1.2.4</code> was properly released, and <code>1.2.5-0</code> was begun, then:</div>
<ul style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin: 10px 0px 0px;">
<li><code>~1.2.3</code> resolves to <code>1.2.4</code>, because it's the latest stable release</li>
<li><code>~1.2.4</code> resolves to<strong> </strong><code>1.2.4</code>, because it's the latest stable release</li>
<li><code>~1.2.5</code> resolves to <code>1.2.5-0</code>, because there is no stable release that qualifies, and that's the latest pre-release.</li>
</ul>
<h3 id="EverythingYouNeedtoKnowAboutBower,Part1-TechBlog-MajorVersion0isSpecial" style="background-color: white; font-family: Arial, sans-serif; font-size: 16px; line-height: 1.5; margin: 30px 0px 0px; padding: 0px;">
Major Version 0 is Special</h3>
<div style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin-top: 10px; padding: 0px;">
Bower treats <span style="font-family: monospace;">v0.y.z</span> as initial development, which means that the public API should not be considered stable. This actually has ramifications when using the caret as a range identifier (see below).</div>
<h3 id="EverythingYouNeedtoKnowAboutBower,Part1-TechBlog-YouDon'tNeedtoSpecifyaFullTriadinBower" style="background-color: white; font-family: Arial, sans-serif; font-size: 16px; line-height: 1.5; margin: 30px 0px 0px; padding: 0px;">
You Don't Need to Specify a Full Triad in Bower</h3>
<div style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin-top: 10px; padding: 0px;">
You can specify a version as simply <code>1</code> or <code>1.2</code>. Specifying a single digit is, in effect, specifying the major version, and saying, "I care not what minor and patch version I get, just get me the latest." In other words, <code>1 == ^1.0.0.</code> Using just two digits, such as <code>1.2</code>, will, as you might expect, be the same as <code>~1.2.0</code>. This in itself isn't terrible, but it leads to the following...</div>
<h3 id="EverythingYouNeedtoKnowAboutBower,Part1-TechBlog-^BehavesDifferentlyDependingonUnexpectedThings" style="background-color: white; font-family: Arial, sans-serif; font-size: 16px; line-height: 1.5; margin: 30px 0px 0px; padding: 0px;">
^ Behaves Differently Depending on Unexpected Things</h3>
<div style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin-top: 10px; padding: 0px;">
We initially explained the caret as a range that is greater than or equal to the specified version, including patch and minor updates but not major updates. There is a dramatic "but" here–the official <code>node-semver</code> definition of the caret is that it allows changes that do not modify the leftmost <strong>nonzero</strong> digit. So if you specified <code>^0.0.3</code>, <code>3</code> is the leftmost nonzero digit, and that's not allowed to be modified when using the caret, so you've basically locked this down to <code>0.0.3</code>. And <code>^0.2.3</code> is basically the same as <code>~0.2.3</code>.</div>
<h3 id="EverythingYouNeedtoKnowAboutBower,Part1-TechBlog-~HasAlternateBehaviors,Too" style="background-color: white; font-family: Arial, sans-serif; font-size: 16px; line-height: 1.5; margin: 30px 0px 0px; padding: 0px;">
~ Has Alternate Behaviors, Too</h3>
<div style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin-top: 10px; padding: 0px;">
Not be left out, the tilde also has exceptions to the basic rule. Generally the tilde allows patch-level changes, but if you have specified a simple <code>~1</code>, then minor-level changes are allowed. That is, <code>~1 == ^1.0.0</code>. Just to be clear, <code>~1.2 == ~1.2.0</code>. That's a slight difference from <code>~1.2.3</code>, which wouldn't pick up <code>1.2.0</code>.</div>
<h3 id="EverythingYouNeedtoKnowAboutBower,Part1-TechBlog-Pre-releaseTagsFactorIntotheVersion" style="background-color: white; font-family: Arial, sans-serif; font-size: 16px; line-height: 1.5; margin: 30px 0px 0px; padding: 0px;">
Pre-release Tags Factor Into the Version</h3>
<div style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin-top: 10px; padding: 0px;">
Let's start with some basic facts:</div>
<ul style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin: 10px 0px 0px;">
<li>A pre-release is a version that is not considered stable or finished. SemVer stipulates that a version must not be changed once it is released, but a pre-release is a way to iterate over a single version during development.</li>
<li>In SemVer, a pre-release is designated as either:<ul style="list-style-type: disc; margin: 0px;">
<li>A hyphen and then a digit following the main tuple (such as <code>1.2.3-0</code>). The digit gets incremented as pre-releases are made.</li>
<li>A hyphen, a string identifier, a dot, and a digit (such as <code>1.2.3-awesome-feature.0</code>). The string identifier can only contain alphanumerics and hyphens. The digit after the dot would get incremented as pre-releases are made.</li>
</ul>
</li>
<li>A pre-release tag is the string identifier in the previous example.</li>
</ul>
<div style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin-top: 10px; padding: 0px;">
Bower seems a little hard to understand when it comes to discerning pre-release tags. Consider the following scenario: Two teams are working on the next release of <code>awesome-project</code>, and differentiate their work with versions <code>1.2.3-awesome-feature.0</code> and <code>1.2.3-killer-feature.0</code>. Obviously they increment the <code>.0</code> to <code>.1</code>, and so on, as needed.</div>
<div style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin-top: 10px; padding: 0px;">
Now, let's say you're on the "awesome feature" team. And you want to request that version, not the "killer feature" version. So you set <code>awesome-project</code>'s version in your app's <code>bower.json</code> to <code>>=1.2.3-awesome-feature.0.</code> And you would reasonably expect Bower to pick up the latest "awesome feature" tag, whether it's <code>.0</code> or <code>.12</code>.</div>
<div style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin-top: 10px; padding: 0px;">
You can tell where this is going; it doesn't. It picks up the latest "killer feature" tag. Why? Because Bower doesn't look at the pre-release tag so much as an identifier in its own right, but as an indicator that there <em>is</em> a pre-release tag. Once it sees that you want a pre-release tag, it looks at all pre-release tags and picks the <em>highest</em> one. As in, alphabetically highest. Therefore, "killer-feature" will win out over "awesome-feature."</div>
<div style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin-top: 10px; padding: 0px;">
It gets better. You don't even need to supply an existing pre-release tag to get Bower to look for them. This request will <em>also</em> resolve to the latest "killer feature" release: <code>>=1.2.3-made-up-stuff</code>. We kid you not.</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="http://4.bp.blogspot.com/-ATEVdQTmI_M/VlyzHYKxUxI/AAAAAAAAAB0/RKyOAQHGM1k/s1600/bower-part-1_conversation.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://4.bp.blogspot.com/-ATEVdQTmI_M/VlyzHYKxUxI/AAAAAAAAAB0/RKyOAQHGM1k/s1600/bower-part-1_conversation.png" /></a></div>
<div style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin-top: 10px; padding: 0px;">
</div>
<div style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin-top: 10px; padding: 0px;">
The only way to restrict Bower to a single tag is with the following: <code>>=1.2.3-awesome-feature.0 <1.2.3-awesome-feature.100</code> or some improbably high number. This is rather unwieldy, but it does work.</div>
<div style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin-top: 10px; padding: 0px;">
As such, pre-release tags may be useful for supplying meaning to a version in development, but not much else.</div>
<h1 id="EverythingYouNeedtoKnowAboutBower,Part1-TechBlog-ToBeContinued" style="background-color: white; border-bottom-color: rgb(46, 61, 84); font-family: Arial, sans-serif; font-size: 24px; font-weight: normal; line-height: 1.25; margin: 30px 0px 0px; padding: 0px;">
To Be Continued</h1>
<div style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin-top: 10px; padding: 0px;">
In Part Two, I'll take these little bits of Bower logic and share our solution for working with Bower in a way that allows multiple teams to work in parallel, using Bower as a means to distribute our in-house libraries.</div>
<h1 id="EverythingYouNeedtoKnowAboutBower,Part1-TechBlog-ReferencesandFurtherReading" style="background-color: white; border-bottom-color: rgb(46, 61, 84); font-family: Arial, sans-serif; font-size: 24px; font-weight: normal; line-height: 1.25; margin: 30px 0px 0px; padding: 0px;">
References and Further Reading</h1>
<div style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin-top: 10px; padding: 0px;">
Official SemVer spec: <a href="http://semver.org/">http://semver.org/</a></div>
<div style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin-top: 10px; padding: 0px;">
Official node-semver spec: <a href="https://github.com/npm/node-semver#versions">https://github.com/npm/node-semver#versions</a></div>
<div style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin-top: 10px; padding: 0px;">
A decent introduction to SemVer ranges: <a href="http://developer.telerik.com/featured/mystical-magical-semver-ranges-used-npm-bower/">http://developer.telerik.com/featured/mystical-magical-semver-ranges-used-npm-bower/</a></div>
<div style="background-color: white; color: #333333; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; margin-top: 10px; padding: 0px;">
A short and easy-to-read attempt at making the SemVer spec more approachable: <a href="http://semver-ftw.org/">http://semver-ftw.org/</a></div>
Anonymousnoreply@blogger.com0tag:blogger.com,1999:blog-6355980255006905116.post-21084234894983942572015-10-05T12:09:00.000-06:002015-10-06T13:08:46.525-06:00Developer Interviews: Peter Davidson<br />
<h3 style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;">
</h3>
<div class="separator" style="clear: both; text-align: center;">
<a href="http://4.bp.blogspot.com/-M_UoQ4IcwA0/VfMVE57wbRI/AAAAAAAAAEw/-3MxKaoB9N8/s1600/peter%2Bmug.png" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="200" src="http://4.bp.blogspot.com/-M_UoQ4IcwA0/VfMVE57wbRI/AAAAAAAAAEw/-3MxKaoB9N8/s200/peter%2Bmug.png" width="169" /></a></div>
<a href="https://www.blogger.com/blogger.g?blogID=6355980255006905116" imageanchor="1" style="clear: right; float: right; margin-bottom: 1em; margin-left: 1em;"></a><br />
<h3>
<span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">What do you do and how long have you been at bbcom?</span></h3>
<div>
<blockquote class="tr_bq">
<span style="font-family: Arial, Helvetica, sans-serif;"> I'm a principal engineer on a platform api team. I've been with bbcom since April 2014.</span></blockquote>
</div>
<h3>
<span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">Linux or Mac?</span></h3>
<blockquote class="tr_bq">
<span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">Mac</span></blockquote>
<h3>
<span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">What is a typical day like for you?</span></h3>
<blockquote class="tr_bq">
<span style="font-family: Arial, Helvetica, sans-serif;"> My day is coding, interspersed with a daily scrum, occasional meetings and our daily team basketball game.</span></blockquote>
<h3>
<a href="https://www.blogger.com/blogger.g?blogID=6355980255006905116" imageanchor="1" style="clear: right; float: right; margin-bottom: 1em; margin-left: 1em;"></a><span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">What is in your developer tool box? </span></h3>
<div>
<blockquote class="tr_bq">
<a href="https://www.blogger.com/blogger.g?blogID=6355980255006905116" imageanchor="1" style="clear: right; float: right; margin-bottom: 1em; margin-left: 1em;"></a><span style="font-family: Arial, Helvetica, sans-serif;"><span style="font-size: 11px;"> </span>My two favorite tools right now work hand in hand -> Hystrix and RxJava. </span><span style="font-family: Arial, Helvetica, sans-serif;">I use Hystrix to simplify threading and add bulk heading and circuit breaking. </span><span style="font-family: Arial, Helvetica, sans-serif;">I use RxJava to compose data from multiple data sources into a single data stream. My favorite rx function is Observable.zip.</span></blockquote>
</div>
<h3>
<span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">What are your favorite pro tips?</span></h3>
<div>
<blockquote class="tr_bq">
<span style="font-family: Arial, Helvetica, sans-serif;">Threading is hard, c</span><span style="font-family: Arial, Helvetica, sans-serif;">aching is hard, n</span><span style="font-family: Arial, Helvetica, sans-serif;">aming is hard. M</span><span style="font-family: Arial, Helvetica, sans-serif;">ake objects immutable and it makes caching and threading easier.</span></blockquote>
</div>
<h3>
<span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">What did you code up today? </span></h3>
<div>
<blockquote class="tr_bq">
<span style="font-family: Arial, Helvetica, sans-serif;">Fixed a bug with user status being cached with a stale database value by a different thread, after removing from cache but prior to committing the transaction. </span> </blockquote>
<blockquote class="tr_bq">
<span style="font-family: Arial, Helvetica, sans-serif;">Modified RxJava Observables to emit a fallback value when data is not present in the database. </span></blockquote>
</div>
<h3>
<span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">What has been the most challenging problem you’ve had to solve? </span></h3>
<blockquote class="tr_bq">
<span style="font-family: Arial, Helvetica, sans-serif;">We outgrew our current Mongo solution (without sharding) for our news feed. We needed a solution that met both our scale and performance needs. Earlier this year, we prototyped, developed and migrated to a news feed based on Cassandra. The Cassandra news feed improved our performance and will allow us to scale for the future.</span></blockquote>
<h3>
<span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">Any crazy Bbcom stories?</span></h3>
<blockquote class="tr_bq">
<span style="font-family: Arial, Helvetica, sans-serif;">Nope</span></blockquote>
<h3>
<span style="font-family: Arial, Helvetica, sans-serif;"><span style="font-size: small;">What is the best thing about working at Bbcom</span>?</span></h3>
<blockquote class="tr_bq">
<span style="font-family: Arial, Helvetica, sans-serif;">Lots of places have challenging problems, but the thing that makes bbcom a great place to work is the people I get to work with. People at bbcom </span><span style="font-family: Arial, Helvetica, sans-serif;">are passionate about technology and fitness. We have internal tech meet-ups, daily basketball/football games and a lot of fun.</span></blockquote>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br class="" /></span></div>
<div>
<br /></div>
Anonymousnoreply@blogger.com0tag:blogger.com,1999:blog-6355980255006905116.post-81460434481427125572015-09-11T11:51:00.000-06:002015-09-11T11:51:04.143-06:00A coding demo on Grunt, RequireJS, AngularJS and Yeoman<div class="separator" style="clear: both; text-align: center;">
<a href="http://1.bp.blogspot.com/-GByNve7v7V4/VfMTYZd7AfI/AAAAAAAAAEk/26z1BzUJ-SU/s1600/terminal.png" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="http://1.bp.blogspot.com/-GByNve7v7V4/VfMTYZd7AfI/AAAAAAAAAEk/26z1BzUJ-SU/s1600/terminal.png" /></a></div>
<div class="p1">
<span class="s1"><br /></span></div>
<div class="p1">
<span class="s1"><br /></span></div>
<div class="p1">
<span class="s1"><span style="font-family: Arial, Helvetica, sans-serif;">Our Client Side Engineers at <a href="http://bodybuilding.com/">Bodybuilding.com</a> have fully embraced a modern front-end tech stack to speed up development, testing, and deploys. We use <a href="https://angularjs.org/"><span class="s2">AngularJS</span></a> to build and scale our <a href="http://bodyspace.com/" target="_blank">social</a> and <a href="http://bodybuilding.com/store" target="_blank">eCommerce</a> apps, <a href="http://requirejs.org/"><span class="s2">RequireJS</span></a> for modularity in our build process, and <a href="http://gruntjs.com/"><span class="s2">Grunt</span></a> and <a href="http://yeoman.io/"><span class="s2">Yeoman</span></a> for minification, compilation, linking, and more.</span></span></div>
<br />
<div class="p1">
<span class="s1"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div class="p1">
<span class="s1"><span style="font-family: Arial, Helvetica, sans-serif;">Learn how <a href="http://bodybuilding.com/">Bodybuilding.com</a> transitioned to these frameworks and tools with live coding demonstrations.</span></span></div>
<div class="p1">
<span class="s1"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div class="p1">
<br /></div>
<div class="p1">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<iframe width="320" height="266" class="YOUTUBE-iframe-video" data-thumbnail-src="https://i.ytimg.com/vi/ZTO4Xc9gr-o/0.jpg" src="https://www.youtube.com/embed/ZTO4Xc9gr-o?feature=player_embedded" frameborder="0" allowfullscreen></iframe></div>
<div class="p1">
<br /></div>
Anonymousnoreply@blogger.com0tag:blogger.com,1999:blog-6355980255006905116.post-57408714181191741672015-09-10T12:39:00.001-06:002015-09-10T15:57:45.043-06:00Improving Fault and Latency Tolerance with Hystrix<div class="separator" style="clear: both; text-align: center;">
<a href="http://1.bp.blogspot.com/-QiPjod5bnlk/VfHG7lAz0jI/AAAAAAAAAEE/vjWKWncJu88/s1600/hystrix-logo.png" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="http://1.bp.blogspot.com/-QiPjod5bnlk/VfHG7lAz0jI/AAAAAAAAAEE/vjWKWncJu88/s1600/hystrix-logo.png" /></a></div>
<span style="background-color: white; color: #232323; font-family: ProximaNova; font-size: 14px; line-height: 20px;"><br /></span>
<span style="background-color: white; color: #232323; font-family: ProximaNova; font-size: 14px; line-height: 20px;"><br /></span>
<span style="background-color: white; color: #232323; font-family: ProximaNova; font-size: 14px; line-height: 20px;">The API for <a href="http://www.bodybuilding.com/" target="_blank">Bodybuilding.com</a> serves more than a hundred million API calls everyday across hundreds of servers. In this video you will learn how we use Hystrix to build a distributed system that is both fault and latency tolerant. We will discuss the bulkhead and circuit breaker patterns used by </span><a href="https://github.com/Netflix/Hystrix" rel="" style="box-sizing: border-box; color: #00aeef; cursor: pointer; font-family: ProximaNova; font-size: 14px; line-height: 20px; text-decoration: none;" target="_blank">Hystrix</a><span style="background-color: white; color: #232323; font-family: ProximaNova; font-size: 14px; line-height: 20px;"> to provide a resilient and fast API.</span><br />
<span style="background-color: white; color: #232323; font-family: ProximaNova; font-size: 14px; line-height: 20px;"><br /></span>
<br />
<div class="separator" style="clear: both; text-align: center;">
<iframe allowfullscreen="" class="YOUTUBE-iframe-video" data-thumbnail-src="https://i.ytimg.com/vi/0S59yCszYgg/0.jpg" frameborder="0" height="266" src="https://www.youtube.com/embed/0S59yCszYgg?feature=player_embedded" width="320"></iframe></div>
<span style="background-color: white; color: #232323; font-family: ProximaNova; font-size: 14px; line-height: 20px;"><br /></span>Anonymousnoreply@blogger.com0tag:blogger.com,1999:blog-6355980255006905116.post-68657455917988643962015-04-21T12:08:00.000-06:002015-09-10T15:58:16.055-06:00Give back to the people that you owe your success to<div style="margin-bottom: .0001pt; margin: 0in;">
<span style="font-family: Helvetica Neue, Arial, Helvetica, sans-serif;">It’s with great pleasure that I
introduce, via the first official blog entry, the Bodybuilding.com engineering
team. Our intent with this blog, and our soon-to-be published open source
projects, is to give back to the community from which we've learned
so much. Paying it forward is a <a href="http://www.bodybuilding.com/fun/bbcomcareer.htm#corevalues">core value</a>
that’s literally baked into our company’s DNA:</span><br />
<blockquote class="tr_bq">
<i><span style="font-family: Helvetica Neue, Arial, Helvetica, sans-serif;">"Give back to the people that you
owe your success to.</span></i></blockquote>
</div>
<div style="margin-bottom: .0001pt; margin: 0in;">
<span style="font-family: Helvetica Neue, Arial, Helvetica, sans-serif;">
We will share insight into our experience by covering subjects such as performance,
scale,<span class="apple-converted-space"> </span><a href="http://stackshare.io/bodybuilding-com" target="_blank">frameworks</a>, and mobile
just to name a few. This post will likely be one of the most vanilla and
non-technical, so I'll try to keep it brief. <o:p></o:p></span></div>
<div style="margin-bottom: .0001pt; margin: 0in;">
<span style="font-family: Helvetica Neue, Arial, Helvetica, sans-serif;"><br />
If you already know about Bodybuilding.com (aka bbcom), then you can stop here.
For those who are new to the site, the rest of this post is for you.
<o:p></o:p></span></div>
<div style="margin-bottom: .0001pt; margin: 0in;">
<span style="font-family: Helvetica Neue, Arial, Helvetica, sans-serif;"><br />
On the surface, bbcom may just look like another eCommerce company. In
reality, it’s an engineering powerhouse built on some of the most advanced
platforms in existence. There’s a reason we’re ranked within the top 200
on <a href="http://www.alexa.com/siteinfo/bodybuilding.com">Alexa</a> - we have
a huge digital publication, the largest fitness social network, one of the top
forums in the world, and the biggest sports nutrition site to boot. Shocked?
That’s understandable. When I came on board over four years ago, I too was surprised.
What we’ve achieved since then is truly impressive. <o:p></o:p></span></div>
<div style="margin-bottom: .0001pt; margin: 0in;">
<span style="font-family: Helvetica Neue, Arial, Helvetica, sans-serif;"><br /></span></div>
<div style="margin-bottom: .0001pt; margin: 0in;">
<span style="font-family: Helvetica Neue, Arial, Helvetica, sans-serif;">The graphic below was put
together in 2012 for the “Tech Talk” we hosted in Boise, ID. <o:p></o:p></span></div>
<div style="margin-bottom: .0001pt; margin: 0in;">
<span style="font-family: Helvetica Neue, Arial, Helvetica, sans-serif;"><br /></span></div>
<div style="margin-bottom: .0001pt; margin: 0in;">
<div class="separator" style="clear: both; text-align: center;">
<a href="http://2.bp.blogspot.com/-KasO_3gQETM/VQhj2S_vf_I/AAAAAAAAABE/gr4ovc9wQb8/s1600/2012_eng_stats.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><span style="font-family: Helvetica Neue, Arial, Helvetica, sans-serif;"><img border="0" height="295" src="http://2.bp.blogspot.com/-KasO_3gQETM/VQhj2S_vf_I/AAAAAAAAABE/gr4ovc9wQb8/s1600/2012_eng_stats.png" width="400" /></span></a></div>
<span style="font-family: Helvetica Neue, Arial, Helvetica, sans-serif;"><a href="http://4.bp.blogspot.com/-KasO_3gQETM/VQhj2S_vf_I/AAAAAAAAABA/oMj_P4nLvXI/s1600/2012_eng_stats.png"><span style="font-size: 13.5pt; mso-no-proof: yes; text-decoration: none; text-underline: none;"><!--[if gte vml 1]><v:shapetype id="_x0000_t75" coordsize="21600,21600"
o:spt="75" o:preferrelative="t" path="m@4@5l@4@11@9@11@9@5xe" filled="f"
stroked="f">
<v:stroke joinstyle="miter"/>
<v:formulas>
<v:f eqn="if lineDrawn pixelLineWidth 0"/>
<v:f eqn="sum @0 1 0"/>
<v:f eqn="sum 0 0 @1"/>
<v:f eqn="prod @2 1 2"/>
<v:f eqn="prod @3 21600 pixelWidth"/>
<v:f eqn="prod @3 21600 pixelHeight"/>
<v:f eqn="sum @0 0 1"/>
<v:f eqn="prod @6 1 2"/>
<v:f eqn="prod @7 21600 pixelWidth"/>
<v:f eqn="sum @8 21600 0"/>
<v:f eqn="prod @7 21600 pixelHeight"/>
<v:f eqn="sum @10 21600 0"/>
</v:formulas>
<v:path o:extrusionok="f" gradientshapeok="t" o:connecttype="rect"/>
<o:lock v:ext="edit" aspectratio="t"/>
</v:shapetype><v:shape id="Picture_x0020_1" o:spid="_x0000_i1025" type="#_x0000_t75"
alt="https://4.bp.blogspot.com/-KasO_3gQETM/VQhj2S_vf_I/AAAAAAAAABA/oMj_P4nLvXI/s1600/2012_eng_stats.png"
href="http://4.bp.blogspot.com/-KasO_3gQETM/VQhj2S_vf_I/AAAAAAAAABA/oMj_P4nLvXI/s1600/2012_eng_stats.png"
style='width:300pt;height:221.25pt;visibility:visible;mso-wrap-style:square'
o:button="t">
<v:fill o:detectmouseclick="t"/>
<v:imagedata src="file:///C:\Users\DAVID~1.MON\AppData\Local\Temp\msohtmlclip1\01\clip_image001.png"
o:title="proxy?url=http%3A%2F%2F4.bp.blogspot.com%2F-KasO_3gQETM%2FVQhj2S_vf_I%2FAAAAAAAAABA%2FoMj_P4nLvXI%2Fs1600%2F2012_eng_stats"/>
</v:shape><![endif]--><!--[if !vml]--><!--[endif]--></span></a><o:p></o:p></span></div>
<div style="margin-bottom: .0001pt; margin: 0in;">
<span style="font-family: Helvetica Neue, Arial, Helvetica, sans-serif;"><br /></span></div>
<div style="margin-bottom: .0001pt; margin: 0in;">
<span style="font-family: Helvetica Neue, Arial, Helvetica, sans-serif;"><br /></span></div>
<div style="margin-bottom: .0001pt; margin: 0in;">
<div class="separator" style="clear: both; text-align: center;">
<span style="font-family: Helvetica Neue, Arial, Helvetica, sans-serif;"></span></div>
<span style="font-family: Helvetica Neue, Arial, Helvetica, sans-serif;">While we’ve surpassed these
numbers by leaps and bounds, their magnitude alone shows the volume of work we
produce and the number of people we reach.
All of this with a team of just over 100 passionate technologists with
engineering offices in <a href="https://www.google.com/maps/place/5777+N+Meeker+Ave,+Boise,+ID+83713/@43.6573859,-116.3381016,17z/data=!3m1!4b1!4m2!3m1!1s0x54ae550e3e44ae87:0x8992c878cbbb0523" target="_blank">Boise</a>, <a href="https://www.google.com/maps/place/1338+NW+Hoyt+St,+Portland,+OR+97209/@45.526972,-122.684999,17z/data=!3m1!4b1!4m2!3m1!1s0x549509f8c5587361:0xe8a5949d31c243ee" target="_blank">Portland </a>and <a href="https://www.google.com/maps/place/Forum+1/@9.94587,-84.194279,17z/data=!3m1!4b1!4m2!3m1!1s0x8fa0f952322f3905:0x6cf10de361124b48" target="_blank">Costa Rica</a>. <o:p></o:p></span></div>
<div style="margin-bottom: .0001pt; margin: 0in;">
<span style="font-family: Helvetica Neue, Arial, Helvetica, sans-serif;"><br /></span></div>
<div style="margin-bottom: .0001pt; margin: 0in;">
<a href="https://www.blogger.com/blogger.g?blogID=6355980255006905116" imageanchor="1" style="clear: right; float: right; margin-bottom: 1em; margin-left: 1em;"></a><span style="font-family: Helvetica Neue, Arial, Helvetica, sans-serif;">What about the future? We have big plans to continue revolutionizing
the health and fitness space. Our near
term focus is to help our users create lasting change i.e. sticking to your workout schedule. To create positive habits that stick with you
indefinitely. This, as it turns out, is a
very hard problem to solve. Here at bbcom we welcome the challenge with arms wide open. Bring it on! </span><br />
<span style="font-family: Helvetica Neue, Arial, Helvetica, sans-serif;"><br /></span></div>
<div style="margin-bottom: .0001pt; margin: 0in;">
<span style="font-family: Helvetica Neue, Arial, Helvetica, sans-serif;">Thank you for reading. Check back often as we will be contributing
regularly. Better yet, subscribe.<o:p></o:p></span></div>
<div style="margin-bottom: .0001pt; margin: 0in;">
<br /></div>
<div style="margin-bottom: .0001pt; margin: 0in;">
<span style="font-family: Helvetica Neue, Arial, Helvetica, sans-serif;"><a href="https://www.linkedin.com/pub/david-montz/0/39b/794" target="_blank">David Montz</a><o:p></o:p></span></div>
<div style="margin-bottom: .0001pt; margin: 0in;">
<span style="font-family: Helvetica Neue, Arial, Helvetica, sans-serif;">VP Engineering & Product</span><span style="font-size: 13.5pt;"><o:p></o:p></span><br />
<span style="font-family: Helvetica Neue, Arial, Helvetica, sans-serif;"><br /></span></div>
<!-- Blogger automated replacement: "https://4.bp.blogspot.com/-KasO_3gQETM/VQhj2S_vf_I/AAAAAAAAABA/oMj_P4nLvXI/s1600/2012_eng_stats.png" with "https://4.bp.blogspot.com/-KasO_3gQETM/VQhj2S_vf_I/AAAAAAAAABA/oMj_P4nLvXI/s1600/2012_eng_stats.png" --><!-- Blogger automated replacement: "https://images-blogger-opensocial.googleusercontent.com/gadgets/proxy?url=http%3A%2F%2F4.bp.blogspot.com%2F-KasO_3gQETM%2FVQhj2S_vf_I%2FAAAAAAAAABA%2FoMj_P4nLvXI%2Fs1600%2F2012_eng_stats.png&container=blogger&gadget=a&rewriteMime=image%2F*" with "https://4.bp.blogspot.com/-KasO_3gQETM/VQhj2S_vf_I/AAAAAAAAABA/oMj_P4nLvXI/s1600/2012_eng_stats.png" -->Anonymousnoreply@blogger.com0