So basically, I mean something like UML for designing classes in Object-Oriented programming. How can we use a diagramming software to design (model) our UIs (Components, props, states, event etc) before writing any actual code?
For example, a React architecture will include several UI components such as buttons, forms, API services, Central State Management services, etc. Because of this ReactJs architectural freedom, it is the most preferred JavaScript library (framework) for building front-end applications.
The higher-order component, or HOC pattern, is an advanced React pattern used for reusing component logic across our application. The HOC pattern is useful for cross-cutting concerns — features that require sharing of component logic across our application.
React itself is just a presentation layer library. If you use it along with Flux / Redux then you will be using the GoF Observer pattern, which roots back to Alan Key's MVC that is slightly different than "modern mvc" as popularized by 00's and 10's web frameworks.
You can use the https://balsamiq.cloud/ for creating the wireframes of UI before starting the actual code.You can create the mobile view screens for different mobile versions in that.Later you can work on the screens wise.
Once the UI is done you may get the clear idea of what is needed in reactjs states and props values.
Pen and paper ... whiteboard. It might sound like I'm kidding. But I find this to be the best way to model your app. When I'm done with a whiteboard diagram, I take a photo if I need to share it.
It does two big things, imo: 1. it keeps things simple so you get the important stuff figured out without overcomplicating things so you get started coding; 2. it doesn't look too official or polished so you remember it's just a sketch. When it comes time to write your code, your established patterns and conventions should dictate your app architecture and your "wireframes" should just be a reference to look back on.
Again, just my own opinion. There is no single answer to your question.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With