Write (or start writing) the portion of the Technical Design Document related to the feature that you implemented (or have started implementing).
Detailed Class Diagram:
This will be based off your domain model, and architecture design. The new things you will make: 1) a design class/function diagram (DCD) which must include types and attributes and methods of all classes, and all functions, and 2) apply at least one design pattern in your class design/diagram.
You are basically leveling up your domain model to be more detailed, and include the React views on the diagram.
You should assign parts of the design diagram (DCD) to the people who are in charge of implementing that feature, i.e. after the scoping meeting each person will have features assigned to them.
Here is a template, which also links to an example for how to represent React components (which we have mostly implemented as functional components) (see on left next to comment: Example "Class" Diagram with React functional components represented as "ViewControllers).
Note that this is not technically a UML class diagram, instead it’s a similar representation I invented for this class. Here are links to more complicated ways of using UML to model web applications (which has grown into a book). In general, there is no “right” way to model, the purpose of these diagrams is to help you collaborate and represent what’s important about your application components and how they interact.
Team F 2022 is a good example that uses the template above and their implementation basically matches it. The goal of making this design document is to map out your implementation, check the interfaces between components will actually work, agree on the types, attributes, and arguments for data and functions, agree on the hierarchy of components, agree on all the files and where functions, classes, interfaces, type declarations will be.
Check Brightspace, deliverable 4 for more examples.
Write (or start writing) the portion of the Technical Design Document related to the feature that you implemented (or have started implementing).
Detailed Class Diagram: This will be based off your domain model, and architecture design. The new things you will make: 1) a design class/function diagram (DCD) which must include types and attributes and methods of all classes, and all functions, and 2) apply at least one design pattern in your class design/diagram.
You are basically leveling up your domain model to be more detailed, and include the React views on the diagram. You should assign parts of the design diagram (DCD) to the people who are in charge of implementing that feature, i.e. after the scoping meeting each person will have features assigned to them.
Here is a template, which also links to an example for how to represent React components (which we have mostly implemented as functional components) (see on left next to comment: Example "Class" Diagram with React functional components represented as "ViewControllers).
Note that this is not technically a UML class diagram, instead it’s a similar representation I invented for this class. Here are links to more complicated ways of using UML to model web applications (which has grown into a book). In general, there is no “right” way to model, the purpose of these diagrams is to help you collaborate and represent what’s important about your application components and how they interact.
Team F 2022 is a good example that uses the template above and their implementation basically matches it. The goal of making this design document is to map out your implementation, check the interfaces between components will actually work, agree on the types, attributes, and arguments for data and functions, agree on the hierarchy of components, agree on all the files and where functions, classes, interfaces, type declarations will be.
Check Brightspace, deliverable 4 for more examples.