import {Meta} from '@storybook/addon-docs/blocks'

<Meta title='@dxtmisha/vi/functional-basic/! Giới thiệu'/>

# [@dxtmisha/functional-basic](https://github.com/dxtmisha/dxt-ui/tree/main/packages/functional-basic)

`@dxtmisha/functional-basic` là một tập hợp các hàm và lớp tiện ích nhỏ cho phát triển web hàng ngày. Thư viện không phụ thuộc vào framework và có thể sử dụng trong bất kỳ dự án TypeScript nào — từ Vue, React cho đến code trình duyệt thuần.

## Cài đặt

Để bắt đầu sử dụng thư viện trong dự án của bạn, hãy cài đặt qua npm:

```bash
npm i @dxtmisha/functional-basic
```

## Tại sao cần thư viện này?

Hầu hết các dự án web đều gặp các tác vụ tương tự nhau: yêu cầu API, xử lý ngày tháng, cookie hoặc trạng thái tải. Thay vì sao chép các hàm này giữa các dự án, chúng tôi tập hợp chúng lại ở đây để dễ dàng tái sử dụng.

Đây không phải là một framework phức tạp, mà chỉ là một tập hợp các công cụ đơn giản: bạn có thể chọn chỉ những gì cần thiết cho tác vụ cụ thể của mình.

## Thư viện làm được gì?

Thư viện hỗ trợ các tác vụ phổ biến trong quá trình phát triển:

Về **mạng** — một HTTP client cơ bản hỗ trợ hook, bộ nhớ đệm và chỉ báo tải. Điều này cho phép bạn xử lý các yêu cầu mà không cần thêm các dependency bên ngoài nặng nề.

Về **bản địa hóa và địa lý** — phát hiện quốc gia và ngôn ngữ người dùng, mã điện thoại, cờ quốc gia và định dạng dữ liệu qua API `Intl`. Nó cũng bao gồm các công cụ dịch thuật giao diện.

Về **quản lý trạng thái** — các wrapper đơn giản cho `localStorage`, `sessionStorage`, `cookie` và URL hash. Chúng giúp lưu trữ dữ liệu giữa các phiên làm việc với hỗ trợ của TypeScript.

Về **SEO** — công cụ quản lý thẻ `<title>`, Open Graph và Twitter Card. Giúp cập nhật các thẻ meta trong cả môi trường trình duyệt và SSR.

Về **xử lý dữ liệu** — các tiện ích để sao chép sâu đối tượng, xử lý mảng, chuyển đổi kiểu an toàn và định dạng chuỗi.

Về **tìm kiếm và lọc** — các hàm để khớp văn bản và tìm kiếm dễ dàng qua các danh sách dữ liệu phức tạp.

Về **sự kiện và phát tin** — các công cụ để giao tiếp giữa các thành phần hoặc các tab trình duyệt (qua `BroadcastChannel`).

Về **DOM và UI** — các hàm helper để làm việc với phần tử, thuộc tính, hình ảnh, clipboard và cuộn trang.

## Dành cho ai?

Thư viện dành cho các nhà phát triển muốn sử dụng các giải pháp phổ biến cho các tác vụ đơn giản thay vì phải viết lại từ đầu mỗi lần. Nó hoạt động tốt cho cả các script nhỏ và các ứng dụng lớn hơn.

Mặc dù là một phần của hệ sinh thái `@dxtmisha`, nó có thể được sử dụng độc lập trong bất kỳ dự án nào.

## Nguyên tắc

- **Tối giản** — thư viện không sử dụng dependency bên ngoài, giúp việc bảo trì dễ dàng hơn.
- **Hỗ trợ TypeScript** — tất cả các công cụ đều được định nghĩa kiểu dữ liệu để cải thiện trải nghiệm lập trình.
- **API rõ ràng** — tên phương thức và hành vi của chúng được thiết kế để dễ dự đoán.
- **Được kiểm thử** — các chức năng chính được kiểm thử đầy đủ để đảm bảo tính ổn định cơ bản.

## Git

[https://github.com/dxtmisha/dxt-ui/tree/main/packages/functional-basic](https://github.com/dxtmisha/dxt-ui/tree/main/packages/functional-basic)
