Tutorial: Server-Side Web Applications with Java, JSP and Tomcat

1. Methodologies in Information Systems Development Tutorial: Server-Side Web Applications with Java, JSP and Tomcat Eran Toch December 2004

2. Agenda • Introduction and architecture • Installing Tomcat • Building a Web Application (through Eclipse) • The Phones Web Application • Writing JavaBeans • Writing JSPs • Includes, session and application • Model 2 Architecture Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

3. Web Application vs. Web Site Web Site Web Application Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

4. The Difference – cont’d Web sites are • Static • File based • May include client’s JavaScript code • Web Applications are • Dynamic (output depend on input) • Database based • Multi-layered • Session dependent (most of the times) • Personalized (some of the times) Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

5. Java Web Application Architecture Browser HTTP / HTML Application Server Servlet JSP DB / ERP / Legacy Java Classes / EJB Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

6. Agenda • Introduction and architecture • Installing Tomcat • Building a Web Application (through Eclipse) • The Phones Web Application • Writing JavaBeans • Writing JSPs • Includes, session and application • Model 2 Architecture Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

7. Tomcat Installation • Go to: http://jakarta.apache.org/tomcat/ • Download the latest version (currently 5.5.4) by going to: Downloads -> Binaries -> Tomcat 5.5.4. • For Windows, download the exe version – with a Windows setup. The direct link: http://apache.fresh.co.il/jakarta/tomcat-5/v5.5.4/bin/jakarta-tomcat-5.5.4.exe • For Linux, read the setup manual: http://jakarta.apache.org/tomcat/tomcat-5.5-doc/setup.html Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

8. Tomcat and Java 5 • Please note that Tomcat v. 5.5.4 requires J2SE 1.5 (also known as J2SE 5) or above. • If you want to use J2SE 1.4, download Tomcat 5.0.+ Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

9. Tomcat Installation – cont’d If you want Tomcat to startup every time the computer is rebooted, check the “service” option. If you wish to use Tomcat for only for development, it’s best to leave the service option unchecked. Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

10. Tomcat Installation - Port You can configure the port that Tomcat will be using. If you want it to be available publicly (behind firewalls etc), change the default port to 80. Otherwise, leave it as it is (880). You can always change it later, in the [TOMCAT_HOME]/conf/server.xml configuration file. Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

11. Running Tomcat • Start Tomcat by running Tomcat monitor (Start Menu -> Apache Tomcat -> Monitor Tomcat), and click on Start. • Point your browser to: http://localhost:8080. If Tomcat works, you should see something like this • If not, check out the logs (C:\[TOMCAT_HOME]\logs\stdout) and see what went wrong. Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

12. Managing Tomcat • Go to the management console by clicking on the “management” link in the Tomcat root homepage, or directly by going to: http://localhost:8080/manager/html. • The default username is “admin”, and the default password is ”” • You can change it by changing the [TOMCAT_HOME]\conf\tomcat-users.xml. Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

13. Managing Tomcat Console Start, stop, restart and un-deploy applications Web Application management Number of current sessions Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

14. Agenda • Introduction and architecture • Installing Tomcat • Building a Web Application (through Eclipse) • The Phones Web Application • Writing JavaBeans • Writing JSPs • Includes, session and application • Model 2 Architecture Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

15. Building A Web Application • Build the following folder structure under [TOMCAT-HOME]\webapps Tomcat-home This is the hard way…There are better webapps common conf ... phones WEB-INF jsp lib classes Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

16. Creating JSP Project in Eclipse • Open a project for the JSP pages • Choose the type “Simple project” Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

17. Creating JSP Project – cont’d • Choose the path to the jsp folder • Click “Finish” Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

18. Creating Java Classes Project • Create a new project • Choose “Java Project” Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

19. Creating Java Project – cont’d • Choose the path to the WEB-INF/classes folder Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

20. Creating Java Project – cont’d • Make sure the output build path is in the WEB-INF classes folder • Necessary libraries could be added now Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

21. Better ways • Download MyEclipse IDE extension from:http://www.myeclipseide.com/ • Download Lomboz plugin for Eclipse at: http://www.objectlearn.com/index.jsp • Both of these plugins will give you: • Easier deployment of projects • JSP debugging • JSP error detection (important!) Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

22. Agenda • Introduction and architecture • Installing Tomcat • Building a Web Application (through Eclipse) • The Phones Web Application • Writing JavaBeans • Writing JSPs • Includes, session and application • Model 2 Architecture Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

23. Our “Phones” Application • Simple application that displays phone records from the database • (stupid, shameless) Architecture: select_entry.jsp display_phone.jsp PhoneEntry.java Database DBConnector.java Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

