ASP.NET MVC 1.0 Release Candidate Now Available

Read on:

ASP.NET MVC 1.0 Release Candidate Now Available
ScottGu
Tue, 27 Jan 2009 20:13:09 GMT

 

Today we shipped the ASP.NET MVC 1.0 Release Candidate (RC).  Click here to download it (note: the link just went live so if it isn’t working wait a few minutes for the server you are hitting to refresh).  It works with both Visual Studio 2008 and Visual Web Developer 2008 (which is free).

Today’s RC is the last public release of ASP.NET MVC that we’ll ship prior to the final “1.0” release.  We expect to ship the final ASP.NET MVC 1.0 release next month.

In addition to bug fixes, today’s build includes several new features.  It also includes some refinements to existing features based on customer feedback.  Please read the release notes that ship with the ASP.NET MVC download for full details on all changes.  The release notes include detailed instructions on how to upgrade existing applications built with the ASP.NET MVC Beta to the RC.

Visual Studio Tooling Improvements

The RC includes several new Visual Studio tooling features (above and beyond the existing support in the beta – which I won’t cover here).  These features include:

Add Controller Command

You can now type Ctrl-M, Ctrl-C within an ASP.NET MVC project, or right-click on the /Controller folder and choose the “Add->Controller” context menu item to create new controller classes:

This will cause an “Add Controller” dialog to appear that allows you to name the Controller to create, as well as optionally indicate whether you wish to automatically “scaffold” common CRUD methods:

Clicking the “Add” button will cause the controller class to be created and added to the project:

Add View Command

You can now type Ctrl-M, Ctrl-V within a Controller action method, or right-click within an action method and choose the “Add View” context menu item to create new view templates:

This will cause an “Add View” dialog to appear that allows you to name and create a new view (it is pre-populated with convention-based options).  It allows you to create “empty” view templates, or automatically generate/scaffold view templates that are based on the type of object passed to the view by the Controller action method.  The scaffolding infrastructure uses reflection when creating view templates – so it can scaffold new templates based on any POCO (plain old CLR object) passed to it.  It does not have a dependency on any particular ORM or data implementation.

For example, below we are indicating that we want to scaffold a “List” view template based on the sequence of Product objects we are passing from our action method above:

Clicking the “Add” button will cause a view template to be created for us within the \Views\Products\ directory with a default “scaffold” implementation:

We can then run our application and request the /products URL within our browser to see a listing of our retrieved products:

The RC ships with a number of built-in scaffold templates: “Empty”, “List”, “Details”, “Edit” and “Create” (you can also add your own scaffold templates – more details on this in a moment). 

For example, to enable product editing support we can implement the HTTP-GET version of our “Edit” action method on our Products controller like below and then invoke the “Add View” command:

Within the “Add View” dialog we can indicate we are passing a “Product” object to our view and choose the “Edit” template option to scaffold it:

Clicking the “Add” button will cause an edit view template to be created with a default scaffold implementation within the \Views\Products\ directory:

We can then run our application and request the /products/edit/1 URL within our browser to edit the Product details:

To save edit changes we can implement the HTTP-POST version of our “Edit” action method on our Products controller:

Notice in the code above how in the case of an error (for example: someone enters a bogus string for a number value) we redisplay the view.  The “edit” and “create” scaffold templates contain the HTML validation helper methods necessary to preserve user input and flag invalid input elements in red when this happens:

You’ll rarely end up using a scaffold-created template exactly as-is, and often will end up completely replacing it.  But being able to get an initial implementation up and running quickly, and having an initial view template for your scenario that you can then easily tweak is really useful.

Because the scaffold infrastructure supports scaffolding views against any plain-old CLR object, you can use it with both domain model objects (including those mapped with LINQ to SQL, LINQ to Entities, nHibernate, LLBLGen Pro, SubSonic, and other popular ORM implementations) as well as to create scaffolds with custom Presentation Model/ViewModel classes.

Adding and Customizing Scaffold Templates

ASP.NET MVC’s scaffolding infrastructure is implemented using Visual Studio’s built-in T4 templating architecture (Scott Hanselman has a nice blog post on T4 here). 

You can customize/override any of the built-in ASP.NET MVC scaffold template implementations.  You can also create additional scaffold templates (for example: the “ScottGu Crazy Look” scaffold option) and have them be displayed as options within the “Add View” dialog.

To customize/add scaffold templates at the machine-wide level, open the “C:\Program Files\Microsoft Visual Studio 9.0\Common7\IDE\ItemTemplates\CSharp\Web\MVC\CodeTemplates” folder:

The “AddController” sub-folder contains the scaffold template for the “Add Controller” dialog.  The “AddView” sub-folder contains the scaffold templates for the “Add View” dialog:

The scaffold templates populated within the “Add View” dialog are simply text files that have the “.tt” file-name extension.  These “.tt” text files contain inline C# or VB code that executes when the template is selected. 

