© 2006 by IBM and Naci Dai; made available under the EPL v1.0 | Santa Clara | Mar. 20, 2006 Java™ Web Application Development with Eclipse WTP - WTP Quick Tour Naci Dai eteration a.s. Lawrence Mandel IBM Rational Software Arthur Ryman IBM Rational Software

Java Web App Dev with Eclipse WTP | © 2006 by IBM and Naci Dai; made available under the EPL v1.0 2 Agenda  WTP Quick Tour  Setting up Your Workspace  The Presentation Tier  Break  The Business Tier  The Persistence Tier  Web Services

Java Web App Dev with Eclipse WTP | © 2006 by IBM and Naci Dai; made available under the EPL v1.0 3 WTP Quick Tour Agenda  WTP contains a lot of tools – let’s start with an overview  Iteration 1  configure an application server, create a Web application, develop a simple JavaServer TM Pages (JSP) document that prints a greeting, and run it on the server.  Iteration 2  add a login JSP, write Java scriptlets to display the user name, create a Java servlet that controls the application page flow, and debug the servlet and JSPs.  Iteration 3  create a database to store user information, develop an SQL query to access it, and add Java Database Connectivity (JDBC) calls to your servlet to invoke the query and retrieve the user information.  Iteration 4  deploy the database query as a Web service, generate a JSP test client that invokes the Web service, and monitor the Simple Object Access Protocol (SOAP) message traffic.

Java Web App Dev with Eclipse WTP | © 2006 by IBM and Naci Dai; made available under the EPL v1.0 4 Iteration 1: J2EE Web Applications  In iteration 1 we will configure our development environment, and create a static Web application Tasks:  Configure an application server  Create a Web application project  Develop a simple JavaServer Pages (JSP) document that prints a greeting  Run the JSP on the server

Java Web App Dev with Eclipse WTP | © 2006 by IBM and Naci Dai; made available under the EPL v1.0 5 Configure an Application Server 1.Window->Preference->Server preferences->Installed Runtimes 2.Click Add. Specify the location of Tomcat. You must specify a JDK so your JSPs will compile.  An application server is needed to run our Java Web application

Java Web App Dev with Eclipse WTP | © 2006 by IBM and Naci Dai; made available under the EPL v1.0 6 Create a Web Application Project 1.Select File->New->Project…->Web ->Dynamic Web Project wizard. 2.Name the project Project1. 3.Associate Tomcat with Project1. 4.Click Finish.  The project will contain all of our Web artifacts such as JSPs, servlets

Java Web App Dev with Eclipse WTP | © 2006 by IBM and Naci Dai; made available under the EPL v1.0 7 Develop a Simple JSP that Prints a Greeting 1.Right click on Project1’s WebContent folder and select New->JSP. 2.Name the JSP hello-world.jsp. 3.Click Next. Select JSP with html markup. 4.Click Finish. 5.Change the title and add body contents for “Hello, world.”  The JSP will display “Hello, World” in a client’s Web browser

Java Web App Dev with Eclipse WTP | © 2006 by IBM and Naci Dai; made available under the EPL v1.0 8 Run the JSP on the Server 1.Right click on hello-world.jsp and select Run As->Run on Server. 2.Tomcat starts up and displays the JSP.  To make use of the JSP it must be run on a server, in our case Tomcat

Java Web App Dev with Eclipse WTP | © 2006 by IBM and Naci Dai; made available under the EPL v1.0 9 Iteration 1 Summary  We configured Tomcat to act as our application server  We created a Web application project  We developed a simple JSP that prints “Hello, world” in a browser  We ran the JSP on the Tomcat server

Java Web App Dev with Eclipse WTP | © 2006 by IBM and Naci Dai; made available under the EPL v Iteration 2: Servlets and Scriptlets  In iteration 1 we created a static Web application  In iteration 2 we will create a dynamic Web application Tasks:  Add a Java Scriptlet to a JSP  Debug a JSP  Create a Servlet  Debug a Servlet

