Things To Do Before Coding Your App
Plan Your App Like a Boss!
Before you dive into typing lines of code that is going to get erased anyway, back up and plan your app. Planning is a process people often forget about when it comes to developing anything. You can start coding your app right away, but you risk wasting time. So, what are we waiting for? Let’s start planning together.
Use Case Diagram
A use case diagram is a visual representation of a user’s interaction with a system.
When trying to piece together my app, I am surprised how much creating a use case diagram helped me. Not only did it give me an idea of the screens my user will interact with, but the diagram allowed me to put my ideas on paper.
Before creating a use case diagram you got to know how to read one.
Actors
The actors of a use case diagram are the system’s users. The actors are represented by stick figures seen in the picture above.
The users that interact with a system. An actor can be a person, an organization, or an outside system that interacts with your application or system. They must be external objects that produce or consume data. (Source)
In this case, the actor is our app user.
Use Cases
Each actor must be linked to a use case, although not all use cases are linked to actors. So, what is a use case? You see those ovals in the pictures above or below? Well, usually those ovals contain a system function. In short, the use case must do something. For example:
Extend, Include
You use extend to show optional functionality or system behavior. On the other hand, include is used to add additional information not specified in the base use case.
Example of extend:
Entity Relationship (ER) Diagram
An ER diagram is used to show how entities (people, objects, or concepts) relate to each other in a system. Creating an ER diagram for your project can be useful for showing where data goes in your project’s database.
Let’s go over what makes an ER diagram.
Entities
Entities are represented by rectangles in an ER diagram. They are objects and components of data. In this example, we are going to use the entities member and group. A member can be apart of more than one group in most cases, and a group has multiple members.
Attributes
The attributes are pretty much the property of the entity. In other words, the fields in our database’s table/collection. They are represented by an oval.
Relationships
Now, we need to show the relationship between entities. A relationship is represented by a diamond in an ER Diagram. A member joins a group.
Wireframes
A Wireframe is a visual guide that represents a website or app’s skeleton. People often mistake this as a first step.
Wireframes are an essential part of any web/app project. It’s a key step in the design process. Sometimes the designer isn’t separate from the developer. In some cases, you have one person doing both.
You can use tools like Figma to make wireframing easier, although pencil and paper would do just fine.
That concludes this article about things to do before you code your app. Clap if you found this useful and respond if you have any questions.
Happy Coding!