You can open and edit any of the existing files to customize the default scaffolding behavior.  You can also add new “.tt” template files – like I have above with the “Scott Crazy Look.tt” file.  When you add a new template file the “Add View” dialog will be updated to automatically include it in the list of available scaffold options:

In addition to customizing/adding template files at the machine level, you can also add/override them at the individual project level.  This also enables you to check-in the templates under source control and easily use them across a team.

You can customize the scaffold templates at a project level by adding a “CodeTemplates” folder underneath your project.  You can then have “AddController” and “AddView” sub-folders within it:

You can override any of the default machine-wide templates simply be adding a “.tt” file with the same name to the project.  For example, above we are overriding the default “Controller.tt” scaffold template used in “Add Controller” scenarios. 

You can add new view-template scaffold files to the list by placing them within the “AddView” folder.  For example, above we added a “Yet Another Crazy Look.tt” view template to our project.  When we use the “Add View” dialog we’ll now see a union of the templates defined at the machine and project level:

Note: When you add “.tt” templates under the \CodeTemplates folder make sure to set the “Custom Tool” property of each of the “.tt” template files to an empty string value within the property grid (otherwise you’ll get an error trying to run it).  You might also need to close and reopen the project to clear a spurious error from the error list.  We’ll be publishing more blog posts that cover creating/customizing scaffolding templates shortly.

Go To Controller / Go To View

The RC build now supports the ability to quickly navigate between the Controllers and Views within your projects. 

When your cursor is within a Controller action method you can type Ctrl-M, Ctrl-G to quickly navigate to its corresponding view template.  You can also perform this same navigation jump by right-clicking within the action method and selecting the “Go To View” menu option:

In the example above we used the “Go To View” command within the “Edit” action method of the ProductsController class.  This will cause the \Views\Products\Edit.aspx view template to be opened and have the default focus within VS:

Within view templates you can also now type Ctrl-M, Ctrl-G to quickly navigate to the view’s corresponding Controller class.  You can also perform this navigation jump by right-clicking within the view template and selecting the “Go To Controller” menu option:

MSBuild Task for Compiling Views

By default when you do a build on an ASP.NET MVC project it compiles all code within the project, except for the code within view template files.  With the ASP.NET MVC Beta you had to roll your own MSBuild task if you wanted to compile the code within view templates.  The ASP.NET MVC RC build now includes a built-in MSBuild task that you can use to include views as part of the project compilation process.  This will verify the syntax and code included inline within all views, master pages, and partial views for the application, and give you build errors if it encounters any problems.

For performance reasons we don't recommend running this for quick compiles during development, but it is convenient to add to particular build configuration profiles (for example: staging and deployment) and/or for use with Build or CI (continuous integration) servers.  Please review the release notes for the steps to enable this.

View Refactoring Support

The names of the files and folders under the \Views application sub-folder will now automatically be updated when you perform controller class rename or action method rename using the “Rename” refactoring command in VS 2008.  VS 2008 will apply the standard convention-based naming pattern to existing view files/folders when the Controller class is updated.

View Improvements

The RC build includes a number of view-specific enhancements that were incorporated based on feedback during the preview releases.

Views without Code-Behind Files

Based on feedback we’ve changed view-templates to not have a code-behind file by default.  This change helps reinforce the purpose of views in a MVC application (which are intended to be purely about rendering and to not contain any non-rendering related code), and for most people eliminates unused files in the project.

The RC build now adds C# and VB syntax support for inheriting view templates from base classes that use generics.  For example, below we are using this with the Edit.aspx view template – whose “inherits” attribute derives from the ViewPage<Product> type:

One nice benefit of not using a code-behind file is that you'll now get immediate intellisense within view template files when you add them to the project.  With previous builds you had to do a build/compile immediately after creating a view in order to get code intellisense within it.  The RC makes the workflow of adding and immediately editing a view compile-free and much more seamless.

Important: If you are upgrading a ASP.NET MVC project that was created with an earlier build make sure to follow the steps in the release notes – the web.config file under the \Views directory needs to be updated with some settings in order for the above generics based syntax to work.

Model Property

With previous builds of ASP.NET MVC, you accessed the strongly typed model object passed to the view using the ViewData.Model property:

The above syntax still works, although now there is also a top-level "Model" property on ViewPage that you can also use:

This property does the same thing as the previous code sample - its main benefit is that it allows you to write the code a little more concisely.  It also allows you to avoid using the ViewData dictionary in cases where you want the view template to only interact with the strongly-typed model passed to it.

Setting the Title

The default master-page template added to new ASP.NET MVC projects now has an <asp:contentplaceholder/> element within its <head> section.  This makes it much easier for view templates to control the <title> element of the HTML page rendered back – and not require the Controller to explicitly pass a “title” parameter to configure it (which was the default with previous ASP.NET MVC builds and we thought questionable from a responsibilities perspective). 

For example, to customize the <title> of our Edit view to include the current product name we can now add the below code to our Edit.aspx template to drive the title directly off of the model object being passed the view:

The above code will then cause the browser to render the title using the Product name at runtime:

In addition to setting the <title> element, you can also use the above approach to dynamically add other <head> elements at runtime.  Another common scenario this is useful with is configuring model/view specific <meta/> elements for search engine optimization. 

Strongly Typed HTML/AJAX Helpers

One of the requests a few people have asked for is the ability to use strongly-typed expression syntax (instead of strings) when referring to the Model when using a View's HTML and AJAX helper objects.

With the beta build of ASP.NET MVC this wasn't possible, since the HtmlHelper and AjaxHelper helper classes didn't expose the model type in their signature, and so people had to build helper methods directly off of the ViewPage<TModel> base class in order to achieve this. 

The ASP.NET MVC RC build introduces new HtmlHelper<TModel> and AjaxHelper<TModel> types that are exposed on the ViewPage<TModel> base class.  These types now allow anyone to build strongly-typed HTML and AJAX helper extensions that use expression syntax to refer to the View's model.  For example:

The HTML form helper extension methods in the core ASP.NET MVC V1 assembly still use the non-expression based string syntax.  The “MVC Futures” assembly released today (which works with the RC) has a few initial implementations of expression-syntax based form helper methods.   We are going to iterate on these a bit longer and then consider adding them into the ASP.NET MVC core assembly in the next release. 

You can of course also add your own helper methods (using either strings or strongly-typed expressions).  The built-in HTML/AJAX helper methods can also optionally be removed (because they are extension methods) if you want to replace or override them with your own

Form Post Improvements

The RC build includes a number of form-post specific enhancements:

[Bind(Prefix=””)] No Longer Required for Common Scenarios

The RC build no longer requires you to explicitly use a [Bind] attribute (or set its prefix value to “”) in order to map incoming form post parameters that do not have a prefix to complex action method parameters.

To see what this means, let’s implement the “Create” scenario for our ProductsController.  We’ll begin by implementing the HTTP-GET version of our “Create” action method.  We’ll do this with code below that returns a View based on an empty Product object:

We can then right-click within our action method, choose the “Add View” command and scaffold a “create” view template that is based on a Product:

Notice above how our Html.TextBox() helper methods are referencing the “ProductName” and “SupplierID” properties on our Product object.  This will generate HTML markup like below where the input “name” attributes are “ProductName” and “SupplierID”:

We can then implement the HTTP-POST version of our “Create” action method. We’ll have our action method take a Product object as a method parameter:

With the ASP.NET MVC Beta we would have had to add a [Bind(Prefix=””)] attribute in front of our Product argument above – otherwise the ASP.NET MVC binding infrastructure would have only looked for form post values with a “productToCreate.” prefix (for example: productToCreate.ProductName and productToCreate.SupplierID) and not found the submitted values from our form (which don’t have a prefix). 

With the RC build, the default action method binders still first attempt to map a productToCreate.ProductName form value to the Product object.  If they don’t find such a value, though, they now also attempt to map “ProductName” to the Product object.  This makes scenarios where you pass in complex objects to an action method syntactically cleaner and less verbose.  You can take advantage of this feature both when mapping domain objects (like our Product object above) as well as with Presentation Model/ViewModel classes (like a ProductViewModel class).

A completed implementation of our Create action method (including basic input type error handling) might look like below:

Now our create action will save the Product object if all values are entered correctly.  When a user attempts to create a Product with invalid Product property values (for example: a string “Bogus” instead of a valid Decimal value), the form will redisplay and flag the invalid input elements in red:

ModelBinder API Improvements

The model binding infrastructure within the ASP.NET MVC Release Candidate has been refactored to add additional extensibility points to enable custom binding and validation schemes.  You can read more about these details in the ASP.NET MVC RC release notes.

Model Binders can also now be registered for interfaces in addition to classes. 

IDataErrorInfo Support

The default model binder with ASP.NET MVC now supports classes that implement the IDataErrorInfo interface.  This enables a common approach to raise validation error messages in a way that can be shared across Windows Forms, WPF and now ASP.NET MVC applications.

Unit Testing Improvements

The ASP.NET MVC RC includes some significant improvements to unit testing:

ControllerContext changed to no longer derive from RequestContext

The RC build includes a refactoring of the ControllerContext class that significantly simplifies common unit testing scenarios.  The ControllerContext class no longer derives from RequestContext and now instead encapsulates RequestContext and exposes it as a property.  The properties of ControllerContext and its derived types are also now virtual instead of sealed – making it significantly easier to create mock objects.

To see how this helps, let’s consider an action method like below that uses both the “Request” and “User” intrinsic objects:

Testing the above action method with previous ASP.NET MVC builds would have required mocking RequestContext and ControllerContext (with some non-obvious constructors that also brought in a RouteData object).

With the RC build we can now unit test it like below (using Moq to mock a ControllerContext for our Controller that allows us to simulate the Request.IsAuthenticated and User.Identity.Name properties):

The refactoring improvements made help out not just with testing Controller actions – but also help with testing filters, routes, custom actionresult types, and a variety of other scenarios.

AccountsController Unit Tests

