ModWeb - PowerPoint PPT Presentation
1 / 23
Title:
ModWeb
Description:
ModWeb. A collaborative web based system for tailoring end-user appearance and ... Examples: Ruby on Rails, CakePHP, Apache Cocoon, CherryPy, ASP .NET ... – PowerPoint PPT presentation
Number of Views:42
Avg rating:3.0/5.0
Title: ModWeb
1
ModWeb
- A collaborative web based system for tailoring
end-user appearance and functions of web sites - By Martin Frojd
2
Contents
- Motivation
- Web development
- Mod Web
- Technology used
- Technology motivation / evaluation
- The system
- Client
- Server
- Experience
- Conclusion
3
Webdev software engineering
- A new boom is happening web applications are
very popular and cause a lot of buzz in the
business - E.g. Flickr, del.icio.us, Google Mail
- Buzzwords AJAX, XHTML, Web 2.0, social, tagging
- How well can web development follow the
principles of software engineering? - There is an apparent lack of this, but some
changes can be seen - Yahoos Design Patterns, aimed at various user
interface problems to be solved with JavaScript,
adds some of these practices. - Using the Prototype JavaScript framework enables
some OO features and cleaner code - XHTML, Stylesheets and JavaScripts separates in
similar way to Model, View, Controller
4
(No Transcript)
5
(Rapid) Web Development Frameworks
- A hot topic in web development today
- Create web applications fast using existing
frameworks - Interesting for enterprises that need
applications fast, i.e. an intranet app or for
shorter time-to-market - Examples Ruby on Rails, CakePHP, Apache Cocoon,
CherryPy, ASP .NET - ModWeb was decided to use this and evaluate how
rapid and useful it really is
6
AJAX
- Asynchronous JavaScript And XML
- Can send requests from JavaScript user interface
without reloading, thereby fetching information
as needed. - Responsive UI
- Reduced total data sent?
7
Greasemonkey
- Popular extension to Mozilla Firefox
- Loads JavaScripts (called user scripts) that
dictates changes on the current (X)HTML document
through the Document Object Model (DOM) - Ex document.body.style.background red
- Can add functionality in addition to changing
appearance. - Can for example
- Make sure that all URLs displayed in the browser
are clickable links - Improve the usability of a site you frequent
- Route around common and annoying website bugs
8
Motivation
- Greasemonkey is popular but requires the users to
find, download and apply each and every script by
themselves, and only for users of Firefox and
Greasemonkey - ModWeb offers the possibility of modifying web
sites from any browser, collaboratively and
on-the-fly with ease. - By adding collaboration, people can rely on a
few, skilled modders that make popular changes to
popular web sites tailoring the Internet
9
Motivation, contd.
- ModWeb enhances the functionality of Greasemonkey
user scripts by - Fetching from server, so they are always updated
- Adding personalization to scripts by looking up
details entered into the ModWeb account - Works on any computer switch computer but the
scripts are always online and fetchable with your
settings - Ex Add your name and address in any web form on
sites using the modification
10
Technology used
- JavaScript, through
- Prototype, semi-OO-framework
- AJAX asynchronous requests from the clients
- JSON serializes JS objects for HTTP transfer
between client and server - PHP on Apache, through
- CakePHP a rapid development framework
11
Aspect oriented?
- Designing this application in an aspect oriented
way was considered as an interesting challenge - Aspect oriented programming would help a lot in
most web applications to re-use code - However, it was rejected due to the project
overhead of introducing a new design and
implementation method, as well as insufficient
support at PHP (and non-existent in JS)
12
Technology evaluation
- To be able to give most functionality at the
hands of the users, in any browser, a big part of
ModWeb is the JavaScript - JavaScript is not fully OO, and not fully
separated from View (Model-View-Controller). - I chose to rely on JavaScript to offer in-browser
interface, cross-platform support, etc.
JavaScript is also very popular and a hot topic
in junction with AJAX. - Alternatives are Java Applet, Flash and ActiveX.
In a sense, they are all virtual machines, and I
choose the least obtrusive and most widespread(JS)
13
Technology evaluation, contd.
- Originally JSP was supposed to be used. JSP was
rejected because - Not as widely supported as PHP
- PHP was used instead, because it is
- Very widely available at web hosts and popular
- Simple for simple tasks
- Fast set up of development environment
- JSON is used because it is native to JS
- Example "popup" "menuitem" "value" "New",
"onclick" "CreateNewDoc()" ,
14
The System - ModWeb
15
Procedure
- Fetch JavaScript for user interface from server
or cache - Fetch list of available modifications to web site
being browsed from server - User applies or makes changes to selected
modification - a) Modification code is fetched from server and
applied - b) Changes to a site are saved to the server
16
Clients
- Clients are the applications that connect to the
ModWeb server and presents the end-user interface
(within the browser) - Bookmarklet Works in most modern browsers. A
link that, when clicked, activates the ModWeb
interface for modifying the current site. - Greasemonkey A Greasemonkey script can be
installed to automatically give ModWeb
functionality to any site. - ModWeb Proxy The server acts as a proxy and
delivers the site with ModWeb functionality
added. The proxy is reached through
http//modweb.org/ltsite urlgt
17
Example interface
18
Web site server front end
- The face of ModWeb and front end manager of the
server and database - Allows users to manage their accounts and mods,
and also finding new mods and friends - Has two distinct features the proxy mod client
and the site editor, that enables creation of
advanced mods without coding any scripts
19
Sitemap
- View
- View modded site at ModWeb
- Download Greasemonkey script
- Get bookmarklet
- Modify
- Create mod (WYSIWYG)
- Upload script
- Fetch from userscripts.org
- Apply existing script
- Write scripts
- Browse scripts
- (Debug script)
- Share
- Friends
- Explore users
- Explore scripts
- Share your scripts
- Settings
- User details
20
Server back end
- Administration of data through simple PHP script
- PHP scripts will server dynamic information from
a MySQL database to calling JavaScripts - Can handle many concurrent requests inherently
- SQL database modeled almost directly from the
domain model
21
Domain model
22
Experiences
- Short development time but promising results
- UML is always causing trouble different
guidelines from different authors and seemingly
no tool that fulfills them all (tried Visio and
Poseidon) ? inconsequent diagrams - Web development still far from other development
when it comes to Software Engineering
23
Conclusion
- Software engineering principles can be used in
design, but has less relevance in the actual
implementation of modern web applications
(compared to standard applications) - ModWeb nevertheless includes these practices
together with a useful and realistic concept
not a project for the projects sake
Recommended
CrystalGraphics Presentations