Java Web App Dev with Eclipse WTP | © 2006 by IBM and Naci Dai; made available under the EPL v Add a Java Scriptlet to a JSP 1.Add the following scriptlet to the JSP’s body: <% String person = "?"; String user = request.getParameter("user"); if (user != null) person = user; %> Welcome to WTP, ! 2.Select Run As->Run on Server 3.Provide the name by appending ?user=EclipseCon  Scriptlets allow us to add Java code to a JSP that will get executed on the server

Java Web App Dev with Eclipse WTP | © 2006 by IBM and Naci Dai; made available under the EPL v Debug a JSP 1.Set a break point on the line String user = request.getParameter("user"); by double clicking in the margin. 2.Right click on hello-world.jsp and select Debug As->Debug on Server. Tomcat will now restart in debug mode. 3.Select to resume execution. 4.Change the user to Alice. Notice the variables view shows the changed value.  Debugging a JSP allows us to step through the JSP’s execution path

Java Web App Dev with Eclipse WTP | © 2006 by IBM and Naci Dai; made available under the EPL v Create a Servlet  JSPs should only contain presentation logic.  Application logic should be performed by servlets.  We will now add a login JSP and a servlet to handle the login request.

Java Web App Dev with Eclipse WTP | © 2006 by IBM and Naci Dai; made available under the EPL v Create a Login JSP 1.Create login-user.jsp the same way we created hello-world.jsp. 2.Add the following content to the JSP:  The login JSP will submit information to a servlet using a form Login User Login User Enter your user name:

Java Web App Dev with Eclipse WTP | © 2006 by IBM and Naci Dai; made available under the EPL v Create a Servlet 1.Right click on Project1 and select New->Servlet. 2.Specify the package name org.eclipsecon and the name HelloServlet. 3.Click Next. Accept the default name and mapping. 4.Click Finish. The wizard creates the Servlet skeleton.  The servlet will take the input from our JSP, perform some logic, and return either the login JSP or the hello world JSP

Java Web App Dev with Eclipse WTP | © 2006 by IBM and Naci Dai; made available under the EPL v Add Logic to the Servlet 1.Add the following implementation to the doGet method:  Because we specified GET in login-user.jsp we will implement doGet() protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { String url; String user = request.getParameter("user"); if (user == null || user.length() == 0) { url = "/login-user.jsp"; request.setAttribute("error", "User name must not be empty."); } else { url = "/hello-world.jsp"; } ServletContext context = getServletContext(); RequestDispatcher dispatcher = context.getRequestDispatcher(url); dispatcher.forward(request, response); }

Java Web App Dev with Eclipse WTP | © 2006 by IBM and Naci Dai; made available under the EPL v Run the Updated Application  Right click on login-user.jsp and select Run As->Run on Server

Java Web App Dev with Eclipse WTP | © 2006 by IBM and Naci Dai; made available under the EPL v Debug a Servlet 1.Set a breakpoint in HelloServlet on the line String user = request.getParameter("user"); by double clicking in the margin. 2.Right click on HelloServlet.java and select Debug As->Debug on Server. 3.Select to resume execution. 4.Try changing the name and watch the execution path.  Debugging a servlet is very similar to debugging a Java class

Java Web App Dev with Eclipse WTP | © 2006 by IBM and Naci Dai; made available under the EPL v Iteration 2 Summary  We made out JSP dynamic by adding a Java Scriptlet  We debugged our JSP on the server  We created a login JSP and a servlet to handle login requests  We debugged the servlet on the server

Java Web App Dev with Eclipse WTP | © 2006 by IBM and Naci Dai; made available under the EPL v Iteration 3: Database Access  In iteration 2 we created a dynamic Web application  In iteration 3 we will add a data layer to our Web application Tasks:  Connect to a Database  Execute SQL Statements  Add Database Access to our Web Application

Java Web App Dev with Eclipse WTP | © 2006 by IBM and Naci Dai; made available under the EPL v Show the Database Views 1.Click on Window->Show View->Other… 2.Select the Database Explorer and Data Output views and click OK.  WTP provides two views that assist in working with databases. We need to show these views before proceeding.

