Command Query Separation (CQS) is a principle that helps in structuring applications by separating operations that change state (commands) from those that only retrieve data (queries).

Commands

Commands modify the system state and involve:

1. Validate Parameters – Ensuring inputs meet expected criteria.
2. Read from Database – Sometimes necessary for pre-checks.
3. Perform Action – Executing business logic.
4. Write to Database – Persisting changes.
5. Log Event – Tracking changes or actions.
6. Update View – Reflecting changes in the UI or API response.

Queries

Queries do not modify the state and involve:

1. Validate Parameters – Ensuring inputs are correct.
2. Read from Database – Retrieving required data.
3. Update View – Presenting the data.

Validation

Validation applies to both commands and queries:

1. Check Values – Ensuring correctness (e.g., required fields, format).
2. Check Service and Persistence Constraints – Ensuring integrity across business rules and database constraints.

Event Handling

Events help with decoupling components:

1. Communication Between Components or Endpoints – Examples include WebSockets, message queues, or APIs exchanging XML/JSON payloads.

1. Design for large screens first
   Build the full-size version of the website, maximizing available screen space.

2. Adapt for smaller devices
   Use @media queries to define breakpoints and ensure responsive styling.

3. Utilize mock data
   Since the API isn’t ready, simulate user interactions with mock data.

4. Refine the UI and define the API
   Ensure the UI is fully responsive and functional across all screen sizes.

5. Align the API with frontend needs
   Design an API that supports the frontend’s requirements. Gradually replace mock data with real API calls while validating responses and handling errors.

6. Develop and integrate the backend
   Build the backend and database schema based on the finalized frontend structure.

7. Validate API interactions
   Ensure seamless communication between the UI and backend.

This top-down development approach ensures that the UI dictates data structure and interactions, resulting in a user-centric, scalable, and efficient application.