Education
-
Pluralsight
Description:
Wonderful tool for those of us who really want to know and learn constantly.Benefit:
Great learning tool.
To collapse click here
- Single Page Apps with HTML5, Web API, Knockout and jQuery: 6h 25m
- WCF For Architects: 4h 3m
- WCF by Example: 1h 58m
- C# Fundamentals - Part 1: 6h 17m
- C# Fundamentals - Part 2: 2h 44m
- C# 4.0 New Features: 1h 34m
- C# 5 New Features: 1h 15m
- Introduction to the ASP.NET Web API: 3h 15m
- Introduction to Identity and Access Control in .NET 4.5: 2h 24m
- Entity Framework 4.0 By Example: 2h 18 m
- Entity Framework Code First Migrations: 1h 9m
- A Better CSS: LESS and SASS: 1h 56m
- A Web Developer's Guide to Images: 2h 39m
- ASP.NET Ajax JavaScript and jQuery: 2h 22m
- ASP.NET MVC 4 Fundamentals: 4h 21m
- Creating User Experiences: Fundamental Design Principles: 4h 31m
- Identity and Access Control in ASP.NET 4.5: 3h 20m
- Introduction to Async and Parallel Programming in .NET 4: 2h 51m
- Introduction to Visual Studio 2012 - Part 1: 3h 44m
- JavaScript Design Patterns: 2h 2m
- JavaScript for C# Developers: 2h 5m
- jQuery Advanced Topics: 3h 9m
- Building HTML5 and JavaScript Apps with MVVM and Knockout: 4h 50m-
- jQuery Mobile and ASP.NET MVC 4: 1h 47m
- Using HTML5 and CSS3: 2h 12m
- Outside-In Test-Driven Development: 2h 27m
- Knockout Fundamentals: 1h 39m
- Typescript Fundamentals: 4h 28m - Wahlin , Papa
- Introduction to Mobile App Marketing: 25m
- Structuring JavaScript Code: 2h 10m
- Introduction to Bootstrap: 2h 9m
- Single Page Apps JumpStart: 5h 10m
- Introducing ASP.NET SignalR - Push Services with Hubs: 3h 28m
- Preparing For a Job Interview: 2h 27m
- C# Events, Delegates and Lambdas: 2h 17m
- Building ASP.NET Web API OData Services: 3h 51m
- Underscore.js Fundamentals: 2h 53m
- JavaScript From Scratch: 1h 52m
- Google Charts By Example: 2h 12m
- HTML5 Line of Business Apps with Bootstrap, MVC4 and Web API: 4h 11m
- An Introduction to Design: 1h 53m
- LINQ Architecture: 1h 23m
- jQuery Tips and Tricks: 4h 23m
- Inside Strategies for Growing Your Userbase: 2h 34m
- REST Fundamentals: 2h 59m
- Fixing Common JavaScript Bugs: 3h 42m
- Building a Site with Bootstrap, AngularJS, ASP.NET, EF and Azure: 6h 29m
-
ASP.NET Web.API
Description:
ASP.NET Web API is a framework that makes it easy to build HTTP services that reach a broad range of clients, including browsers and mobile devices. It is an ideal platform for building RESTful applications on the .NET Framework. This poster shows how an HTTP request flows through the Web API pipeline, and how the HTTP response flows back. The diagram also shows extensibility points, where you can add custom code or even replace the default behavior entirely.Benefit:
A way to have a web site display properly on any device (iPhones, iPads, Tables, large monitors, etc). To learn more, checkout this
Web.API Poster
-
Parallel Computing
Description:
Parallel computing is a form of computation in which multiple operations are carried out simultaneously. Visual Studio 2012, the .NET Framework, and Visual C++ all contain extensive support for writing, debugging, and tuning parallel applications. Parallel computing is closely related to asynchronous programming, using many of the same core concepts and support. Asynchronous programming is an approach to writing code that involves invoking operations such that they don't block the current thread of execution.Benefit:
This will help learn how to use the TPL and all aspects of parallel computing. -
MSDN Magazine
Description:
Read the magazine online, download a formatted digital version of each issue, or grab sample code and apps.Benefit:
All MSDN Magazine Issues and Downloads! -
Async & Parallel
Description:
Async & Parallel Programming on MSDN.Benefit:
By using your all the cores on your CPUs, you can make a site be the fastest it can be. -
TPL Design Patterns
Description:
Design Patterns for Decomposition and Coordinaation on Multicore Architectures (TPL).Benefit:
Proven solution design patterns for reocurring problems in the TPL world. -
JavaScript: The Good Parts
Description:
JavaScript: The Good Parts
by Douglas Crockford
Publisher: O'Reilly
Publish Date: May 2, 2008
Print ISBN-13: 978-0-596-51774-8
Pages: 170Benefit:
Highly Recommended. The author, Douglas Crockford, who is also the creator of JSON and JSLint, gave a great presentation back in 2009, available as part of Tech Google Talks at
Presentation
-
Book
Description:
Came highly recommended reading on one of the Pluralsight courses about getting ready for an interview. The author said it was a must read hence here for access on any device to read when time allows.Benefit:
Highly Recommended.
Tools
-
Visual Studio 2012
Description:
Visual Studio 2012 brings enhancements in many areas. One of my favorites is the new ASP.NET MVC4 Web API. Here's how Microsoft discribe it: Easily build and consume HTTP services that reach a broad range of clients. Services can be consumed by browsers, mobile applications, tablets, and other devices. Built-in support for content negotiation enables clients and servers to mutually determine the right format for data. Directly access and manipulate HTTP requests and responses by using a modern HTTP programming model. Use a clean, strongly typed HTTP object programming model that’s supported both on the server and on the client. The new HttpClient API can call web APIs from any .NET Framework application. Easily extract data from an HTTP request. Model binders make it easier to extract data from various parts of an HTTP request. The message parts become .NET objects that Web API actions can use. The ASP.NET Web API supports the same model binding and validation infrastructure as ASP.NET MVC. Enjoy a full set of routing capabilities. ASP.NET Web APIs support the full set of routing capabilities in ASP.NET MVC and ASP.NET, including route parameters and constraints.
For more information, see Getting Started with ASP.NET Web API and ASP.NET Web API (Part 1)Benefit:
-
Fiddler
Description:
Fiddler is a Web Debugging Proxy which logs all HTTP(S) traffic between your computer and the Internet. Fiddler allows you to inspect traffic, set breakpoints, and "fiddle" with incoming or outgoing data. Fiddler includes a powerful event-based scripting subsystem, and can be extended using any .NET language. Fiddler is freeware and can debug traffic from virtually any application that supports a proxy, including Internet Explorer, Google Chrome, Apple Safari, Mozilla Firefox, Opera, and thousands more. You can also debug traffic from popular devices like Windows Phone, iPod/iPad, and others.Benefit:
Helps to debug Javascript/Ajax errors when getting data from the server, or posting data to it. By doing what the Ajax calls do on the client, and getting its response, you can see both, the request and the response JSON objects so you can see what data is being sent to the server, and what data is coming from the server, including their field/property names. Extremely helpful to test the Web.API calls to be exposed.
Fiddler Demos
-
JSFiddle
Description:
Chrome's jsFiddle is the playground for web developers, an online editor for web snippets and can be used as an online editor for snippets build from HTML, CSS and JavaScript. It helps to isolate bugs. Many frameworks supported.Benefit:
This enables quick deliverables in small chuncks that can be tested by user to approve the way it will look, and the way it will behave. -
LESS
Description:
LESS is a dynamic stylesheet language. LESS extends CSS with dynamic behavior such as variables, mixins, operations and functions. LESS runs on both the client-side (Chrome, Safari, Firefox) and server-side, with Node.js and Rhino. LESS was developed by Alexis Sellier, more commonly known as cloudhead.Benefit:
This enables to adapt dynamically to any devive of any size. Whether iPhones, iPads, tablets, or any other HD monitor, through the use of media-queries we can create a CCS3 for the unique device according to its measurements. -
CSS3
Description:
Cascading Style Sheets (CSS) is a style sheet language used for describing the presentation semantics (the look and formatting) of a document written in a markup language. Its most common application is to style web pages written in HTML and XHTML.
Benefit:
There are many tools that help creating CSS3. Below are some of the ones we use:
CSS3 Generator
CSS3 Generator
Icons
Benefit:
CSS3 is the eye candy of the internet today! A way for developers to define the look and feel of a site unobtrusively in a separate file. -
JSON
Description:
JSON (JavaScript Object Notation) is a lightweight data-interchange format.Benefit:
According to Json.org, it is easy for humans to read and write. It is easy for machines to parse and generate. It is based on a subset of the JavaScript Programming Language, Standard ECMA-262 3rd Edition - December 1999. JSON is a text format that is completely language independent but uses conventions that are familiar to programmers of the C-family of languages, including C, C++, C#, Java, JavaScript, Perl, Python, and many others. These properties make JSON an ideal data-interchange language. -
The Responsinator
Description:
The Responsinator is designed to test responsive websites on different device resolutionsBenefit:
This enables you to see side by side how your web application looks on 6 different devices both, in portrait and in landscape. The real web site in them!- iPhone 3+4 portrait 320 x 480
- iPhone 3+4 landscape 480 x 320
- iPhone 5 portrait 320 x 568
- iPhone 5 landscape 568 x 320
- Not So Good Android portrait 240 x 320
- Not So Good Android landscape 320 x 240
- Better Android (Samsung Galaxy) portrait 380 by 685 (equivalent desktop resolution)
- Better Android (Samsung Galaxy) landscape 685 by 380 (equivalent desktop resolution)
- iPad portrait 768 x 1024
- iPad landscape 1024 x 768
- Kindle portrait 600 x 1024
- Kindle landscape 1024 x 600
-
HTML 5 Outliner
Description:
Online tool that presents the structure of HTML5 documents.Benefit:
This enables to you to see how the browser sees your page as an outline depending on your headings, sections, sections, and footers -
TypeScript
Description:
TypeScript is a language for application-scale JavaScript development. TypeScript is a typed superset of JavaScript that compiles to plain JavaScript. Any browser. Any host. Any OS. Open Source.
TypeScript provides code encapsulation through classes. Classes can inherit from other classes. Interfaces provide a code contract to ensure consitency accross objects. Interfaces can extend other interfaces.Benefit:
Enterprise Level Javascript that uses Modules and implements Javascript Design patterns like the Revealing Module pattern and the Prototype pattern, to properly expose public variables, reuse code, ease maintenability, and only load functions in memory once!.
Easier code when it comes to maintenance by implementing inheritance for us via the extends keyword on the Typescript side, then converting it to a prototype on the Javascript side... The use of interfaces in Typescript tells us when we have a problem upfront while coding, not at runtime, as it would in Javascript. This makes your code more loosely couple, very flexible and anything that implements the interface will be allowed. It also improves consistency accross the application. Interfaces enables us to write much cleaner code -
Bootstrap
Description:
Sleek, intuitive, and powerful front-end framework for faster and easier web development.
Benefit:
Easy, adaptable CSS 3 for HTML 5
Sleek, intuitive, and powerful front-end framework for faster and easier web development. -
Balsamiq
Description:
Meet Balsamiq Mockups, our Rapid Wireframing Tool. Balsamiq is a small group of passionate individuals who believe work should be fun and that life's too short for bad software.
Benefit:
- Generate ideas quickly
- Review and iterate sooner Communicate easily with designers, developers, and product managers.
- Iterate in real time with your stakeholders.
-
Q
Description:
Q is a A tool for making and composing asynchronous promises in JavaScript
Benefit:
Q is used to return promises. Because some methods are called asynchronously, we cannot simply just return. Instead, we need to fulfill its promise. We do this by using Q which has a method called RESOLVE which does this for us.
-
Color Wheel
Description:
Adobe's Color Wheel is a great tool to choose colors.
Benefit:
This tool can be used to choose differnt types of color palettes: Analogous, Monochromatic, Triad, Complementary, Compound, Shades, and custom colors.
-
CDNJS
Description:
At CDNJS they host it all - JavaScript, CSS, SWF, images, etc!... Not just the most popular libraries as in Google CDN or Microsoft CDN!
Benefit:
As they say on their web site: "At CloudFlare, we believe that open source, community-driven projects like CDNJS are the tools upon which the future of the internet will be built. CloudFlare is proud to provide the global CDN infrastructure that will help power that future."
-
Plunker
Description:
Plunker is an online community for creating, collaborating on and sharing your web development ideas.
Benefit:
The Plunker web site discribes Plunker as follows: Design goals- Speed: Despite its complexity, the Plunker editor is designed to load in under 2 seconds.
- Ease of use: Plunker's features should just work and not require additional explanation.
- Collaboration: From real-time collaboration to forking and commenting, Plunker seeks to encourage users to work together on their code.
- Real-time code collaboration
- Fully-featured, customizable syntax editor
- Live previewing of code changes
- As-you-type code linting
- Forking, commenting and sharing of Plunks
- Fully open-source on Github under the MIT license
- And many more to come...
-
JS Console
Description:
JS Console is a cloud-based, cross-platform remote web app debugging utility created by the inimitable Remy Sharp
Benefit:
Great for debugging mobile apps or any other kind of web app, on any browser!
You can view a sample by Jonathan Stark at JS Console Intro
Javascript Frameworks
-
KnockOutJS - MVVM
Description:
Simplyfies client-side data binding in web applications by leveraging the Model-View-ViewModel pattern (MVVM)Benefit:
Simplify dynamic JavaScript UIs by applying the Model-View-View Model (MVVM). The implementation of this design pattern provides observable properties (automatically issue notifications whenever their value changes) that allow a two way binding the Javascript code and the HTML. Because of this pattern, we can the use mocks and unit test each page and its behavior automatically, saving coding on a developer and testing time on the business. -
RequireJS - ADM
Description:
A JavaScript file and module loader. It is optimized for in-browser use, but it can be used in other JavaScript environments, like Rhino and Node. Using a modular script loader like RequireJS will improve the speed and quality of your code.Benefit:
RequireJS enables you to manage large applications by loading the modules in right sequence, using the Asynchronous Module Definition pattern to load them as needed, when needed. The Define keyword is used by RequireJS to define our AMD syntax!- IE 6+ .......... compatible ✔
- Firefox 2+ ..... compatible ✔
- Safari 3.2+ .... compatible ✔
- Chrome 3+ ...... compatible ✔
- Opera 10+ ...... compatible ✔
R.js - A command line tool for running JavaScript scripts that use the Asychronous Module Defintion API (AMD) for declaring and using JavaScript modules and regular JavaScript script files.
It is part of the RequireJS project, and works with the RequireJS implementation of AMD.
r.js is a single script that has two major functions:
• Run AMD-based projects in Node and Rhino.
• Includes the RequireJS Optimizer that combines scripts for optimal browser delivery. - IE 6+ .......... compatible ✔
-
QUnitJS
Description:
QUnit is a powerful, easy-to-use JavaScript unit test suite. It's used by the jQuery, jQuery UI and jQuery Mobile projects and is capable of testing any generic JavaScript code, including itself!Benefit:
This is your 24X7X365 until tester for free. -
JQuery
Description:
jQuery is a fast and concise JavaScript Library that simplifies HTML document traversing, event handling, animating, and Ajax interactions for rapid web development. jQuery is designed to change the way that you write JavaScript.Benefit:
JQuery abstracts the way you manipulate your HTML and the way to call the server's endpoint, amongst many other features, in a cross-browser solution. There are many plug-ins/flavors for JQuery. Here are some useful links:
- JQuery Documentation : All about JQuery.
- JQuery API : The JQuery API itself.
- JQuery UI : jQuery UI provides abstractions for low-level interaction and animation, advanced effects and high-level, themeable widgets, built on top of the jQuery JavaScript Library, that you can use to build highly interactive web applications.
- JQuery Selectors : Original lab by Karl Swedberg Enhanced by Cody Lindley. FYI (ie6 != supported)
- Does Element Exist?
- Classes Over Styles
- Custom Selector
- Find Vs Filter
- Manipulating The DOM
- CDN With Fallback
- Object With Setters
- Using The End Function
- Working With Selectors
- Manipulating The DOM
- On not Bind
- On not Live
- Event Delegation
- Namespace Events
- Events Before DOM Ready
- Method as Event Handler
- Creating Custom Events
- User Input
- Event Triggered?
- JIT Init
- JQuery Documentation : All about JQuery.
-
Infuser
Description:
A Template Loader. As the person who created it says on his page (click button above to go there) ...So – what does infuser do?
- Asynchronously (or synchronously, if you must) retrieves templates and stores them locally in the client once retrieved. Default storage options are in-memory (hash) or in SCRIPT tags (since some engines prefer that). You can write a different storage provider if necessary.
- Provides hooks for a callback to be invoked after you “get” a template, OR if you use the “infuse” method, you have more extensive control about how the template is rendered (if it’s data-driven) and attached to the DOM – including pre- and post-attach options and a render override.
- Provides a hook for telling infuser how your preferred template engine handles binding a model to a template (making it possible for infuser to work with several major template engines).
Benefit:
But wait, why is this useful?
- First, you don’t have to put your template content in your main document (or duplicate it in multiple documents, oh my...!)
- If your template engine expects your templates to be in SCRIPT tags, you don’t have to lose syntax highlighting, etc. in your IDE – you can still place them in their own files with a valid markup extension
- Dovetailing the above point, it can aid in re-usability and maintainability via separation of concerns
- Infuser takes advantage of not only it’s own in-memory storage (once a template has been retrieved, it’s cached), but your browser’s cache is also leveraged (assuming it’s not disabled and assuming the server is returning a 304 response)
- It abstracts away infrastructure/ceremonial code involved in retrieving, binding and rendering templates to the DOM
- infuser.defaults.templatePrefix = "_"
- infuser.defaults.templateUrl = "/Tmpl"
- infuser.defaults.templateSuffix = ".tmpl.html"
- Asynchronously (or synchronously, if you must) retrieves templates and stores them locally in the client once retrieved. Default storage options are in-memory (hash) or in SCRIPT tags (since some engines prefer that). You can write a different storage provider if necessary.
-
QUnitJS
Description:
QUnit is a powerful, easy-to-use JavaScript unit test suite. It's used by the jQuery, jQuery UI and jQuery Mobile projects and is capable of testing any generic JavaScript code, including itself!Benefit:
The library above, infuser.js depends on TrafficCop. It is used internally to prevent multiple simultaneous requests for the same template. -
AmplifyJS
Description:
AmplifyJS is a set of components designed to solve common web application problems with a simplistic API. Amplify's goal is to simplify all forms of data handling by providing a unified API for various data sources. Amplify's store component handles persistent client-side storage, using standards like localStorage and sessionStorage, but falling back on non-standard implementations for older browsers. Amplify's request adds some additional features to jQuery's ajax method while abstracting away the underlying data source.Benefit:
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.
To see a great slide presentation on their page, click here
- Ajax Request Management - amplify.request provides a clean and elegant request abstraction for all types of data, even allowing for transformation prior to consumption.
-
MomentJS
Description:
A 5.5kb javascript date library for parsing, validating, manipulating, and formatting dates.Benefit:
Helps when dealing with the context of time and dates.
Thank you for visiting us!
We use the latest technologies to create Single Page Apps that use responsive desing to work on any device. SPAs deliver a fluid user experience via a thin server architecture which moves complexity from the server to the client. The role of the web server has evolved into a pure data API.
Our ASP.NET MVC 4 Web.API apps are written in C#, HTML 5, Javascript, and LESS/CSS3 using Visual Studio 2012.
We use proven solutions for reoccurring problems via design patterns (RMP, AMD, GoFs, Fowlers) and principles (Robert C. Martin's smells) to create our synergy.
Our agile Test Driven Development approach embraces change, has iterations, and requires constant user feedback.
Our background includes over 30 years working for major local companies in South Florida such as Assurant, Ryder, Exxon and Lennar.
We use many open source Javascript libraries like Amplify, Infuser, JQuery, JQuery UI, Json2, Knockout, Modernizr, Moment, QUnit, R (part of RequireJS), Require, Sammy, Toastr, TrafficCop, and Underscore to name a few.
John Papa's course at PluralSight.com titled Single Page Apps with HTML5, Web API, Knockout and jQuery really explains it all (albeit 6 hours and 20 minute long).
You can see a live demo of his SPA here.
We were fortunate to see John Papa live at NOVA Southeastern University's Code Camp 2013, since we've spent the last 6 months learning from his and many other Pluralsight courses.
It was standing room only, and they had to open up an additional room, but he finally got to explain how SPAs work, and why we should use them.
His work has been our inspiration.
See for yourself and try our site with your personal device.
We hope to hear from you soon.
Carlos F. Montano
CEO & Software Architect
Professional Touch International Inc.
carlos@ptii.org
Synergy Through Knowledge