Teaching Software Development by Example

1. Teaching Software Development by Example Evelyn Stiller and Cathie LeBlancDept. Computer Science and Technology

2. Context for Teaching Design • The course is called Client-Server Programming. • This is the students’ second programming course. • The course is taught using Java. and Program Evolution

3. Teaching Students to Design by Example • Students learn to design simple two-player client-server applications in the following manner: • Introduce a reusable socket listener class. • Show students a simple client-server application design. • Model adapting the above design to another, similar application. • Ask students to adapt the design to their own project. • This approach has greatly improved the students’ success in completing their client-server projects.

4. Weekly Topics for Client/Server Programming

5. Weekly Topics for Client/Server Programming

6. Weekly Topics for Client/Server Programming

7. The Basic Design Process • Determine functional specification of project. • Divide the overall functionality into client and server responsibilities. • Determine which classes are required for the client and which are for the server. • Determine inter-class relationships.

8. Introducing the SocketListener Class • The SocketListener class is a reusable class for reading text over Sockets. • This class is threaded so that the main application using this class does not block upon issuing a readLine() over the BufferedReader. • Uses the interface NetworkReaderto force implementing classes to define the method sendSocketInput(String, SocketListener)

9. Using the SocketListener Class MainApplication sendSocketInput(String, SocketListener) implements creates << interface >> NetworkReader sendSocketInput(String, SocketListener) BufferedReader (Java predefined class) calls sendSocketInput using lines of text read from BufferedReader reads text over << uses >> SocketListener is-a Thread(Java predefined class)

10. Model Design: Two Person Chat Room ChatSession sendSocketInput(String, SocketListener) Chat4_2Client sendSocketInput(String, SocketListener) send messages send messages send messages received from server send messages received from client Network Reader NetworkReader create SocketListener connect SocketListener Chat4_2Server {Client side} {Server side}

11. Players interact with each other through a graphic user interface that consists of a two-dimensional array of squares in which colored dots randomly appear. Players of the game click on dots of their designated color removing dots and gaining points. One player will lose when two neighboring dots of his/her color are set. New Application: Game2D

12. Client/Server Responsibilities: Game2D • Client • Present user with two-dimensional grid • Render server-selected dots on grid • Allow user to remove dots with mouse click in the cell containing the dot • Communicate dot removal to server • Server • Allow two players to connect • Assign a color to each player • Periodically generate randomly placed dots and communicate this to both clients • Communicate one client'sdot removal to other client • Determine winner and loser

13. user – external entity grid – potential class but we will implement it as a two-dimensional array rather than create another class dot – attribute of another class cell – potential class server – already a class in our application player – external entity (synonym for user) mouse click – already a class predefined in Java client – already a class in our application winner – synonym for player loser – synonym for player Categorize each noun potential class attribute for another class pronoun synonym for another noun transient noun external entity Classes for Game2D

14. Communication Infrastructure: Game2D Game2D sendSocketInput(String, SocketListener) Game2DClient sendSocketInput(String, SocketListener) send messages send messages send messages received from server send messages received from client Network Reader NetworkReader create SocketListener connect SocketListener Game2DServer {Client side} {Server side}

15. Additional Classes: Game2D Cell Timer Cell is-a set/unset dot query prompts GraphicCell Game2D Cell[][] sendSocketInput(String, SocketListener) renders itself set/unset dot query Game2DClient GraphicCell[][] sendSocketInput(String, SocketListener) {Client side} {Server side}

16. Aggregate Game2D Design Cell Cell Timer is-a Set/unset dots query GraphicCellGame2DClient reference prompts Game2D Cell grid[ ][ ] sendSocketInput(String, SocketListener) render send messages query set/unset dots Game2DClient GraphicCell grid[ ][ ] sendSocketInput(String, SocketListener) send messages send messages received from client Network Reader send messages received from server SocketListener NetworkReader send two socket connections connect SocketListener Game2DServer {Client side} {Server side}

17. Creating Complex Applications by Evolution • Students start with a simple application which reviews Java concepts • Each week a new concept is learned and new functionality embodying this concept is added to the application. • The application grows in complexity in manageable steps.

18. Evolving the Science Center Application

19. Evolving the Science Center Application

20. Evolving the Science Center Application • After the 10th week students initiate their own client-server project. • They are required to specify overall functionality. • Determine client and server responsibilities. • Determine classes. • Develop a design by adapting the communication infrastructure of the 2-person chat application. • Develop their application incrementally.

21. Conclusion • Students are able to successfully develop relatively complex applications in their second programming course. • Students gain experience developing simple client-server applications. • Students learn to adapt design solutions to new applications. • Students feel comfortable working with UML as a result of their experience. Slides are available at: http://oz.plymouth.edu/~estiller/