Getting Started with the AmplifyJS NuGet Package in Visual Studio

Last week I packaged appendTo's AmplifyJS Library and published it to the central NuGet server for use in your Visual Studio projects.

The package contains…

• An unminifed version of AmplifyJS for development use
• A minified version of AmplifyJS for production use
• A VSDOC version of AmplifyJS that enables intellisense support within Visual Studio

What is AmplifyJS?

AmplifyJS is a set of components designed to solve common web application problems with a simplistic API. AmplifyJS solves the following problems:

• Ajax Request Management
  • amplify.request provides a clean and elegant request abstraction for all types of data, even allowing for transformation prior to consumption.

• Client Side Component Communication
  • amplify.publish/subscribe provides a clean, performant API for component to component communication.

• Client Side Browser & Mobile Device Storage
  • amplify.store takes the confusion out of HTML5 localStorage. It doesn't get simpler than using amplify.store(key, data)! It even works flawlessly on mobile devices.

Installation

In order to install the NuGet package in your Visual Studio project all you need to do is type the following command into the “Package Manager Console”

Once you type the above command into the “Package Manager Console” then all of the appropriate files will be downloaded to your project to support AmplifyJS.

If the command line isn’t your thing and you prefer a Graphical User Interface, then you can install AmplifyJS as well by searching for “AmplifyJS” in the “Add Library Package Reference” dialog.

Referencing and Using AmplifyJS

Now that you’ve installed AmplifyJS all that is left is to reference the script file that was added to your Scripts folder and start using it. It is considered best practice to add your scripts to the bottom of your webpage for best overall performance. Once you do this you can start using the library right away as shown in the following code snippet.

The code that I am showing the above screenshot is a very simple example of what can be accomplished with AmplifyJS. Look at the following code and see how the 3 components work together (Publish/Subscript, Request, and Store).

You can play around with the above code inside the following jsFiddle. Click the “+” sign to launch a full editor so you can tweak with the code yourself. Try commenting out the 2nd definition of the mocked “getTweets” request. You should see real data from Twitter being returned instead of mock data.

If are interested to see how AmplifyJS might help your application then you might check out an article entitled Extending Your jQuery Application with AmpilfyJS that is hosted on Microsof't's Script Junkie website.

There is so much more you can do with the AmplifyJS library. Feel free to check out the official AmplifyJS Documentation and if you need support or more information check out the AmplifyJS Community page.