Getting Started With Yarn

A couple of weeks ago Facebook released Yarn, and alternate package manager for the web that is compatible with npm repositories.

When I first heard about it, my initial reaction was along the lines of “is this really necessary?”, npm works ok and is now commonplace. Do we really need another component in an already complex Javascript ecosystem? However, I believe that there is always room for improvement, and anything that aims to make a developer’s life better is worth looking at.

Yarn is a drop-in replacement for the npm client, and supposedly improvement upon it in various areas including:

  • Performance
  • Security
  • Reporting

For more details on Yarn’s features and advantages, please read the official documentation or this comparison post.


For OSX/MacOS, the recommended method is to install using homebrew:

brew install yarn

Its also possible to install with npm, but this feels somewhat wrong.

npm install -g yarn


Once installed, you’re able to use yarn for both new projects, and existing ones that currently use npm for package management. For the latter, (where you already have a package.json), you simply need to invoke the following command from your project’s root directory.

yarn install

It’s as easy as that. This will instruct yarn to fetch all of the required dependencies for your project. If the process was successful, you should find a yarn.lock file in your project’s root directory. This is the equivalent of the package.json from npm that you’re probably familiar with.

For a new project, you’ll need to initialise Yarn in much the same way you would with npm, by executing the following command from the root of your project:

yarn init

Once Yarn has been initialised, it is ready to manage your project’s dependencies. The CLI commands differ slightly in places to their npm counterparts, but they remain intuitive and easy to remember. I won’t duplicate the entire API in this post, but the core commands are as follows:

yarn add <package> // adds a new package dependency
yarn update <package> // updates an existing package dependency
yarn remove <package> // removes a package dependency

No suprises there, which should make the transition from npm to yarn a smooth one.

First Impressions

It’s early days for Yarn, and I haven’t really had enough time to cast too much of judgement on it yet, but so far it seems pretty good. It’s quick to set up and transition to for an npm-based project (as you can hopefully see from above).

I’m particularly fond of the improved output/reporting, especially during a yarn install. I think it’s much more readable, and provides a better picture of what it is currently doing / how much it has remaining.

Whilst some of the security improvements are less headline-grabbing to most of us, they are essential and we would feel the pain badly if they weren’t in place.

I believe that performance will ultimately be where this battle is won or lost. Lengthy npm install’s have become notorious, and if Yarn can make a serious dent in them then I can see it being very popular.

It will be interesting to see how this influences the npm client moving forward. I for one really hope that the npm compatibility is retained. If this is lost, it will be more effort for developers when publishing or retrieving packages to/from multiple repositories, which would be a backwards step in my view.

For the latest updates on Yarn, follow @yarnpkg on Twitter.

Angular Connect 2016

A couple of weeks ago I attended Angular Connect at the Excel arena in London. This was my first time at Angular Connect (or any AngularJS conference for that matter), and having watched the 2015 sessions on YouTube I was extremely excited to attend. As it turns out, this was pretty much the perfect time to attend an Angular conference, with 2.0 final being released just days beforehand.

Personally I haven’t yet used 2.x in anger as the last couple of projects I’ve worked on have required more stability than the beta period offered. During the weeks leading up to the conference I played catch-up and spent some time learning the 2.x ropes through various online tutorials. The jump from Angular 1.x to 2.x is huge - which is great as many changes were needed to bring it up to date, but also somewhat intimidating. I’m glad I spent the time to do this as otherwise the more technical talks may have been overwhelming. I plan to write a separate post on my forming thoughts on Angular 2 as a newcomer.

The conference offered 2 standard “speaker” tracks, as well as a mini-workshop track, an office-hours track and a panel Q&A track. I mostly focussed on the main speaker tracks as I find I get the most out of these, and wanted to cover as much ground as possible as I’m still getting up to speed.

The schedule was really well assembled, and across the two days there were very few slots that I wasn’t excited for. Far more common was a tricky decision about which track to attend. There were talks covering the entire gamut of front end development from UI design and animations, to the CLI and performance optimisations. Generally, each talk covered how to use the feature(s) and what was new/coming soon in the given area (some of which is really exciting). It was particularly good to see more specialist areas such as application security also getting coverage.

I also sat in on some non-technical talks, including a very funny one by Shai Reznik on the strength of the Angular community - which felt somewhat comforting given the negativity which seems to surround AngularJS at times. If Connect was anything to go by then I’d have to agree that the community is awesome and the framework is pretty great too.

Without exception each talk I attended was compelling and well delivered. The majority of the speakers were either core-team developers or prominent community members, which ensured the content was accurate and insightful. If you didn’t attend, I’d encourage you to take a look at the YouTube channel - tracks one and two were both recorded and I believe that all sessions have now been uploaded - well worth a watch.

Overall I thought this was a brilliant conference, the best I’ve been to by some way. The speakers were great, the event ran to schedule, and the food was awesome – it even had its own beer. Without a doubt I’d highly recommend it to anyone even remotely interested in the Angular framework, there’s something for everyone in there across the various tracks. Hopefully see you there next year!