The ASP.NET MVC Project Template included with the RC build now adds 25 pre-built unit tests that verify the behavior of the AccountsController class (which is a controller added to the project by default to handle login and account management scenarios).  This makes refactoring/updating AccountsController easier.  The AccountsController implementation has also been modified to more easily enable non-Membership Provider based credential systems to be integrated.

Cross Site Request Forgery (CSRF) Protection

Cross-site request forgery (CSRF) attacks (also referred to as XSRF attacks) cause users of a trusted browser agent to take unintended actions on a site.  These attacks rely on the fact that a user might still be logged in to another site.  A malicious Web site exploits this by creating a request to the original site (for example: by linking to a URL on the site using a <img src=””/> element on the hacker site). The request is made using the user’s browser and thus with the user’s authentication token and credentials. The attacker hopes that the user’s authentication or session cookie is still valid and if so, the attacker can sometimes take disruptive action.  You can learn more about this hacking technique here.

The ASP.NET MVC RC now includes some built-in CSRF protection helpers that can help mitigate CSRF attacks.  For example, you can now use the Html.AntiForgeryToken() helper to render a hidden input token within forms:

This helper issues a HTTP cookie and renders a hidden input element into our form.  Malicious web-sites will not be able to access both values.

We can then apply a new [ValidateAntiForgeryToken] attribute onto any action method we want to protect:

This will check for the existence of the appropriate tokens, and prevent our HTTP-POST action method from running if they don’t match (reducing the chance of a successful CSRF attack).

File Handling Improvements

The ASP.NET MVC RC includes a number of file handling enhancements:

FileResult and File() helper method

The RC build adds a new FileResult class that is used to indicate that a file is being returned as an ActionResult from a Controller action method.  The Controller base class also now has a set of File() helper methods that make it easy to create and return a FileResult.

For example, let’s assume we are trying to build a photo management site.  We could define a simple “Photo” class like below that encapsulates the details about a stored Photo:

We could then use the new File() helper method like below to implement a “DisplayPhoto” action method on a PhotoManager controller that could be used to render the Photo out of a database store.  In the code below we are passing the File() helper the bytes to render, as well as the mime-type of the file. If we pointed a <img src=””/> element at our action method URL the browser would display the photo inline within a page:

If we wanted an end-user to be able to download the photo and save it locally, we could implement a “DownloadPhoto” action method like below.  In the code below we are passing a third parameter – which will cause ASP.NET MVC to set a header that causes the browser to display a “Save As…” dialog which is pre-populated with the filename we’ve supplied:

When a user clicks a link to the /PhotoManager/DowloadPhoto/1232 URL they’ll be prompted to save the picture:

File Uploading Support

The RC build also includes built-in model-binder support for uploaded files and multi-part mime content. 

For example, we could have a <form> whose enctype attribute is set to “multipart/form-data” perform a post to the /PhotoManager/UploadPhoto URL.  If a <input type=”file” name=”fileToUpload”/> element was within the form it would cause the file selected by the end-user to be passed to our action method as an HttpPostedFileBase object:

We could then use the HttpPostedFileBase object to get access to the raw bytes of the uploaded file, its mime-type, and optionally save it to a database or disk.

AJAX Improvements

The ASP.NET MVC RC includes a number of AJAX enhancements:

jQuery Intellisense Files included within ASP.NET MVC Project Template

Newly created ASP.NET MVC projects now include both the standard jQuery library (both full and compressed versions), as well as the –vsdoc intellisense documentation file used by Visual Studio to provide richer intellisense support for it (you can learn more about this here):

This enables rich jQuery JavaScript intellisense within client-script blocks and JavaScript files:

Today’s RC build ships jQuery 1.2.6.  We are planning to ship the upcoming jQuery 1.3.1 release for the final ASP.NET MVC 1.0 release, and will include an updated JavaScript intellisense file for it. 

Request.IsAjaxRequest Property

The Request.IsAjaxRequest property can be used to detect whether a request is being sent from an AJAX call on the client (and is useful for scenarios where you want to gracefully degrade if AJAX is not enabled).  The logic within this method was updated with the RC to now recognize the “X-Requested-With” HTTP header (in addition to the form field sent by ASP.NET AJAX).  This is a well known header sent by JavaScript libraries such a Prototype, jQuery, and Dojo – and now enables a unified way to check for AJAX within an ASP.NET MVC request. 

JavaScriptResult ActionResult and JavaScript() helper method

The Controller base class now has a JavaScript() helper method that returns a new ActionResult class of type JavaScriptResult.  This supports the ability to return raw JavaScript that will then be executed on the client by the built-in ASP.NET MVC helper methods.  This can be useful for scenarios where you want to cause conditional JavaScript to execute on the client based on server logic.

Summary

We are pretty excited to be in the final “home stretch” of ASP.NET MVC V1.  Please report any issues you find with the RC build as soon as possible so that we can get them resolved for the final release.  The team plans to carefully monitor feedback over the next few weeks, and assuming no big issues come up ship the official V1 build next month.

