Smashing Magazine we smash you with the information that will make your life easier. really.

50 Fresh JavaScript Tools That Will Improve Your Workflow

By Smashing Editorial, June 21st, 2009 in Developer's Toolbox | 50 Comments

JavaScript is an integral part of the RIA revolution. JavaScript allows developers to create rich and interactive web interfaces and establish asynchronous communication with servers for constantly up-to-date data without a page refresh.

Many things that were once accomplished using Flash objects can now be built using JavaScript - with the added benefit that it is free, typically more web and mobile accessible under most circumstances using best practices for development techniques, and without the need to use proprietary software for development.

Though JavaScript has been around for a while, new tools, techniques, and information are constantly being pumped out to continually push the technology into greater heights. In this article, we wish to share with you a huge list of fresh and new tools and resources that JavaScript developers will find useful and informative.

Here are a few other posts that you might find interesting:
Read more...
70 New, Useful AJAX And JavaScript Techniques

By Noura Yehia, March 8th, 2009 in Developer's Toolbox | 174 Comments

As the Web grows and becomes more dynamic, more and more websites have user-generated content and tools that greatly improve the user experience in terms of usability and accessibility. Interactive solutions for lightboxes, form validation, navigation, upload, auto-complete, image cropping, slideshows, tool tips, sliders and tables are being developed that use nifty JavaScript and AJAX scripts.

When using these, developers have to carefully consider many subtle techniques to help users get things done. In this article, we present 70 new and useful JavaScript and AJAX techniques, all of which are of the highest quality and are more or less easy to configure. You will also find some very useful but better known techniques to use on almost any project you work on.

Read more...
40 Useful JavaScript Libraries

By Umut Muhaddisoglu, March 2nd, 2009 in Developer's Toolbox | 100 Comments

Popular JavaScript libraries such as jQuery, MooTools, Prototype, Dojo and YUI can be great for accomplishing common JavaScript tasks. These libraries provide many functions, whether the matter is related to events or effects or AJAX. And if one of these libraries can’t do the job, a plug-in probably exists that can.

Such flexibility is great but sometimes comes with a penalty (the size of JavaScript files being one of them). Although adopting a well-known JavaScript library is usually a wise decision, you may want to perform a task that can be accomplished by a more lightweight library dedicated exclusively to that task or that is not supported by the more popular JavaScript libraries.

Below, we present 40 stand-alone JavaScript libraries that serve specific purposes. These are not all the ones out there, but every Web designer or developer will find something helpful here.

Read more...
50 Excellent AJAX Tutorials

By Steven Snell, October 16th, 2008 in Tutorials | 120 Comments

AJAX provides Web developers with plenty of opportunities to enhance the user experience and improve the performance of their websites. There are countless ways that AJAX can be used, and fortunately there are plenty of good and useful AJAX tutorials out there to help you with your own implementation.

This post serves as a collection of useful tutorials on working with AJAX in a wide variety of ways. You’ll find tutorials on working with forms, building shopping carts, creating chat features, working with log-ins and usernames and much more.

For more on AJAX see:
Read more...
60 More AJAX- and Javascript Solutions For Professional Coding

By Smashing Editorial, April 15th, 2008 in Developer's Toolbox | 163 Comments

When it comes to design of modern web-applications, Ajax is considered as a standard approach. Interactive solutions for lightboxes, form validation, navigation, search, tooltips and tables are developed using Ajax libraries and nifty Ajax scripts. Ajax is useful and powerful. However, when using Ajax, one should keep in mind its drawbacks in terms of usability and accessibility. With an extensive use of Ajax, you can easily confuse your visitors offering too much control and too many features.

Nevertheless, it's important to know what's possible, particularly since you can develop new ideas further, improving the quality of your web applications. Since our last article 80+ AJAX-Solutions For Professional Coding many things have changed — new scripts were introduced, new creative solutions were developed, new robust development kits have been released. They all are supposed to serve a better user experience and provide more comfort for web-developers.

This post presents over 60 new useful Ajax scripts, libraries and solutions which you can use in your future projects. License agreements can change from time to time — please read them carefully before using the script in a commercial web-application.

You might want to consider checking out the following related posts:
- 30 Scripts For Galleries, Slideshows and Lightboxes presents scripts of impressive slideshows, lightboxes and galleries you can use for effective presentations of your images,
- 40+ Tooltips Scripts With AJAX, JavaScript & CSS with handy tooltips scripts for intuitive and well-designed visual clues,
- Data Grids with AJAX, DHTML and JavaScript with free solutions for data grids, developed with AJAX, DHTML and/or JavaScript.
Please notice: the overview presented below is not just a yet-another-one-collection of Ajax-scripts. It's a collection of really useful ones, the ones you can use in almost every project you'll be working on.

Read more...
Frameworks Round-Up: When To Use, How To Choose?

