2. About me
President F1 Technologies
Designer/Lead Developer Visual FoxExpress
Framework
Very Experienced VFP Developer
xBase Developer Since 1987
Fox Software Tech Support, Marketing &
Development 1988-1990
Moderately Experienced Web Developer
Web Development Since 1994
ASP, Web Connection, AFP, JavaScript
3. Agenda
Supply List
N-Tier Web Architecture
Model View Controller Web Architecture
Interacting with VFP
Good JavaScript
Bad JavaScript
Introducing Prototype
Adding JavaScript with Prototype
4. Supply List
Web Server
IIS (Internet Information Server)
Apache
HTML Editor
Standards: FrontPage, Dreamweaver, Visual Studio.NET, Microsoft Expression Web
Popular Low Cost Alternatives: HotDog, CoffeeCup
No-frills: Notepad, VFP
Barf Bag: Word
VFP Compatible Server Side Scripting Language
Web Connection, Active FoxPro Pages (AFP) , FoxWeb or ActiveVFP
ASP, ASP.NET & COM
Javascript Framework
Prototype (and many popular add-ons)
JQuery
DOJO
JavaScript Debuggers
Firebug for Firefox
Debugbar for Internet Explorer
5. N-Tier Web Architecture
UI
HTML/XHTML (content)
CSS (formattting)
JavaScript w/ Prototype (behavior)
Business
VFP Objects for communicating between UI & Data
Data
VFP Tables
6. Model-View-Controller
Model (The Data)
VFP Tables
View (The User Interface)
HTML/XHTML (content)
CSS (formattting)
JavaScript w/ Protype (behavior)
Controller (The Business Layer)
JavaScript w/ Protype (plumbing)
VFP Objects for communicating between UI & Data
7. Interacting with VFP
Web Connection & AFP are ISAPI Extensions
WC & AFP files use <% and %> as script
delimiters
VFP Code can fall anywhere within a web page
between delimiters
Classic ASP is very similar except code is
VBScript/Jscript that gets to VFP via COM.
ASP.NET, PHP and other server platforms with
COM support can also talk to VFP
9. “Good” JavaScript
Pages should be functional w/o
JavaScript. How much depends on your
requirements. JavaScript is used to
enhance functionality & improve the user
experience.
Load JavaScript Last, after DOM is
loaded.
More difficult to write.
Often requires writing it twice.
10. “Bad” JavaScript
Pages require JavaScript to function
Ok, when you control the browser
Becoming more acceptable all the time.
Easier to write.
12. Case Study: St. Martin de
Porres
Current Site Wanted
Outdated
Modern/Current Look &
Ugly website Feel
Static
Old Content to Expire
Requires a “geek” to
New Content to be readily
update it apparent
Poorly maintained &
Consistent Look & Feel
designed: ie bad layouts,
Real sense of community,
little consistency interaction with the parish
& outlying community
Maintained by Parish
Personnel
13. Solution
VFP & AFP
Data Driven Content Management System
Classes Define different types of content
JavaScript with Prototype
Dynamic Behavior Makes Site Easy To Use
AJAX based data entry makes it easy for end-
users to update site.
17. Summary
Separation of Concerns makes more
functional, easier to maintain websites.
Prototype makes DOM programming
much easier, less stressful, faster and
more fun.
VFP works well on the web.
18. Thank you!
Remember to fill out your session
evaluation.
Session slides, white paper, and code
samples will be updated.