Hope this helps,

Scott

ASP.NET MVC 1.0 Release Candidate Now Available
ScottGu
Tue, 27 Jan 2009 20:13:09 GMT

My MVVM article in MSDN Magazine

 

Finally!  After spending more than 100 hours over several months working on an article for MSDN magazine, it is now published!  The article is about using the Model-View-ViewModel (MVVM) design pattern to create WPF applications.  My ‘WPF Apps With The Model-View-ViewModel Design Pattern‘ article is in the February 2009 issue of MSDN Magazine.  I think it is by far my best, and most important, article yet.   Big thanks go to John Gossman for giving me an in-depth tech review.

Enjoy!

My MVVM article in MSDN Magazine
Josh Smith
Tue, 27 Jan 2009 22:05:35 GMT

A Guide to Learning ASP.NET MVC Release Candidate 1

A Guide to Learning ASP.NET MVC Release Candidate 1
Stephen Walther
Tue, 27 Jan 2009 23:05:10 GMT

Now that the ASP.NET MVC Release Candidate is available for download, how do you learn how to start using it to build applications? Here’s a guide to resources for learning about ASP.NET MVC Release Candidate 1.

First, read Scott Guthrie and Phil Haack’s blog entries which discuss the new features added with this release:

Next, navigate to the http://www.asp.net/mvc site -- the official Microsoft website for all things ASP.NET MVC -- and read the 14 new and updated tutorials:

Stephen Walther builds an entire ASP.NET MVC application from start to finish. This tutorial is a great introduction for people who are new to the ASP.NET MVC Framework and who want to get a sense of the process of building an ASP.NET MVC application.

Confused about Models, Views, and Controllers? In this tutorial, Stephen Walther introduces you to the different parts of an ASP.NET MVC application.

Learn about the differences between ASP.NET MVC application and ASP.NET Web Forms applications. Learn how to decide when to build an ASP.NET MVC application.

Learn how the ASP.NET MVC framework processes a browser request step-by-step.

In this tutorial, you learn how to use ASP.NET MVC, and URL Routing, with different versions of Internet Information Services. You learn different strategies for using ASP.NET MVC with IIS 7.0 (classic mode), IIS 6.0, and earlier versions of IIS.

By taking advantage of view master pages, you can create a common layout for the pages in your ASP.NET MVC application. In this tutorial, Stephen Walther introduces you to view master pages. You learn how to create a two-column page layout.

In this tutorial, Stephen Walther explains how you can pass database data to a view master page. He demonstrates how to create an Application controller that modifies the view data returned by every controller action within an ASP.NET MVC application.

In this tutorial, you are introduced to action filters. You learn how action filters work and how to implement custom action filters. We create a custom action filter that logs the stages of processing a controller action and action result to the Visual Studio Output window.

In this tutorial, you learn how you can dramatically improve the performance of your ASP.NET MVC web applications by taking advantage of output caching. You learn how to cache the result returned from a controller action so that the same content does not need to be created each and every time a new user invokes the action.

In this tutorial, you learn how to use ASP.NET MVC with the Microsoft Entity Framework. You learn how to use the Entity Wizard to create an ADO.NET Entity Data Model. Over the course of this tutorial, we build a web application that illustrates how to select, insert, update, and delete database data by using the Entity Framework.

Learn how to use the [Authorize] attribute to password protect particular pages in your MVC application. You learn how to use the Web Site Administration Tool to create and manage users and roles. You also learn how to configure where user account and role information is stored.

Learn how to use Windows authentication in the context of an MVC application. You learn how to enable Windows authentication within your application’s web configuration file and how to configure authentication with IIS. Finally, you learn how to use the [Authorize] attribute to restrict access to controller actions to particular Windows users or groups.

Learn how to mix dynamic and cached content in the same page. Post-cache substitution enables you to display dynamic content, such as banner advertisements or news items, within a page that has been output cached.

Learn how to take advantage of SiteMaps to describe the navigational structure of your website. In this tutorial, you learn how to create a custom Menu HTML helper that generates menu links from a SiteMap automatically.

The first tutorial should be especially useful because it contains a step-by-step walkthrough of building a database-driven web application with ASP.NET MVC. In particular, the tutorial discusses the new tooling support in Visual Studio that makes it easy to add new controllers and views.

The Power of WordPress and jQuery: 25+ Useful Plugins

jQuery is ideal because it can create impressive animations and interactions while being simple to understand and easy to use. WordPress awesomeness lies in its fact that it can be customized to power any type of site you like! But what happens when you combine the power of jQuery with WordPress, the possibilities are infinite.

This article will share some best practices, examples & Plugins for using the most popular Javascript framework to create unobtrusive, accessible DOM scripting effects for your WordPress site.

Let’s take a look at 25 26 useful, yet rather unknown WordPress Plugins and tutorials using jQuery to its fullest potential.

Don’t Forget to…

subscribe to our RSS-Feed and visit my twitter page : nourayehia get notified when our next post is here.

1. Infinite Scroll

