Question 1

CSS Module trong React là gì?

Accepted Answer

CSS Modules tự động tạo tên class duy nhất bằng cách thêm hash vào tên class, giúp ngăn ngừa xung đột style giữa các component. Mỗi file CSS Module có scope cục bộ riêng, không giống như các stylesheet toàn cục truyền thống. Cách tiếp cận này cho phép viết các style module hóa mà không có nguy cơ ghi đè ngẫu nhiên trong các component khác.

Question 2

Ưu điểm chính của styled-components là gì?

Accepted Answer

Styled-components cho phép viết CSS trực tiếp trong các file JavaScript bằng template literals, giúp dễ dàng tạo các style động dựa trên props của component. Cách tiếp cận này loại bỏ việc ánh xạ thủ công giữa các class CSS và component, và đảm bảo chỉ các style từ các component được mount mới được chèn vào trang. Việc đặt style cùng với logic component cũng cải thiện khả năng bảo trì code.

Question 3

Làm thế nào để import CSS Module trong một component React?

Accepted Answer

Để import một CSS Module, hãy sử dụng cú pháp import JavaScript tiêu chuẩn với tên file kết thúc bằng .module.css, và gán kết quả cho một biến sẽ chứa một object với các tên class đã được chuyển đổi. Theo quy ước, biến này thường được đặt tên là 'styles'. Các class có thể được áp dụng thông qua thuộc tính className bằng ký hiệu object. Cách tiếp cận này đảm bảo rằng tên class là duy nhất và có phạm vi của component.

Styling & CSS-in-JS

CSS Module trong React là gì?

Câu trả lời

Ưu điểm chính của styled-components là gì?

Câu trả lời

Làm thế nào để import CSS Module trong một component React?

Câu trả lời

Đặc điểm chính của Tailwind CSS là gì?

Nhược điểm chính của inline styles trong React là gì?

Các chủ đề phỏng vấn React / Next.js khác

Nền tảng JavaScript

Nền tảng React

React Hooks

Vòng đời component

React Router

Quản lý state với Context

Biểu mẫu và Controlled Components

Lấy dữ liệu & API

React Query (TanStack Query)

Nền tảng Next.js

TypeScript với React

Data Fetching trong Next.js

Server Actions trong Next.js

Định tuyến & Điều hướng trong Next.js

API Routes trong Next.js

Metadata & SEO trong Next.js

Middleware & Auth trong Next.js

Kiểm thử React

Zustand State Management

Tối ưu hiệu năng React

Error Boundaries & Error Handling

Advanced React Patterns

Tính năng nâng cao của Next.js

Triển khai & Môi trường Production với Next.js

Architecture & Design Patterns

React Server Components

Quốc tế hóa Next.js

React Bảo mật & Thực hành tốt nhất

Nắm vững React / Next.js cho lần phỏng vấn tiếp theo