Tech TutorBangla Web Documentation
Portfolio
HomeHTMLCSSTailwind CSSJavaScriptTypeScriptReactNext.jsNode.jsExpressSocket.IOExpoWordPressPostgreSQLPrismaPostgresNestJSMongoDBDockerTanStackTanStack TableRTK QueryGitGitHub
  • TypeScript Documentation28টি অধ্যায়
প্রযুক্তি নির্বাচন
HomeHTMLCSSTailwind CSSJavaScriptTypeScriptReactNext.jsNode.jsExpressSocket.IOExpoWordPressPostgreSQLPrismaPostgresNestJSMongoDBDockerTanStackTanStack TableRTK QueryGitGitHub
  • Introduction
  • Installation
  • Basic Types
  • Variables & Inference
  • Functions
  • Objects
  • Type Alias
  • Interface
  • Union & Intersection
  • Type Narrowing
  • Type Guards
  • Enums
  • Generics
  • Classes
  • Utility Types
  • Type Assertion
  • Async TypeScript
  • Conditional Types
  • Mapped Types
  • Template Literal Types
  • tsconfig Options
  • Modules & Types
  • Decorators
  • React + TypeScript
  • Node.js + TypeScript
  • JS → TypeScript
  • Common Errors
  • Mini Project
  1. Docs
  2. TypeScript
  3. প্র্যাকটিক্যাল মিনি প্রজেক্ট (Todo CLI)
TypeScriptAdvanced

প্র্যাকটিক্যাল মিনি প্রজেক্ট (Todo CLI)

টাইপ-সহ কনসোলভিত্তিক todo app — types, functions, main ও run — Real-world প্রয়োগের পূর্ণ চিত্র।

10টি অংশবাংলা ভাষায়

এখন পর্যন্ত যা শিখলেন তা এক সুন্দর ছোট প্রজেক্টে জুড়ে দেখুন — একটি টাইপ-সুরক্ষিত Todo CLI।

Step 1: Types

src/types.tstypescript
typescript
export type TodoStatus = "pending" | "done";

export interface Todo {
  id: number;
  title: string;
  status: TodoStatus;
  createdAt: Date;
}

export type NewTodo = Omit<Todo, "id" | "createdAt">;

Step 2: Store (State + Logic)

src/store.tstypescript
typescript
import type { NewTodo, Todo, TodoStatus } from "./types";

export class TodoStore {
  private todos: Todo[] = [];

  add(input: NewTodo): Todo {
    const todo: Todo = {
      ...input,
      id: this.nextId(),
      createdAt: new Date(),
    };
    this.todos.push(todo);
    return todo;
  }

  toggle(id: number): void {
    const todo = this.todos.find((item) => item.id === id);
    if (!todo) throw new Error("Todo পাওয়া যায়নি");
    todo.status = todo.status === "pending" ? "done" : "pending";
  }

  byStatus(status: TodoStatus): Todo[] {
    return this.todos.filter((item) => item.status === status);
  }

  private nextId(): number {
    return this.todos.length
      ? Math.max(...this.todos.map((t) => t.id)) + 1
      : 1;
  }
}

Step 3: Main

src/index.tstypescript
typescript
import { TodoStore } from "./store";


const store = new TodoStore();

store.add({ title: "TypeScript শেখা", status: "pending" });
store.add({ title: "Mini project লেখা", status: "pending" });

store.toggle(1);

function printList(status: TodoStatus): void {
  const items = store.byStatus(status);
  console.log(status.toUpperCase() + ":");
  items.forEach((todo) => console.log("  [" + todo.id + "] " + todo.title));
}

printList("pending");
printList("done");

Step 4: Run

# dev (tsx)
npx tsx src/index.ts

# production
npx tsc
node dist/index.js
কোথা থেকে এগোবেন?

এখন File system (fs) ও readline এ রূপান্তর করুন — storage-এ file, UI-তে ইন-অ্যাকশন। API-দ্বারা cloud storage যোগ করলে intermediate-advanced অনুশীলন পূর্ণ হবে।

শেষ প্যারায় নিজে practice করুন — কোড কপি করে নিজের এডিটরে চালিয়ে দেখুন।
আগেরসাধারণ TypeScript Error ও সমাধানTypeScript ডকুমেন্টেশন হোম
এই পেজে
Tech Tutor

বাংলায় ওয়েব ডেভেলপমেন্ট ডকুমেন্টেশন শিখুন — ধাপে ধাপে।

Homeসব ডকুমেন্টেশনQuick Startআমার নোটস

© 2026 Tech Tutor. বাংলায় শিখুন, বাংলায় গড়ুন।

mdanamolhasan1998@gmail.com