Using jQuery With WordPress: 30+ Encrideble Plugins


Infinite scroll has been called autopagerize, unpaginate, endless pages. But essentially it is pre-fetching content from a subsequent page and adding it directly to the user’s current page. There is a little known feature in the .load() method that lets you specify the CSS selector of the html you want to include. jQuery will load in any local URL, then parse the html and grab only the elements you’ve defined with your selector.

Check Out a live demo here

2. jQuery Lightbox

Using jQuery With WordPress: 30+ Encrideble Plugins


This is the Wordpress’s version of the jQuery Lightbox Plugin Used to overlay images on the current page, perfectly working with Wordpress 2.2 or up, and fully compatible with K2!

Download Plugin from here

3. WordPress post information plugin

Using jQuery With WordPress: 30+ Encrideble Plugins


If real estate is a priority in your theme then this plugin can help by showing post meta information on demand by using a JavaScript toggle function.

Download Plugin from here

4. Snazzy Archives

Using jQuery With WordPress: 30+ Encrideble Plugins


Snazzy Archives is a visualization plugin for your WordPress site featuring an unique way to display all your posts. You can select different layouts and special effects. Main features of Snazzy Archives are: Unique visual presentation of blog posts, Will work out of the box with all features, Posts are scanned for images and youtube videos and shown together with number of comments, Different editable layouts (HTML and CSS), Special effects using jQuery and more.

Download Plugin from here

5. J Post Slider

Using jQuery With WordPress: 30+ Encrideble Plugins


Show your post in fancy jQuery box, rotating images, with show-up text box with post description. Mousover stop the animation, and user can click on post link anytime.

Download Plugin from here

6. WP-Imagefit

Rather than relying on a CSS or HTML-driven approach to resize large or wide images, WP-Imagefit relies on Javascript to proportionately resize images based on the width of the containing column.

Download Plugin from here

7. WP Wall

Using jQuery With WordPress: 30+ Encrideble Plugins


WP Wall is a “Wall” widget that appears in your blog’s side bar. Readers can add a quick comment about the blog as a whole, and the comment will appear in the sidebar immediately, without reloading the page.
All comments are internally handled by WordPress so that means you have normal comment moderation, SPAM protection and new comment notification.

Download Plugin from here

8. jQuery Comment Preview

Using jQuery With WordPress: 30+ Encrideble Plugins


Live comment preview without page reboot using a simple HTML-editor.

Download Plugin from here

9. Insights

Using jQuery With WordPress: 30+ Encrideble Plugins


Insights brings a powerful new way to write your blog posts. It increases productivity and at the same time quality of your posts by using dynamic AJAX interface which loads the relevant information to your post in just a few seconds. Insights performs following functions in real-time: Interlink your posts, Insert Flickr images, Insert Youtube videos, Search Wikipedia, Search Google, Insert a Google Map and more.

Download Plugin from here

10. µAudio Player

Using jQuery With WordPress: 30+ Encrideble Plugins


µAudio is a slim (450 Bytes!), fast plugin to create a flash mp3 player when mp3 links are clicked. In order to reduce clutter and file transfer, the links are unmodified until they are clicked, at which point a div with the player is faded in after the link. A second click on the link fades the player back out.

Download Plugin from here

11. SimpleModal Contact Form

Using jQuery With WordPress: 30+ Encrideble Plugins


SimpleModal Contact Form (SMCF) is an Ajax powered modal contact form. It utilizes the jQuery JavaScript library and the SimpleModal jQuery plugin. SMCF has options to include certain contact form elements, like a Subject field and “Send me a copy” option for the sender.

Download Plugin from here

12. Events Calendar

Using jQuery With WordPress: 30+ Encrideble Plugins


Events-Calendar is a diverse replacement for the original calendar included with WordPress adding many useful functions to keep track of your events.

Download Plugin from here

13. µMint Plugin

Using jQuery With WordPress: 30+ Encrideble Plugins


µMint is a slim plugin to integrate statistics from Shaun Inman’s Mint statistics package into Wordpress.

Download Plugin from here

14. Shockingly Big IE6 Warning

Using jQuery With WordPress: 30+ Encrideble Plugins


The Shockingly Big IE6 Warning is a plugin that shows a warning message alerting the user why is bad to use IE6, the security risk and the bad compatibility of Web Standards.

Download Plugin from here

15. WP-Slimbox2 Plugin

Using jQuery With WordPress: 30+ Encrideble Plugins


A WordPress implementation of the stellar Slimbox2 script by Christophe Beyls (an enhanced clone of the Lightbox script) which utilizes the jQuery library to create an impressive image overlay with slide-out effects. Almost all options are configurable from the administration panel.

Download Plugin from here

16. Live Blogroll

Using jQuery With WordPress: 30+ Encrideble Plugins


Live Blogroll will make your blogroll livelier. It will show a number of ‘recent posts’ for each link in your Blogroll using Ajax. When the user hovers the mouse above the link, RSS feed from the site is automatically discovered and a number of recent posts is shown dynamically in a box.