Java Web App Dev with Eclipse WTP | © 2006 by IBM and Naci Dai; made available under the EPL v Connect to a Database 1.Right click in the Database Explorer and select New Connection… 2.Select Derby Enter a convenient location for the database such as C:\Project1db 4.Enter the location of derby.jar. It’s located in the plugins dir in org.apache.derby.core. 5.Click Test Connection. 6.If the connection test was successful, click Finish.  Before working with a database we must first connect to it.

Java Web App Dev with Eclipse WTP | © 2006 by IBM and Naci Dai; made available under the EPL v Execute SQL Statements 1.Open the SQL Scrapbook by clicking the button in the Database Explorer, selecting the Project1db, and enter a name of project1sql.sqlpage. 2.Enter the following statements into the editor. (You can replace a name with your own. 3.Select each statement individually, right click on it and select Run SQL. 4.Results are shown in the Data Output view.  We will now populate our database by executing SQL statements. CREATE TABLE WEB1.LOGIN (USERID CHAR(8) NOT NULL, FULLNAME CHAR(20), PRIMARY KEY(USERID)) INSERT INTO WEB1.LOGIN (USERID, FULLNAME) VALUES ('dai','Naci Dai') INSERT INTO WEB1.LOGIN (USERID, FULLNAME) VALUES ('mandel','Lawrence Mandel') INSERT INTO WEB1.LOGIN (USERID, FULLNAME) VALUES ('ryman','Arthur Ryman') SELECT * FROM WEB1.LOGIN ORDER BY FULLNAME SELECT FULLNAME FROM WEB1.LOGIN WHERE USERID = 'ryman'

Java Web App Dev with Eclipse WTP | © 2006 by IBM and Naci Dai; made available under the EPL v Disconnect from the Database 1.Right click on the Project1db in the Database Explorer and select Disconnect.  Derby only supports a connection to a given database from one process – we need to disconnect before using the database in our Web application

Java Web App Dev with Eclipse WTP | © 2006 by IBM and Naci Dai; made available under the EPL v Add Database Access to our Web Application  We will now update our Web application to retrieve user names from the database we created There are 4 tasks to perform: 1.Add the Derby library to our Web application 2.Create a class that will access the database 3.Update our Servlet to access the user name from the database class 4.Update our hello world JSP to display the user name

Java Web App Dev with Eclipse WTP | © 2006 by IBM and Naci Dai; made available under the EPL v Add the Derby Library to our Web Application 1.Copy derby.jar to WEB-INF/lib note: While this method works fine for a single application, if multiple applications need access to a Derby database a shared copy of Derby must be used.  Our application needs access to the Derby libraries in order to access a Derby database

Java Web App Dev with Eclipse WTP | © 2006 by IBM and Naci Dai; made available under the EPL v Create a Class that will Access the Database 1.Create a new class named Database.java in the same package as HelloServlet.java.  The class will contain all the logic to access the database public class Database { public String lookupFullname(String userid) throws SQLException { Connection connection = null; PreparedStatement statement = null; ResultSet resultset = null; String fullname = ""; try { Class.forName("org.apache.derby.jdbc.EmbeddedDriver"); connection = DriverManager.getConnection("jdbc:derby:C:\\{roject1db"); String QUERY = "SELECT FULLNAME FROM WEB1.LOGIN WHERE USERID = ?“; statement = connection.prepareStatement(QUERY); statement.setString(1, userid); resultset = statement.executeQuery(); if (resultset.next()) fullname = resultset.getString("FULLNAME").trim(); } catch (Exception e) { e.printStackTrace(); } finally { if (resultset != null) resultset.close(); if (statement != null) statement.close(); if (connection != null) connection.close(); } return fullname; } }

Java Web App Dev with Eclipse WTP | © 2006 by IBM and Naci Dai; made available under the EPL v Update Our Servlet to use the Database class 1.Update the doGet method of HelloServlet.java to use Database.java.  The Servlet will now access the user name from the database protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { String url = "/hello-world.jsp"; String user = request.getParameter("user"); if (user == null || user.length() == 0) { url = "/login-user.jsp"; request.setAttribute("error", "User name must not be empty."); } else { try { String fullname = new Database().lookupFullname(user); request.setAttribute("fullname", fullname); } catch (SQLException e) { e.printStackTrace(); } } ServletContext context = getServletContext(); RequestDispatcher dispatcher = context.getRequestDispatcher(url); dispatcher.forward(request, response); }

Java Web App Dev with Eclipse WTP | © 2006 by IBM and Naci Dai; made available under the EPL v Update JSP to Display the User Name 1.Update the hello-world.jsp to retrieve the value of the fullname parameter and use it instead of the user parameter if it has been specified by changing the Scriptlet as follows:  The JSP needs to be updated to use fullname.

Java Web App Dev with Eclipse WTP | © 2006 by IBM and Naci Dai; made available under the EPL v Run the Updated Web Application 1.Run login-user.jsp on the server. 2.Try entering a user id. The resulting page now displays the name instead of the user id.

Java Web App Dev with Eclipse WTP | © 2006 by IBM and Naci Dai; made available under the EPL v Iteration 3 Summary  We connected to a Derby database  We executed SQL statements to populate the database and view the values we added  We added database access to our Web application enabling the application to display the user name instead of the user id.

Java Web App Dev with Eclipse WTP | © 2006 by IBM and Naci Dai; made available under the EPL v Iteration 4: Web Services  In iteration 3 we created a data layer for our Web application  In iteration 4 we will expose that data through a Web service Tasks:  Deploy a Web service  Test a Web service with a test client  Monitor SOAP messages

Java Web App Dev with Eclipse WTP | © 2006 by IBM and Naci Dai; made available under the EPL v Deploy a Web Service 1.Right click on Database.java and select Web Services->Create Web service. 2.Check the following items: -Start Web service in Web project -Generate a Proxy -Test the Web service -Monitor the Web service 3.Click Finish.  We will create a Web service using the bottom-up approach to expose our Database.java class.

Java Web App Dev with Eclipse WTP | © 2006 by IBM and Naci Dai; made available under the EPL v Test a Web Service with a Test Client 1.Click on the lookupFullname method. 2.Enter the name “ryman”. 3.Click Invoke. 4.The Result pane displays the full name “Arthur Ryman” associated with the user id ryman.  The test client allows you to easily test a Web service.  The test client was created by selecting the option in the WS wizard

Java Web App Dev with Eclipse WTP | © 2006 by IBM and Naci Dai; made available under the EPL v Monitor SOAP Messages 1.The message you sent when testing the Web service can be seen by opening the TCP/IP monitor view. If not already open select Window->Show View->Other… ->Debug->TCP/IP Monitor 2.Use the test client to test another name. The result shows up in the TCP/IP monitor.  Web services send SOAP messages between the client and server  We can monitor these messages to see the traffic and find problems

Java Web App Dev with Eclipse WTP | © 2006 by IBM and Naci Dai; made available under the EPL v Iteration 4 Summary  We deployed a Web service that allows programmatic access to our database  We tested the Web service with a test client generated by the Web service wizard  We monitored SOAP messages sent to and from the Web service

Java Web App Dev with Eclipse WTP | © 2006 by IBM and Naci Dai; made available under the EPL v Quick Tour Summary  WTP contains many tools that simplify the development of Web applications including working with databases and working with Web services  Some more technologies supported by WTP include: CSS, DTD, EAR, EJB, HTML, XHTML, J2EE, JavaBeans TM, JavaScript TM, JSP, Servlet, SQL, WSDL, XML, XML Schema, WAR, Web services

Java Web App Dev with Eclipse WTP | © 2006 by IBM and Naci Dai; made available under the EPL v Attributions Java and all Java-based trademarks are trademarks of Sun Microsystems, Inc. in the United States, other countries, or both. Other company, product, or service names may be trademarks or service marks of others.