Download presentation
Presentation is loading. Please wait.
Published byDiane Avice Potter Modified over 9 years ago
1
Libraries and APIs CMPT 281
2
Overview Basics of libraries and APIs Rich internet applications Examples – Scriptaculous – JQuery
3
What is a library? A collection of software modules that provides services to another program A way to extend the functionality of a programming language A way to modularize software development Application Library A Library B
4
What is an API? “Application Programming Interface” The set of functions or commands that is made available by a library
5
Why libraries for web development? To improve the interactive experience Many tasks are difficult with just HTML/CSS – e.g., poor set of interface widgets – Libraries allow reuse of good solutions – “javascript libraries” Many web services exist on the internet – External libraries with a different delivery model – e.g., Google Maps, Flickr, WeatherBug
6
All libraries have an API
7
JavaScript Libraries
8
Prototypewww.prototypejs.org/ script.aculo.usscript.aculo.us/ Yahoo! User Interface Librarydeveloper.yahoo.com/yui/ Dojodojotoolkit.org/ jQueryjquery.com/ MooToolsmootools.net/ Raphaelraphaeljs.net
9
What do JS libraries do? Animation effects User interface widgets JS programming shortcuts Graphics AJAX – Asynchronous Javascript And XML...and more, depending on the library
10
But, beware... Libraries can make things more complex They can change the way JS works They may not be complete or well supported They can be difficult to learn (examples!) So, don’t depend on them! – e.g., only use plain JS on the final exam, unless asked to use a library
11
How to use JS libraries Same principle as external JS: Some libraries are stored on your site: Some libraries are accessed from their home:
12
Example: effects in Scriptaculous
13
Using Scriptaculous Docs: http://madrobby.github.com/scriptaculous/ 1. Download the libraries – http://script.aculo.us/ 2. Put them where your page can see them – e.g., a libraries/ directory 3. Load them into your page – Note that ‘scriptaculous’ depends on ‘prototype’ 4. Use the functions in the API
14
The Scriptaculous API
15
Core effects new Effect.EffectName(element, params, [options]); Example: new Effect.Opacity(‘element_id', { duration: 2.0, from: 1.0, to: 0.5 });
16
Scriptaculous effects demo
17
Example: effects in JQuery
18
Using JQuery (see docs.jquery.com/Tutorials:Getting_Started_with_jQuery) 1. No download required 3. Load the library into your page 4. Use the functions in the API
19
JQuery effects demo
20
Effects without libraries?
Similar presentations
© 2025 SlidePlayer.com. Inc.
All rights reserved.