Download Plugin from here

17. PhotoXhibit

Using jQuery With WordPress: 30+ Encrideble Plugins


This plugin uses photos from your Flickr, Picasa, and/or SmugMug accounts as well as allows you to upload and build Albums to help you build inviting Photo Galleries on your site using the most popular JavaScript based gallery plugins. This plugin is not yet compatible with WordPress2.7

Download Plugin from here

18. Wordpress Sidebar Turned Apple-Flashy Using jQuery UI

Using jQuery With WordPress: 30+ Encrideble Plugins


A tutorial to show you how to create Accordion plugin in jQuery UI to get the sidebar on the Apple Startpage and be able to show and hide it at your pleasure as well.

Check Out the demo here

19. How To Create WordPress Tabs Using jQuery

Tabbed sidebar elements makes users simply click a tab to quickly access various parts of your site. This tutorial will teach you how to do this in your WordPress blog using jQuery.

Check Out the demo here

<div class="tabbed">
<!-- The tabs -->
<ul class="tabs">
<li class="t1"><a class="t1 tab" title="<?php _e('Tab 1'); ?>"><?php _e('Tab 1'); ?></a></li>
<li class="t2"><a class="t2 tab" title="<?php _e('Tab 2'); ?>"><?php _e('Tab 2'); ?></a></li>
<li class="t3"><a class="t3 tab" title="<?php _e('Tab 3'); ?>"><?php _e('Tab 3'); ?></a></li>
<li class="t4"><a class="t4 tab" title="<?php _e('Tab 4'); ?>"><?php _e('Tab 4'); ?></a></li>
</ul>

<!-- tab 1 -->
<div class="t1">
<!-- Put what you want in here. For the sake of this tutorial, we'll make a list. -->
<ul>
<li>List item</li>
<li>List item</li>
<li>List item</li>
<li>List item</li>
<li>List item</li>
</ul>
</div>

<!-- tab 2 -->
<div class="t2">
<!-- Or, we could put a paragraph -->
<p>This is a paragraph about the jQuery tabs tutorial.</p>
</div>

<!-- tab 3 -->
<div class="t3">
<!-- Or, we could add a div -->
<div>Something needs to go in here!</div>
</div>

<!-- tab 4 -->
<div class="t4">
<!-- Why not put a few images in here? -->
<p>
<img src="image.gif" alt="Sample" />
<img src="image.gif" alt="Sample" />
<img src="image.gif" alt="Sample" />
</p>
</div>

</div><!-- tabbed -->


Using jQuery With WordPress: 30+ Encrideble Plugins






Another great tutorial by Nettuts teaching us how to Create A Tabbed Interface Using jQuery.



Check Out a live demo here



20. jQuery Reply to Comment


Add “reply” and “quote” features on each comment list. If you have jQuery installed on you blog, this Plugin add two link in each comments list (on single page). This plugin can auto include jQuery from Google Ajax API repository.



Download Plugin from here



21. My Page Order


My Page Order allows you to set the order of pages through a drag and drop interface. The default method of setting the order page by page is extremely clumsy, especially with a large number of pages. jQuery is used a smooth for drag and drop effect.



Download Plugin from here



22. Wordpress Featured Post Slideshow


Using jQuery With WordPress: 30+ Encrideble Plugins






Learn how to create an animated featured posts section in WordPress



Download Plugin from here



23. GD Star Rating plugin


Using jQuery With WordPress: 30+ Encrideble Plugins






GD Star Rating plugin allows you to set up rating system for posts, pages and comments in your blog. You can set many options for displaying the rating stars, and also add widgets into the sidebars for displaying top ratings and other statistics generated by the plugin.



Download Plugin from here



24. Create a featured posts slider in Wordpress using jFlow


Using jQuery With WordPress: 30+ Encrideble Plugins






Many premium themes feature cool featured content sliding areas, where the latest posts appear. There is one such plugin, built around the Mootools library, but in this tutorial you will learn how to do this using jFlow jQuery plugin. It will also automatically scroll. Of course, this can easily be modified to use the navigation buttons as well.



Demo of the jFlow plugin can be seen here



25. Adding Form Validation to WordPress Comments using jQuery


Using jQuery With WordPress: 30+ Encrideble Plugins






When it comes to simpler user experience, having your form validation happen instantly on the same page is a lot cleaner than reloading pages and possibly losing some form content. In this tutorial you will learn how to use jQuery to do some instant checking on an example comment form.



Demo can be seen here



26. Using jQuery to liven up your WordPress login


Using jQuery With WordPress: 30+ Encrideble Plugins






A quick method of simplifying the clients login process using jQuery lightbox.



Demo can be seen here








The Power of WordPress and jQuery: 25+ Useful Plugins & Tutorials


Noupe


Mon, 26 Jan 2009 15:21:34 GMT

Le nouveau guide d'architecture Mobile de poche

Le 14 janvier dernier, le guide d'architecture Mobile de poche (traduction libre de:The Mobile Architecture Pocket Guide) a été redistribuer dans sa nouvelle version 1.1.