24. PhoneEntry.java package edu.technion.methodologies.phones; public class PhoneEntry { private int id = 0; private String name; private String phone; private String email; public void load(int id) { DBConnector.loadPhone(id, this); } public void save() { if (id == 0) { id = DBConnector.insertPhone(this); } else { DBConnector.updatePhone(id, this); } } //getters and setters… } Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

25. DBConnector.java • See the advanced Java tutorial… Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

26. Writing Scriplets in JSP • Write HTML as normal • Dynamic parts between <% %> • Eg <HTML> <BODY> Hello!  The time is now <%= new java.util.Date() %> </BODY> </HTML> Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

27. JSP Scripting Elements • Expressions<%= expression %> • evaluated and inserted into the output • Scriptlets<% code %> • inserted into the servlet's service method • Declarations<%! code %> • inserted into the body of the servlet class, outside of any existing methods Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

28. JSP Directives • There are two main types of directive: • page • lets you do things like import classes, customize the servlet superclass etc • Include • lets you insert a file into the servlet class at the time the JSP file is translated into a servlet. • <%@ directive attribute="value" %> Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

29. select_entry.jsp • <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> • <HTML> • <HEAD> • <TITLE>Phones Application</TITLE> • </HEAD> • <BODY> • <form action="display_phone.jsp"method="post"> • <table border=0> • <tr> • <td>ID: </td> • <td><input type="text"name="id"></td> • </tr> • <tr> • <td>&nbsp;</td> • <td><input type="submit"></td> • </tr> • </table> • </form> • </BODY> • </HTML> HTML Header HTML form Nested HTML table structure HTML text input Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

30. select_entry.jsp – the HTML output Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

31. display_phone.jsp <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <%@pageimport="edu.technion.methodologies.phones.*" %> <HTML> <HEAD> <TITLE>Phone Entry</TITLE> </HEAD> <BODY> <% String idParam = request.getParameter("id"); int id = 0; if (idParam != null){ id = Integer.parseInt(idParam); } PhoneEntry phoneEntry = new PhoneEntry(); phoneEntry.load(id); %> Importing libraries Handling the request Creating the JavaBean Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

32. display_phone.jsp – cont’d • <table border=0> • <tr> • <td>Name:</td> • <td><b><%= phoneEntry.getName() %></b></td> • </tr> • <tr> • <td>Phone:</td> • <td><%= phoneEntry.getPhone() %></td> • </tr> • <tr> • <td>Email:</td> • <td><%= phoneEntry.getEmail() %></td> • </tr> • </table> • </BODY> • </HTML> Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

33. display_phone.jsp – the HTML Output Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

34. Agenda • Introduction and architecture • Installing Tomcat • Building a Web Application (through Eclipse) • The Phones Web Application • Writing JavaBeans • Writing JSPs • Includes, session and application • Model 2 Architecture Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

35. JSP Include • Inserting elements into the JSP page in complication time Included JSP file <table border="0"width="100%"cellpadding="4"> <tr bgcolor="99CCFF"> <td><a href="select_entry.jsp">home</a></td> </tr> </table> Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

36. JSP Include – cont’d We add the include declarative into display_phone.jsp … <BODY> <%@includefile="header.jsp"%> <% … And we get: Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

37. Session and Application Objects • A session is an object associated with a visitor.  • Data can be put in the session and retrieved from it • Sessions are timed-out – the default is ~25 minutes • The application object is accessed similarly, but is unique and global for the web application //Setting an object within the session session.setAttribute("last_searched_id", new Integer(id)); //Getting an object from the session Integer lastID = (Integer)session.getAttribute("last_searched_id"); out.println(lastID); Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

38. Advanced Issues • Servlets – have many advantages over JSP • Inheritance • Class structure • Tag libraries • Enterprise Java Beans • J2EE Frameworks (WebLogic, Web Sphere, JBoss) Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

39. Agenda • Introduction and architecture • Installing Tomcat • Building a Web Application (through Eclipse) • The Phones Web Application • Writing JavaBeans • Writing JSPs • Includes, session and application • Model 2 Architecture Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

40. Model 2 Architecture • recommended approach for designing medium- and large-sized Web applications • An implementation of the Model-View-Controller (MVC) pattern • Applications have 3 layers • Model: containing all data and operations • JSP classes or beans • View: creating various presentations • JSP – focus on static data • Controller: receiving requests, updating the model, and delegating to views • servlet Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

41. Model 2 Architecture – cont’d VIEW CONTROLLER MODEL forward .jsp Database classes servlet Form request .jsp Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

42. Struts • Struts is an open source framework created within the Jakarta project by the Apache Software Foundation • Supports Model-View-Controller (MVC) design pattern • http://struts.apache.org/ Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development

43. References • Core Servlets and JavaServer Pages, Vol. 1: Core Technologies, Second Edition, by Marty Hall, Larry Brown • Sun’s JSP Tutorial:http://java.sun.com/j2ee/tutorial/1_3-fcs/doc/JSPIntro.html • JavaBeans Tutorial:http://java.sun.com/j2ee/tutorial/1_3-fcs/doc/JSPBeans.html • A set of advanced (and untidy) tutorials:http://www.coreservlets.com/ Server-Side Web Applications with Java, JSP and Tomcat – Eran Toch Methodologies in Information System Development