2021-03-14

UML and OpenAPI for full stack development

There are many good articles introducing how to become a full stack developer. Lots of technologies — HTML, CSS, JavaScript, Express, React are mentioned. They are really good resources. However, I think they miss some importatnt things and here are two importatnt things.

UML: Data Model of Service

Before implementing a service, it is important to construct concrete a data model, definitions and relationships between entities. Without a concrete data model, design and implementation of service are highly likely to be changed during development, resulting in an unstable product and risk of missing feature.

To design a class diagram, you can use one of software (or others):

• StarUML
• diagrams.net
• PlantUML
• Lucidchart

OpenAPI: Protocol between Backend and Frontend

After designing data model, a developer needs to implement backend service provider and frontend service request. OpenAPI enables a developer to define a protocol: which paths, parameters and body contents to use, how responses will be.

To design OpenAPI, you can use one of software (or others):

• Insomnia Designer
• Redocly
• Postman
• OpenAPI (Swagger) Editor (VSCode Extension)
• Swagger Viewer (VSCode Extension)
• Swagger

OpenAPI, UML