Le guide d'architecture Mobile de poche  fournit une vue d'ensemble et des conseils normatifs pour concevoir des applications Mobiles sur la plate-forme de .NET.  

Ce guide fait parti  des Microsoft Best patterns & practices et  est maintenu dans le projet p&p: Application Architecture Guide 2.0 Knowledge Base.

Vous pouvez télécharger ce guide ici

Les changements principaux de cette mise à jour sont:

  • Mieux adapter le guide pour la réalité du Mobile.
  • Amélioré la figure de l'application Mobile canonique.
  • Élaboré sur le "pourquoi" et raisonnement de certaines décisions.
  • Élaboration sur manipuler les connections.

~ Franky

Références:

Web Design Resources I Use

Read on : Ajaxian Blog

This website contains the content, tools and resources I use to create websites: Javascript, Grid stuff, Icons, CSS, Apps, Flash. All the content listed here is free for commercial use unless marked as "payware."





read more | digg story

Recherche du parfait lecteur de flux RSS

Je ne sais pas pour vous, mais moi j'aime bien avoir ma dose de blogues quotidienne. J'ai essayé plusieurs applications et j'ai enfin trouvé le lecteur de flux (Rss reader) de rêve: FeedDemon.
Ce que je cherchais est un lecteur qui puisse être utilisé en mode déconnecté avec les images. De plus, je voulais qu'il soit une façon de se synchroniser sur plusieurs postes. J’ai essayé plusieurs applications, voici donc le récit de mes essaies.

 

1- Google Reader

image Bien sûr j’ai essayé Google Reader.  J’ai beaucoup (et j’utilise encore) les Shared Items pour partager des nouvelles à mes “friends” .  Disponible de partout, car il est une application web c’était merveilleux…

Cependant, le mode déconnecté ne permet pas d'avoir les images.  De plus, il ne permet pas de spécifier ou on sauvegarde les fichiers.

 

 

2-  Scoop

image Scoop est une application qui utilise la technologie AIR d’Adobe. IL est donc portable sur tous les systèmes et il est très beau. Lors de la mise à jour des fils, l’application semble geler. L’application étant jeune, il faut surveiller la sortie de la prochaine version.

 

 

3- Omea Reader

image Très complet comme toutes les application de la compagnie JetBrains, Omea Reader est rapide, l’interface est super et configurable.  C’est le mode déconnecté encore une fois qui est le problème.  Enfin selon ce que je cherchais… ;)

 

 

 

 

4- FeedDemon - NewsGator

FeedDemon est légé et l’interface est soignée.  Il offre une excellente gestion des posts.  Vous pouvez “flager” certaines nouvelles pour y revenir plus tard.  Vous pouvez également les mettres dans un répertoire  pour les conserver (clipings).

 

 

 

 

 

Il permet aussi de facilement partager les posts que vous désirez en offrant un lien avec del.cio.us et Digg.  Ou si vous avez Windows Live Writer il peut automatiquement créer un post sur votre blog concernant la nouvelle que vous lisez.

 

 

 

Il offre plusieurs options pour le mode déconnecté, pour faire le ménage des anciens post, faire des recherches, avoir de rapports sur vos lecture et vous avez même une option de FeedStation pour le téléchargement des vidéos et autre média.

image De plus, il offre la possibilité de synchroniser avec NewsGator l’équivalent de FeedDemon mais online.  De ce fait, vous pouvez continuer de lire vos nouvelles sur n’importe quel ordinateur.  Plusieurs options pour la synchronisation sont possibles, donc vous pouvez choisir quel fils seront inclus ou exclus.

Comme si ce n’était pas assez NewsGator offre d’autres produits!  Tel que:

 

  • NetNewsWire pour iPhone
  • NewsGator Go! pour Mobile
  • NetNewsWire pour Mac
  • NewsGator Inbox pour Microsoft Outlook
  • Free Tools pour amélioré votre l’expérience newsgator ;)

 

Voilà, si vous connaissez d’autre application laisser un commentaire!

 

~ Franky

 

Liens intéressants:

Lego announces line of digital cameras, PMPs, etc. for your teeny human friends

It shouldn’t be only for kids ;p


Lego's just announced that it's teamed with Digital Blue to bring out a line of digital cameras, PMPs, and walkie talkies for children. As you can see, the products will have the familiar "Lego" look to them (though not constructed out of actual bricks), and though we haven't heard anything in the way of specs yet, they're said to be arriving this summer with prices ranging from $19 - $60. Our opinion of these is currently hanging out in the "not really excited" file, but outfit these suckers a set of wheels and we'll probably be sold. Second photo after the break.

Continue reading Lego announces line of digital cameras, PMPs, etc. for your teeny human friends

Filed under: Digital Cameras, Portable Audio

Lego announces line of digital cameras, PMPs, etc. for your teeny human friends originally appeared on Engadget on Tue, 13 Jan 2009 02:01:00 EST. Please see our terms for use of feeds.