Interaction between HTML/Javascript coder and server scripting language coder?

Question

I don't want my PHP coder to write Javascript anymore. I want to separate javascript coding and php coding. How should I write documentation about this interaction?

Let's imagine really simple ajax request. As for me documentation should contain sequence flow diagram.

1. user is clicking "edit" button
2. preloader is shown to user
3. ajax request is sent to url /ajax_request/category/{category_id}/; we are expecting answer in json format
4. timer has started; if answer is not recieved within 10 seconds - show alert "Connection timeout, please try to refresh page and try one more time."
5. ajax request is recieved into var data
6. hide preloader
7. check if data.success is false then show alert "Something goes wrong."
8. put data.html in container

As you see, it is really difficult to explain this flow in text format. I know there is UML for describing such things, but I have no experience. All UML samples are too simple and I can't understand how to build more complicated diagrams.

Please, anyone (UML expert), could you show me how UML diagram will look for my example.

I really appreciate any help. Thank you!

Answer 1

There are more diagrams for your problem. The question is :"What do you want to represent?"

• Flow from your step 1. to your step 8 You shuold draw a Behavior diagrams. You can use an Use Case (diagram for represent the actions of user), Activity diagram (represent the life of a algorithm or process) or a State Diagram (if you want to represent the evolution of a specific component in the flow, f.e. the http request). Otherside, you can use an Interaction diagram for represent the interdipendence between server and client.
• Structure Generally you should use a Class diagram. In simple way:
  • a class for client;
  • a class for server;
  • a class for the request;
  • bla bla

This kind of diagram is useless for the usability/functional activity for the user.

• UML4WEB You can use the Diagrams of Conallen, who made an extension of UML for the WEB project.