Task Manager системийн урсгал зохиох

Төслийн товч

Та бүтэн application бичихгүй. Харин өөр хөгжүүлэгч таны document-ийг уншаад юу барих, request хаашаа явах, data хаана шалгагдаж хадгалагдахыг ойлгохоор системийн зураг төсөл бэлдэнэ.

Task Manager дараах дөрвөн feature-тэй:

1. Task үүсгэх
2. Task жагсаах
3. Task complete болгох
4. Task устгах

Хязгаарлалт

• Нэг хэрэглэгчийн local demo product гэж үз; authentication зохиохгүй.
• Task нь id, title, completed, createdAt талбартай.
• Title trim хийсний дараа 1–120 тэмдэгт байна.
• Task complete болгоход зөвхөн completed field өөрчлөгдөнө.
• Устгасан task буцаах restore feature байхгүй.
• Database technology нэрлэх боломжтой ч vendor-specific query бичих албагүй.
• Payment, certificate, comment, analytics нэмэхгүй.
• Error response-д stack trace, credential, raw database error өгөхгүй.

Хүлээлгэн өгөх 11 зүйл

1. User actions

Хэрэглэгч юу хийж болохыг verb-ээр бич:

• шинэ task-ийн title оруулах;
• task list харах;
• task complete checkbox дарах;
• delete action сонгох;
• алдаа гарвал засах эсвэл дахин оролдох.

2. Main screens

Minimum нэг Task List screen байж болно. Дотор нь create form, list, empty state, loading state, error state, task row, delete confirmation хэрхэн харагдахыг нэрлэ. Modal заавал хэрэгтэй гэж үзэхгүй; interaction-аа үндэслэ.

3. Frontend responsibilities

Form state, accessible labels, loading/empty/error feedback, request илгээх, successful canonical response-оор UI шинэчлэх, focus management зэргийг жагсаа.

4. Backend responsibilities

Request parsing, runtime validation, business rule, safe error mapping, database operation, stable response contract-ийг жагсаа. Client-ийн validation давсан гэж итгэхгүй.

5. Database entities

Task entity-ийн field, type, required/optional нөхцөл, default value, constraint-ийг хүснэгтээр харуул.

| Field | Type | Дүрэм | | --- | --- | --- | | id | string | Unique, server/database үүсгэнэ | | title | string | Required, trim хийсний дараа 1–120 | | completed | boolean | Default false | | createdAt | timestamp | Server/database цаг |

6. API endpoints

Minimum contract:

GET    /api/tasks
POST   /api/tasks
PATCH  /api/tasks/{id}
DELETE /api/tasks/{id}

Endpoint бүрт request body, success status, response body, боломжит 400, 404, 500-г хэрэгтэй хэмжээнд тодорхойл.

7. Validation rules

Frontend feedback болон backend trusted validation-ийг ялга. Title length, JSON body, boolean completed, ID format, missing task, authorization хамаарахгүй энэ scope-д ямар дүрэм үлдэхийг бич.

8. Success flows

Feature бүрийн request → validation → database → response → UI update дарааллыг нэг мөрөөр дүрслэ.

9. Error flows

Наад зах нь:

• хоосон title;
• task олдохгүй;
• network request тасрах;
• database operation амжилтгүй

үед хэрэглэгч юу харах, backend ямар status өгөх, internal error хаана үлдэхийг тусад нь бич.

10. Architecture diagram

Дүрслэлдээ direction болон message-ийн нэр тавь:

[User]
  │ submit title
  ▼
[Frontend]
  │ POST /api/tasks
  ▼
[Backend]
  │ validated insert
  ▼
[Database]
  │ saved Task
  ▼
[Backend response]
  │ 201 + Task JSON
  ▼
[Frontend list update]

Өнгө хэрэглэвэл label-аа хадгал. Color дангаараа success/error эсвэл layer ялгах ёсгүй.

11. Нэг complete request lifecycle

POST /api/tasks-ийг сонгоод хэрэглэгч Save дарахаас шинэ task дэлгэцэнд гарах хүртэл дараахыг өгүүлбэрээр тайлбарла:

1. frontend ямар data бэлдэх;
2. request method, endpoint, headers, body;
3. backend validation;
4. database write;
5. response status ба body;
6. frontend state update;
7. validation эсвэл database error-ийн өөр зам.

Санал болгох ажлын дараалал

1. Feature inventory гарга

   Дөрвөн feature болон тус бүрийн user action, success result-ийг нэг хүснэгтэд бич.

2. Task entity тодорхойл

   Field, type, default, constraint-аа шийд. UI field болон persisted field ижил байх албагүйг сана.

3. API contract бич

   Method, path, request, success response, expected error бүрийг нэм.

4. Responsibility map хий

   Шийдвэр бүрийг frontend, backend, database-ийн аль нэгэнд үндсэн эзэнтэй болго. Давхар validation байвал зорилгыг нь тайлбарла.

5. Success ба error flow зур

   Happy path-аар зогсохгүй network, validation, missing record, database failure-ийг зур.

6. Нэг lifecycle-ийг prose-оор тайлбарла

   Diagram дээрх arrow бүрийг өгүүлбэр болговол алга болсон алхам илүү амархан харагдана.

7. Checklist-ээр review хий

   Өөр хүн уншаад implementation decision таах шаардлага үлдсэн эсэхийг шалга.

Completion checklist

Сонголттой зөвлөмж

• Эхлээд POST урсгалыг бүрэн хий. GET, PATCH, DELETE-д ижил contract pattern хэрэглэж болно.
• API response бүрийн дараа frontend-ийн loading state яаж дуусахыг бич.
• Delete action-д double-click эсвэл давхар request гарвал behavior ямар байхыг бод. Энэ challenge-д idempotency бүрэн шийдэх албагүй.
• Diagram tool хэрэглэхгүй бол monospace text хангалттай.
• Framework нэрнээс өмнө responsibility болон contract-аа шийд.

Эцсийн review асуулт

Өөрийн diagram-ийн нэг arrow-г санамсаргүй сонго. Тэр arrow:

• ямар data авч явж байна;
• аль component эхлүүлж байна;
• дараагийн component юу шалгах;
• амжилт болон алдаанд юу болох

гэсэн дөрвөн асуултад хариулж чадаж байвал design implementation-д ойртсон байна.