By Smashing Editorial, January 4th, 2008 in Developer's Toolbox | 114 Comments

by Chris Poteet

Software frameworks provide developers with powerful tools to develop more flexible and less error-prone applications in a more effective way. Software frameworks often help expedite the development process by providing necessary functionality “out of the box”. Such things include user/role management, data access, caching, and much more. These frameworks aid in helping you focus on the more important details of design and even project management by alleviating the need to reinvent the wheel for common development needs.

There are frameworks that cover specific areas of application development such as JavaScript/CSS frameworks that target the presentation (view) layer of the application, and there are others that handle more of the dynamic aspects of the application. Some include both!

In the following we present an overview of most popular web application frameworks; we cover both server-side (PHP, Java, C#, Ruby) and client-side approaches (JavaScript, CSS).

You can also take a look at
- an extensive comparison of web application frameworks on Wikipedia. The article provides a growing list of various frameworks and features they have to offer;
- the review of existing CSS Frameworks we've presented few months ago.
Read more...
Web Applications: Improve Your Workflow

By Mark Bloomfield, August 22nd, 2007 in Developer's Toolbox | 56 Comments

by Mark Bloomfield In a world where applications are taking themselves online, there's a host of amazing web applications that perform all types of services and cater for just about any industry. Thanks to the joys of technologies like AJAX, Rails, PHP, XML powered Flash and the like, there's no limit to the functionality that can be packed into an online web application. In the coming weeks, we are going to be highlighting a number of these web applications. This week, it's all about the workflow - tools that make running your business even easier. Granted, there are probably hundreds of applications that can help you with various aspects of your business. But for now, we're going to look at project management and invoicing.
Whilst there's loads of project management tools available on the web, there's only a handful that are actually worth being called management tools. Even fewer are actually useful and worth signing up for.
Read more...
80+ AJAX-Solutions For Professional Coding

By Smashing Editorial, June 20th, 2007 in Developer's Toolbox | 420 Comments

Web-developers can create amazing web-applications with AJAX. Stikkit, Netvibes, GMail and dozens of further web-projects offer a new level of interactivity we've used to give up the idea of. Modern web-applications can be designed with enhanced user interfaces and functionalities, which used to be the privelege of professional desktop-applications. AJAX makes it possible to create more interactive, more responsive and more flexible web-solutions. And it's the first step towards rich internet applications of the future.

Asynchronous JavaScript and XML isn't a new programming language, as it is often mistakingly called. Basically, AJAX is a set of XHTML, CSS, DOM, XMLHttpRequest and XML, put together and used together for the same purpose - to improve the user-server-interaction.
- To understand the idea behind AJAX, you should read Jesse James Garrett's article "Ajax: A New Approach to Web Applications" and Wikipedia: Ajax;
- to learn the basics of AJAX, you should go through some AJAX tutorials we've presented previously;
- to learn more about professional CSS coding, you should visit 70 Expert Ideas For Better CSS Coding;
- and to get a powerful and handy CSS-Toolbox for your future projects, you can use 53 CSS-Techniques You Couldn't Live Without.
In this article we'd like to present a list of over 90 useful AJAX-based techniques you should always have ready to hand developing AJAX-based web-applications. Auto-completion, instant field editing, menus, calendars, interactive elements, visual effects, animation, basic javascripts, as well as an extensive developer's suite should give you a useful and powerful toolbox you can use every day, without a need to go through hundreds of AJAX-related bookmarks. You may also want to take a look at the article 60 More Ajax and Javascript Solutions For Professional Coding.
Read more...
40+ Tooltips Scripts With AJAX, JavaScript & CSS

By Smashing Editorial, June 12th, 2007 in Developer's Toolbox | 229 Comments

Web users love informative clues. Whatever questions and misunderstandings might occur - delivering precise answers immediately is the primary task a responsive user interface should be able to cope with. To do that, developers have to consider subtle and well-thought tooltips - used correctly, they can greatly improve user experience and help users to get things done. In Web such "responsive" hints can be provided by tooltips. E.g., unclear input fields in web forms are perfect examples of a situation you might be willing to use a tooltip for. We'd like to thank Jurgen Koller for compiling an extensive list of tooltip scripts we've stumbled upon during our search. It gives many useful pointers, but we've managed to find some more. You might be willing to use Koller's post as a quick reference for your search.
Let's take a look at 43 handy tooltips scripts for intuitive and well-designed visual clues. It's nice to have them all in one place, once you need them. It's nice to be able to find them, once you don't have time to search for them.
Read more...
Data Grids with AJAX, DHTML and JavaScript

By Smashing Editorial, May 30th, 2007 in Developer's Toolbox | 111 Comments

In order to be presented effectively, information needs structure. The more intuitive data structure is designed, the better users can understand the content. Consequently, the data can be scanned and extracted in a more meaningful and systematic way. Table is a perfect example of a well-structured data presentation, which is easy to analyze and easy to handle. Used for its original purpose - to present data, not to style it -, it can convey ideas effectively. And this is what most of us are actually trying to achieve in the Web. Furthermore, the user experience can be greatly enhanced with further optional functionalities - such as sorting, filtering and fast editing. What solutions can you use to provide them in your tables? Few months ago we've covered the basics of semantically correct CSS-based tables - among other things, we've presented solutions for Zebra tables and few tables with sorting and filtering functionalities; but we've missed some important ones. Now it's time to get this right and list the rest - 17 free solutions for data grids, developed with AJAX, DHTML and/or JavaScript. In a brief and descriptive overview.
Read more...
30 Scripts For Galleries, Slideshows and Lightboxes

By Smashing Editorial, May 18th, 2007 in Developer's Toolbox | 297 Comments

Family photos, vacation snapshots or creative artistic works: whatever images you have to present, you can present them in a variety of ways. On a big screen, in slide shows or in a thumbnails gallery. However, to convey the message of presented data effectively, it's important to offer it in an attractive and intuitive way. Furthermore, the presentation itself can make images more valuable and simplify the browsing through hundreds of slides. There are literally hundreds of solutions for web-based galleries out there. We've selected 30 scripts of impressive slideshows, lightboxes and galleries you can use for effective presentations of your images. Most of them don't have any technical requirements, so you can use them right away. Let's take a look.
Read more...
14 Tab-Based Interface Techniques

By Smashing Editorial, April 18th, 2007 in Developer's Toolbox | 120 Comments

The popularity of tabs, well-known from tabbed document interfaces (TDI), is rapidly growing, challenging the creativity of both developers and designers. The development of efficient and user-friendly interfaces is quite hard to deal with, and tabs can guarantee a quick access to information without need to open and close dozens of windows at the same time. Tabs-based interfaces allow multiple documents to be contained within a single window and tabs can be used to navigate between them. And exactly this idea is being used more frequently recently. However, it doesn't have to be that complex. Using modern approaches, you can create and improve tab-based interfaces in few minutes. With CSS, JavaScript, DHTML and XMLHttpRequest (alltogether Ajax) almost everything is possible. Information isn't loaded in new windows, but loaded instantly with Ajax-based techniques. You can also use Back-button without worrying about losing your data. Let's take a look at some of the most interesting techniques we've found in the Web, searching for tab-based interface techniques.
Read more...
Tutorials Round-Up: Ajax, CSS, PHP and More

By Smashing Editorial, January 26th, 2007 in Tutorials | 133 Comments

Coding or designing a page, it's always nice to have some basic templates you can quickly modify or adapt to your needs. However, at least once you have to know, how to create this "universal" template. In this case tutorials prove to be an ultimate solution, particularly if you just want to get an idea how something works and where to start from. In fact, you don't have to re-invent the wheel all the time - you can use existing solutions, modify and improve them and publish them as well - just the way other people did it for you.

In this post we've covered over 200 Ajax, CSS, Flash, JavaScript, PHP, MySQL, RSS, XML as well as ASP, C++, Perl, Python and Java tutorials. You can also check out our list of Photoshop tutorials we've published before.

Read more...
AJAX, DHTML and JavaScript Libraries

By Smashing Editorial, November 15th, 2006 in Developer's Toolbox | 92 Comments

Ajax, DHTML and JavaScript components are important in the era of Web 2.0. Recent Web-applications tend to use them to provide more interactivity and guarantee better functionality. But what Javascript libraries can be used for a new web-project? What functions, effects and useful techniques are actually provided by them? We deliver answers. The result is an [...]
Read more...
Cheat Sheet Round-Up: Ajax, CSS, LaTeX, Ruby…

By Smashing Editorial, October 30th, 2006 in Developer's Toolbox | 170 Comments

Whether you’ve forgotten the name of a function or the property of a cascading style sheet - handy cheat sheets deliver the information you are looking for - immediately. Most cheat sheets are available as .pdf or .png-files, so you can print them and use them every day for whatever projects you’re currently working on. We present an extensive overview of useful cheat sheets we’ve found in the Web.
Read more...
Tasty snack for web-heads: The List Of Lists

By Smashing Editorial, September 14th, 2006 in Developer's Toolbox | 11 Comments

A list of the most useful web-development-related lists you will ever find out there. Ajax, Social Bookmarking, Cheat Shees, CSS, Google, RSS, Web-Tools, Web 2.0, Wiki, Wordpress. On one single page. A tasty snack for web-developers.

In the era of Web 2.0 everyone is collecting, tagging and presenting bookmarks, images, videos, mp3s and, of course, links. Being focused on the most useful tools for web-developers, we've decided to collect something quite different - most useful lists, which include references to the best web-development-related resources. We've collected them, sorted them and listed in one single article. A quick overview of the most popular and useful lists for your web-projects. For web-developers and designers.

Read more...