Top 30+ câu hỏi phỏng vấn Web Developer phổ biến

Ở vị trí Web Developer, bạn phải nắm thật rõ những kiến thức mới có thể thực hành tốt mảng Frontend hoặc Backend mà mình đã chọn. Tuy nhiên đôi khi, sự sâu rộng, phong phú về kiến thức của từng mảng có thể khiến bạn cảm thấy mông lung, không biết bắt đầu từ đâu. Trong bài viết này, ITviec đã hệ thống 30+ câu hỏi phỏng vấn Web Developer thường gặp nhất giúp bạn giải quyết vấn đề trên.

Đọc bài viết sau để nắm vững cách trả lời:

• Các câu hỏi phỏng vấn Web Developer dành cho Fresher và Junior Web Developer
• Các câu hỏi phỏng vấn Web Developer dành cho Middle Web Developer
• Các câu hỏi phỏng vấn Web Developer dành cho Senior Web Developer

Web Developer là gì? Lương Web Developer như thế nào?

Web Developer là những lập trình viên chịu trách nhiệm xây dựng và duy trì các website cũng như các ứng dụng dựa trên web như mạng xã hội (Facebook, Instagram, LinkedIn hoặc các trang thương mại điện tử (Amazon, Shopee, Lazada,…). 

Các Web Developer có thể thuộc một trong ba nhóm: Backend Developer (Lập trình viên Backend), Frontend Developer (Lập trình viên Frontend) và Full-stack Developer (Lập trình viên Full-stack). Ngoài ra, Web Developer còn có vị trí quản trị viên web (Webmasters) – là những người đảm bảo trang web luôn được cập nhật và các liên kết hoặc ứng dụng trên từng trang hoạt động ổn định.

Công việc của một Web Developer thường là:

• Thiết kế giao diện người dùng và menu điều hướng
• Viết và kiểm tra code cho website (thường là HTML, CSS, PHP hoặc JavaScript)
• Tích hợp nội dung đa phương tiện vào website
• Kiểm tra các ứng dụng web
• Khắc phục các vấn đề liên quan đến hiệu suất hoặc trải nghiệm người dùng
• Phối hợp với các nhà thiết kế, lập trình viên, và các bên liên quan

Đọc thêm: Web Developer là gì: Định nghĩa, Trách nhiệm và Lộ trình học tập

Theo Báo cáo Lương và Thị trường Tuyển dụng IT tại Việt Nam 2024 – 2025 mới nhất do ITviec thực hiện, mức lương trung vị của Web Developer như sau:

Khoảng năm kinh nghiệm	Mức lương trung vị (đơn vị: VND/ tháng)
	Back-end Developer	Front-end Developer	Full-stack Developer
< 1	N/A	N/A	14.700.000
1-2	19.200.000	16.100.000	16.650.000
3-4	26.000.000	23.300.000	29.900.000
5-8	45.300.000	34.950.000	39.700.000
> 8	54.500.000	50.950.000	50.000.000

Câu hỏi phỏng vấn Web Developer dành cho Fresher / Junior Web Developer

Theo bạn, Web Developer có gì khác so với Full stack Developer?

Sự khác nhau của Web Developer và Full stack Developer có thể thống kê như sau:

Yếu tố	Web Developer	Full stack Developer
Chuyên môn	Tập trung vào Frontend hoặc Backend	Có kiến thức cả hai mảng Frontend và Backend
Skillset	Chuyên về công nghệ Frontend hoặc Backend	Bộ kỹ năng rộng hơn bao gồm cả front-end và back-end
Công việc cụ thể	Các công việc cụ thể có liên quan đến lập trình UX/UI, kịch bản phía máy chủ (server-side scripting) hoặc tương tác với cơ sở dữ liệu (database).	Đảm nhận tất cả công việc của Frontend Developer lẫn Backend Developer như thiết kế UX/UI, quản lý và triển khai cơ sở dữ liệu.
Tính chất	Phù hợp với các dự án nhỏ hoặc dự án có trọng tâm rõ ràng về Frontend hoặc Backend.	Lý tưởng cho các dự án phức tạp, đòi hỏi sự hiểu biết toàn diện về cả lập trình Frontend lẫn Backend.

Đọc thêm: Phỏng vấn độc quyền ITviec x Toidicodedao: Công việc của Full Stack Developer có gì khác?

Những lợi ích bổ sung của HTTP/2 so với HTTP 1.1 là gì?

So với HTTP 1.1, HTTP/2 có những ưu điểm đáng chú ý như:

• Hiệu suất tốt hơn: HTTP/2 cải thiện tốc độ tải trang và giảm thời gian khứ hồi (RTT) cho các trang web sử dụng nhiều tài nguyên.
• Ghép kênh: Cho phép gửi nhiều yêu cầu đồng thời qua một kết nối TCP, loại bỏ việc chặn đầu dòng.
• Xử lý nhiều tài nguyên: HTTP/2 quản lý hiệu quả nhiều loại tài nguyên (tập lệnh, phông chữ, hình ảnh) hơn so với HTTP/1.1, đáp ứng các yêu cầu web hiện đại.
• Giao thức nhị phân: Sử dụng giao thức nhị phân thay vì giao thức văn bản, tiêu tốn ít băng thông hơn, dễ phân tích cú pháp hơn và ít xảy ra lỗi hơn giao thức văn bản của HTTP/1.1.
• Loại bỏ các vấn đề bảo mật liên quan đến HTTP 1.1, chẳng hạn như tấn công phân tách phản hồi

Hãy cho biết điểm khác biệt giữa HTML và XHTML?

Điểm khác nhau cơ bản giữa HTML và XHTML như sau:

Tính năng	HTML	XHTML
Cú pháp thẻ	Có thể được viết bằng chữ hoa hoặc chữ thường.	Phải được viết bằng chữ thường.
Loại tài liệu	Không nhất thiết phải yêu cầu khai báo DOCTYPE.	Yêu cầu khai báo DOCTYPE, thường ở đầu tài liệu.
Phân tích cú pháp	Trình phân tích cú pháp thường dễ hơn và xử lý lỗi tốt hơn.	Trình phân tích cú pháp nghiêm ngặt hơn so với HTML và sẽ tạo ra lỗi nếu tài liệu không tuân thủ các quy tắc đã đặt ra.
Namespace	Không hỗ trợ namespace XML.	Hỗ trợ namespace XML, cho phép tích hợp tốt hơn với các công nghệ dựa trên XML khác.
Thẻ tự đóng	Cho phép viết các thẻ tự đóng mà không cần dấu gạch chéo đóng (VD <br>).	Yêu cầu các thẻ tự đóng phải được đóng bằng dấu gạch chéo (VD <br/>).

SOAP và REST có những điểm gì khác nhau?

Sự khác biệt giữa SOAP và REST được thể hiện qua 3 ý chính sau:

SOAP	REST
Giao thức (protocol)	Kiến trúc / Phong cách thiết kế (architectural style)
Hoạt động với XML	Hỗ trợ nhiều định dạng: XML, JSON, HTML, văn bản thuần túy
Không thể sử dụng REST	Có thể sử dụng SOAP
Có độ phức tạp cao	Đơn giản và dễ sử dụng
Đòi hỏi nhiều băng thông	Tiết kiệm băng thông

Sự khác biệt giữa SVG và Canvas là gì?

SVG và Canvas là hai thành phần đồ họa trong HTML5 giúp tăng sức hấp dẫn về mặt đồ họa cho trang web. Điểm khác nhau của SVG và Canvas được thể hiện qua 4 tiêu chí cơ bản gồm: Type (loại), Scalability (Khả năng mở rộng), Modification (Khả năng sửa đổi), Performance (Hiệu suất).

Tiêu chí	SVG (thẻ <svg>)	Canvas (thẻ <canvas>
Loại	Đồ họa vector	Đồ họa raster (dựa trên pixel)
Khả năng mở rộng	Khả năng mở rộng cao mà không làm giảm chất lượng, phù hợp cho việc in có độ phân giải cao.	Không phù hợp để in độ phân giải cao do pixel hóa.
Khả năng sửa đổi	Có thể được sửa đổi bằng CSS và tập lệnh.	Chỉ có thể được sửa đổi thông qua tập lệnh.
Hiệu suất	Hoạt động tốt với các ứng dụng kết xuất quy mô nhỏ (đối tượng dưới 10.000).	Hoạt động tốt hơn với các ứng dụng kết xuất quy mô lớn (nhiều hơn 10.000 đối tượng).

Type Coercion trong JavaScript là gì?

Type Coercion trong JavaScript là quá trình tự động hoặc ngầm định chuyển đổi giá trị từ kiểu dữ liệu này sang kiểu dữ liệu khác. Ví dụ, một chuỗi hoặc giá trị boolean có thể được chuyển đổi thành số và ngược lại, một số có thể được chuyển thành chuỗi.

Có hai loại Type Coercion:

• Kiểu rõ ràng (Explicit Type Coercion): Khi lập trình viên chủ động chuyển đổi kiểu dữ liệu bằng cách viết code cụ thể. Ví dụ, sử dụng hàm Number(value) để chuyển đổi một giá trị thành số.
• Kiểu ngầm định (Implicit Type Coercion): Khi JavaScript tự động chuyển đổi kiểu dữ liệu mà không cần lập trình viên yêu cầu, thường xảy ra trong các phép toán.

Việc hiểu rõ cách hoạt động của Type Coercion giúp lập trình viên tránh lỗi không mong muốn khi làm việc với các kiểu dữ liệu khác nhau. Việc sử dụng toán tử === (so sánh nghiêm ngặt) giúp tránh các vấn đề về type coercion.

Trong lập trình web, máy chủ web có nghĩa là gì?

Máy chủ web (web server) là sự kết hợp giữa phần cứng và phần mềm cung cấp nội dung web cho người dùng và lưu trữ các trang web. Nó xử lý các yêu cầu từ trình duyệt web và phục vụ các tài nguyên như tệp và trang web qua internet. 

Về phần cứng, máy chủ web có thể tồn tại dưới dạng máy ảo trên đám mây hoặc dưới dạng máy vật lý trong trung tâm dữ liệu. Thông số kỹ thuật và tài nguyên của máy chủ web phụ thuộc vào khối lượng công việc và lưu lượng truy cập dự kiến. Trong khi đó, phần mềm máy chủ web hoạt động trên nền tảng đám mây hoặc máy chủ vật lý, xử lý các yêu cầu đến trên các cổng cụ thể để phân phối nội dung.

Sự khác biệt giữa đối tượng localStorage và sessionStorage là gì?

Session Storage và Local Storage là hai loại lưu trữ web được sử dụng phổ biến. Trong đó, Session Storage sử dụng đối tượng window.sessionStorage để lưu trữ dữ liệu cho một phiên duy nhất. Dữ liệu sẽ bị xóa khi đóng trình duyệt. 

Ngược lại, Local Storage (Bộ nhớ cục bộ) sử dụng đối tượng window.localStorage để lưu trữ dữ liệu mà không có ngày hết hạn. Dữ liệu có sẵn vẫn còn ngay cả sau khi đóng và mở lại trình duyệt.

Sự khác biệt giữa Android Developer và Web Developer là gì?

Android là một hệ điều hành (Operating System) dành cho thiết bị di động được Google phát triển. Android là mã nguồn mở, điều này có nghĩa là các lập trình viên có thể sửa đổi và tùy chỉnh Android để phù hợp với từng dòng điện thoại.

Web app là phần mềm ứng dụng lưu trữ trên máy chủ từ xa, thực hiện các chức năng cụ thể theo yêu cầu người dùng. Dựa trên mô hình client-server, web app truy cập qua trình duyệt web và kết nối internet. Người xây dựng web app được gọi là Web Developer, chịu trách nhiệm phát triển website hoặc ứng dụng web.

Điểm khác biệt giữa Android Developer và Web Developer về cơ bản như sau:

Tiêu chí	Android Developer	Web Developer
Chức danh công việc	Chuyên gia công nghệ thông tin phát triển ứng dụng cho thiết bị Android.	Chuyên gia công nghệ thông tin phát triển trang web hoặc ứng dụng web.
Lĩnh vực làm việc	Chỉ xây dựng ứng dụng cho nền tảng Android	Xây dựng các ứng dụng không dành riêng cho nền tảng đó
Khả năng truy cập	Có thể được truy cập bằng thiết bị Android và có hoặc không có yêu cầu về Internet.	Có thể được truy cập bằng bất kỳ thiết bị kỹ thuật số nào thông qua trình duyệt và kết nối internet đang hoạt động
Phạm vi hoạt động	Bị hạn chế vì chỉ phát triển ứng dụng cho nền tảng Android.	Không giới hạn ở bất kỳ nền tảng nào vì sản phẩm có thể truy cập các ứng dụng web qua Internet.
Khả năng học tập	Khó học và khó bắt đầu hơn so với phát triển web	Dễ học và dễ bắt đầu hơn so với phát triển Android.
Kiến thức cần có	Có kiến ​​thức về Java, Kotlin, C/C++, XML, Android Studio IDE, kiến ​​thức về API,…	Có kiến ​​thức về PHP, Java, Python, HTML, CSS, JavaScript, web framework, kiến ​​thức về nhiều cơ sở dữ liệu,…
Một số ứng dụng phổ biến	WhatsApp, Facebook, Flipkart, Swiggy,…	Amazon, Facebook, Yahoo, GeeksforGeeks,…

Đọc thêm: Android Developer là làm gì? Lương hấp dẫn đến thế nào?

WYSIWYG là viết tắt của từ gì và được ứng dụng như thế nào trong lập trình web?

WYSIWYG là viết tắt của “What You See Is What You Get” – một cụm từ thường được dùng để chỉ các công cụ thiết kế web cho phép tạo trang web một cách trực quan. 

Trình chỉnh sửa WYSIWYG cho biết các thành phần web sẽ hiển thị như thế nào với người dùng khi lập trình viên chỉnh sửa. Trải nghiệm chỉnh sửa này giúp tiết kiệm thời gian. Ngoài ra, những người không phải là lập trình viên cũng có thể tạo ra nội dung có giao diện chuyên nghiệp mà không cần tốn nhiều công sức viết code.

Câu hỏi phỏng vấn Web Developer dành cho Middle Web Developer

Git có tầm quan trọng như thế nào trong lập trình web?

Trong lập trình web, Git là một công cụ rất quan trọng. Git giúp các công tác làm việc nhóm của các Web Developer trở nên dễ dàng hơn thông qua việc theo dõi những thay đổi trên code để tránh ghi đè lên nhau.

Ngoài ra, Git còn cho phép hợp nhất code, quản lý lịch sử phiên bản và đảm bảo cộng tác hiệu quả giữa các nhóm phân tán. 

Cho biết lợi ích của các mô-đun JavaScript với các tập lệnh truyền thống

Các mô-đun (modules) JavaScript là các tệp code có thể tái sử dụng, cho phép Web Developer nhập và xuất các chức năng bằng cú pháp cụ thể. Phương pháp tiếp cận theo mô-đun này giúp việc lập trình và phát triển web trở nên nhanh chóng, tiện lợi hơn so với các tập lệnh đơn khối truyền thống.

• Quản lý namespace: Các mô-đun đóng gói code trong phạm vi cục bộ, giảm xung đột tên và giảm thiểu ô nhiễm không gian tên toàn cục.
• Khả năng tái sử dụng: Các biến, lớp hoặc hàm có thể được tái sử dụng trên các phần khác nhau của ứng dụng, thúc đẩy nguyên tắc DRY (Không lặp lại chính mình).
• Khả năng bảo trì: Chia code thành các mô-đun nhỏ hơn, có chức năng giúp gỡ lỗi, bảo trì và hiểu dễ dàng hơn.
• Quản lý phụ thuộc: Các câu lệnh nhập và xuất xác định rõ ràng các phụ thuộc, cho phép theo dõi và quản lý dễ dàng.
• Cải thiện hiệu suất: Các công cụ xây dựng JavaScript hiện đại tối ưu hóa việc tải mô-đun, cho phép các kỹ thuật như tree shaking để loại bỏ code không sử dụng và nâng cao hiệu suất ứng dụng web.

Sự khác biệt giữa CMS, DNS, hosting, FTP là gì?

CMS là hệ thống quản lý nội dung, cho phép bạn dễ dàng tạo, chỉnh sửa và quản lý nội dung trên một website mà không cần viết mã phức tạp. Ví dụ: WordPress, Joomla, Drupal.

• DNS là hệ thống phân giải tên miền (ví dụ: example.com) thành địa chỉ IP (ví dụ: 192.168.1.1) mà máy tính sử dụng để định vị máy chủ trên internet.  Ví dụ: Khi bạn gõ google.com, DNS sẽ giúp trình duyệt tìm đến đúng máy chủ lưu trữ Google.
• Hosting là nơi lưu trữ dữ liệu và các tệp của website trên máy chủ (server), giúp website của bạn hoạt động và có thể truy cập từ internet. Các loại Hosting: Shared Hosting, VPS, Dedicated Server, Cloud Hosting.
• FTP là giao thức truyền tệp tin giữa máy tính của bạn và máy chủ hosting. Ví dụ: Dùng FTP để tải tệp mã nguồn website từ máy tính lên server hoặc ngược lại. Công cụ FTP phổ biến: FileZilla, Cyberduck.

Sự khác biệt giữa CMS (Content Management System), DNS (Domain Name System), Hosting và FTP (File Transfer Protocol) được tóm tắt như sau:

	Chức năng chính	Người dùng
CMS	– Cung cấp giao diện trực quan để thêm bài viết, hình ảnh, video. – Tích hợp các plugin, giao diện để mở rộng tính năng.	Người quản lý nội dung hoặc quản trị viên website muốn quản lý website mà không cần kiến thức lập trình sâu.
DNS	– Quản lý các bản ghi tên miền (A, CNAME, MX, TXT…). – Kết nối tên miền với hosting hoặc dịch vụ email.	Quản trị viên mạng hoặc lập trình viên cần cấu hình tên miền.
Hosting	– Lưu trữ mã nguồn, hình ảnh, video, cơ sở dữ liệu của website. – Cung cấp tài nguyên (băng thông, CPU, RAM) để website hoạt động ổn định.	Chủ sở hữu website cần không gian lưu trữ để website hoạt động.
FTP	– Truy cập và quản lý tệp tin trên máy chủ từ xa. – Hỗ trợ tải lên hoặc tải xuống dữ liệu nhanh chóng.	Lập trình viên hoặc quản trị viên cần chỉnh sửa, cập nhật tệp tin trực tiếp trên máy chủ.

Lợi ích của quy ước đặt tên BEM trong CSS là gì?

BEM (Block, Element, Modifier) là một phương pháp luận dùng để đặt tên lớp CSS một cách rõ ràng, có cấu trúc, giúp quản lý và tái sử dụng mã CSS dễ dàng hơn trong các dự án phát triển giao diện.

BEM được sử dụng phổ biến là nhờ những ưu điểm sau:

• Xác định rõ kiểu CSS nào áp dụng cho phần nào của HTML, giúp dễ hiểu và dễ bảo trì.
• Khuyến khích sử dụng các khối mã có thể tái sử dụng, có thể dễ dàng tái sử dụng ở nhiều phần khác nhau của trang web hoặc ứng dụng.
• Duy trì tính nhất quán trên cơ sở mã lớn, giúp mở rộng quy mô và duy trì các dự án lớn dễ dàng hơn.
• Cho phép web developer tách biệt phần trình bày và hành vi của một thành phần, từ đó dễ dàng thay đổi giao diện của thành phần mà không ảnh hưởng đến chức năng của nó.
• Cung cấp không gian tên rõ ràng cho từng phần tử và trình sửa đổi, ngăn ngừa xung đột tên.
• Code CSS viết theo BEM thường dễ đọc và hiểu hơn so với code sử dụng các quy ước đặt tên tùy ý.

Kết xuất phía máy chủ hay SSR có lợi ích gì cho SEO?

 Kết xuất phía máy chủ có thể tác động đáng kể đến SEO vì một số lý do:

• ‍Cải thiện chỉ mục: Cho phép các công cụ tìm kiếm lập chỉ mục và hiểu nội dung của trang web tốt hơn. 
• Thời gian tải nhanh hơn: Các công cụ tìm kiếm sử dụng tốc độ tải trang làm yếu tố xếp hạng. Do đó, trang web tải nhanh hơn có nhiều khả năng được xếp hạng cao hơn trong kết quả tìm kiếm.
• Trải nghiệm người dùng tốt hơn: Với kết xuất phía máy chủ, trang đã được kết xuất đầy đủ khi trình duyệt của máy khách nhận được, mang lại trải nghiệm mượt mà và liền mạch hơn cho người dùng.
• Khả năng thu thập dữ liệu tốt hơn: Với kết xuất phía máy chủ, tất cả các liên kết trên trang đều có trong HTML, giúp công cụ tìm kiếm dễ dàng thu thập dữ liệu và lập chỉ mục nội dung của trang web.
• Giảm trùng lặp: Kết xuất phía máy chủ cũng có thể giúp giảm trùng lặp nội dung bởi nội dung chỉ có trên một URL duy nhất.

Khi muốn di chuyển cơ sở dữ liệu, bạn sẽ làm thế nào?

Xử lý di chuyển cơ sở dữ liệu liên quan đến việc quản lý các thay đổi đối với lược đồ cơ sở dữ liệu và điều chỉnh dữ liệu hiện có cho phù hợp. Một số cách di chuyển cơ sở dữ liệu mà các Web Developer hiện nay thường áp dụng như:

• Sử dụng tập lệnh di chuyển: Tạo các tập lệnh độc lập cho tất cả thay đổi lược đồ, chẳng hạn thêm chỉ mục, cột hoặc bảng, đảm bảo chúng có thể chạy nhiều lần mà không có lỗi.
• Kiểm soát phiên bản: Duy trì các tập lệnh di chuyển trong kiểm soát phiên bản để theo dõi các thay đổi theo thời gian.
• Kiểm tra di chuyển: Áp dụng di chuyển trong môi trường dàn dựng hoặc phát triển trước khi triển khai chúng vào sản xuất để phát hiện các sự cố tiềm ẩn.
• Sao lưu trước khi di chuyển: Luôn sao lưu cơ sở dữ liệu trước khi áp dụng di chuyển trong sản xuất để ngăn ngừa mất dữ liệu trong trường hợp xảy ra lỗi.
• Giám sát và xem xét: Sau khi áp dụng di chuyển, hãy theo dõi hiệu suất của cơ sở dữ liệu và ứng dụng để xác định và giải quyết mọi tác động bất lợi.

Giải thích khái niệm Ứng dụng web lũy tiến (PWA) và những ưu điểm của chúng

Progressive Web App (PWA) sử dụng công nghệ web để mang lại trải nghiệm tương tự như ứng dụng di động. Ưu điểm của PWA gồm:

• Trải nghiệm giống như ứng dụng: PWA phản hồi và thích ứng với các kích thước và hướng màn hình khác nhau. Chúng cũng có thể được cài đặt trên màn hình chính của người dùng, có giao diện giống như ứng dụng với chế độ toàn màn hình và hỗ trợ chức năng ngoại tuyến.
• Tốc độ tải cao: PWA được thiết kế để tải nhanh, cho phép người dùng truy cập nội dung ngay lập tức.
• Thông báo đẩy: PWA có thể gửi thông báo, giống như ứng dụng di động gốc. Người dùng có thể chọn nhận cập nhật, cảnh báo hoặc các tin nhắn được cá nhân hóa khác.
• Khả năng tương thích đa nền tảng: PWA hoạt động trên nhiều thiết bị và nền tảng, bao gồm máy tính để bàn, máy tính bảng và thiết bị di động. 
• Tối ưu hóa cho tìm kiếm: PWA được thiết kế để thân thiện với công cụ tìm kiếm, giúp cải thiện khả năng xếp hạng trên các kết quả tìm kiếm.
• Khả năng làm việc ngoại tuyến: Ngoài tốc độ tải nhanh, PWA còn nổi bật ở khả năng hoạt động ngoại tuyến. Nhờ cơ chế cache, người dùng vẫn có thể truy cập và sử dụng ứng dụng ngay cả khi không có kết nối mạng.

Tường lửa ứng dụng web (WAF) là gì và tại sao nó lại quan trọng đối với bảo mật web?

WAF giống như một vệ sĩ bảo vệ cho các ứng dụng web khỏi nhiều mối đe dọa trực tuyến khác nhau như các cuộc tấn công DDoS và SQL injection. WAF được thiết kế để phát hiện và chặn các cuộc tấn công ứng dụng web phổ biến bằng cách kiểm tra và lọc các yêu cầu đến.

Hơn nữa, WAF liên tục theo dõi lưu lượng truy cập ứng dụng web và áp dụng các quy tắc bảo mật để xác định và chặn hành vi đáng ngờ.

• Phát hiện và ngăn chặn các cuộc tấn công: SQL injection, XSS, CSRF, DDoS, brute-force,…
• Kiểm tra và lọc các yêu cầu: Kiểm tra tính hợp lệ của các tham số đầu vào, xác thực người dùng, ngăn chặn các cuộc tấn công tiêm mã độc.
• Áp dụng các quy tắc bảo mật: Tuân thủ các tiêu chuẩn bảo mật như OWASP Top 10, PCI DSS.
• Giám sát và báo cáo: Thu thập dữ liệu về các cuộc tấn công, tạo báo cáo để phân tích và cải thiện bảo mật.

Trang web tĩnh và trang web động có điểm gì khác nhau?

Trang web tĩnh hiển thị nội dung cho tất cả người dùng. Nội dung trên trang web sẽ không thay đổi trừ khi bạn thực hiện cập nhật thủ công.

Trong khi đó, trang web động cung cấp trải nghiệm thay đổi. Các trang web này tạo hoặc thay đổi nội dung mà không cần sự can thiệp của con người. Thông thường, trang web động có thể cung cấp trải nghiệm được cá nhân hóa.

Câu hỏi phỏng vấn Web Developer dành cho Senior Web Developer

WebSockets là gì và chúng cho phép giao tiếp thời gian thực trong lập trình web như thế nào?

WebSockets là một giao thức giao tiếp cho phép giao tiếp hai chiều thời gian thực giữa máy khách và máy chủ qua một kết nối duy nhất. Không giống như các yêu cầu HTTP khác, là một chiều và không có trạng thái, WebSockets thiết lập một kết nối liên tục.

WebSockets đã trở thành một phần không thể thiếu trong việc xây dựng các ứng dụng web thời gian thực. Chúng cho phép giao tiếp hiệu quả, độ trễ thấp giữa máy khách và máy chủ. Chúng cung cấp nền tảng cho các trải nghiệm web tương tác và hấp dẫn.

Hãy phân biệt sự khác nhau giữa framework và thư viện (library) trong lập trình web

Thư viện cung cấp một tập hợp các hàm hỗ trợ, đối tượng hoặc module mà mã nguồn trong ứng dụng có thể gọi để thực hiện các chức năng cụ thể. Ngược lại, Framework cung cấp các hàm hoặc đối tượng đã được định nghĩa sẵn nhưng chưa được triển khai, cho phép người dùng tự viết mã để tạo ra ứng dụng tùy chỉnh.

Framework	Thư viện
Cung cấp một cấu trúc sẵn có, một khung xương cho ứng dụng của bạn. Nó định nghĩa cách thức các thành phần khác nhau của ứng dụng tương tác với nhau.	Tập hợp các hàm hoặc đối tượng có thể tái sử dụng để thực hiện các tác vụ cụ thể.
Khó có thể thay thế các framework.	Dễ bị thay thế bằng một thư viện khác
Phát triển một framework đòi hỏi nhiều mã làm giảm hiệu suất và tăng thời gian tải.	Thư viện thường tập trung vào một nhiệm vụ cụ thể như xử lý các yêu cầu HTTP, tạo các hiệu ứng động, hoặc tương tác với API.
Không thể đưa framework vào một dự án hiện có một cách trơn tru.	Có thể được tích hợp dễ dàng vào các dự án hiện có để thêm một số chức năng cụ thể.

Giải thích khái niệm CSRF (Yêu cầu giả mạo chéo trang web) và cách ngăn chặn

CSRF (Cross-Site Request Forgery) là một kiểu tấn công mạng, trong đó kẻ tấn công lừa người dùng thực hiện các hành động không mong muốn trên một ứng dụng web mà họ đã đăng nhập.

Để ngăn chặn CSRF, Web Developer có thể thực hiện các cách sau:

Sử dụng mã thông báo CSRF (CSRF Token)

• Ứng dụng gửi mã thông báo CSRF duy nhất tới trình duyệt người dùng.
• Mỗi khi thực hiện yêu cầu quan trọng (POST, PUT, DELETE), mã này phải được gửi kèm để xác thực tính hợp lệ.

Xác thực tiêu đề tham chiếu (Referer Header)

• Kiểm tra tiêu đề “Referer” trong yêu cầu để đảm bảo nó đến từ miền hợp lệ.

Triển khai cookie SameSite

• Sử dụng thuộc tính SameSite trong cookie để ngăn cookie được gửi kèm với các yêu cầu từ miền khác.
• Giảm thiểu nguy cơ yêu cầu trái phép bắt nguồn từ các trang web bên ngoài.

Các thành phần bậc cao (HOC) trong React là gì? Chúng hoạt động như thế nào?

Các thành phần bậc cao (HOC) là các hàm lấy một thành phần làm đầu vào và trả về một thành phần mới với chức năng nâng cao. Chúng cho phép tái sử dụng mã, trừu tượng hóa logic và kết hợp nhiều hành vi trong các thành phần React. 

HOC đóng gói thành phần gốc, thêm props hoặc sửa đổi hành vi của thành phần đó trước khi hiển thị thành phần đó. Các trường hợp sử dụng phổ biến bao gồm xác thực, ghi nhật ký và phân tách mã.

Sự khác biệt giữa <window.onload> và <onDocumentReady>?

window.onload() sẽ được gọi khi DOM và tất cả tài nguyên liên quan đã được tải. Trong khi đó, $(document).ready() sẽ được thực thi ngay khi DOM được tải.

window.onload()	$(document).ready()
Chỉ được gọi khi mọi thứ đã được tải xong.	Đây là một hàm của jQuery được gọi ngay khi DOM được tải.
Đợi cho đến khi tất cả các tài nguyên như hình ảnh, iframe, đối tượng, tập lệnh được tải xong.	Thường dùng để thao tác với DOM, gắn sự kiện, khởi tạo plugin,…
Chỉ có thể có một hàm window.onload()	Có thể có nhiều hàm $(document).ready() trong trang.

Giải thích khái niệm về kiến ​​trúc không máy chủ trong phát triển web

Máy tính không máy chủ (serverless computing) là một mô hình phát triển web và ứng dụng, trong đó Web Developer không cần quản lý máy chủ vật lý hoặc ảo trực tiếp.

Thay vào đó, các nhà cung cấp dịch vụ đám mây (như AWS, Google Cloud, hoặc Azure) xử lý toàn bộ cơ sở hạ tầng, bao gồm cấp phát tài nguyên, mở rộng quy mô, và bảo trì hệ thống.

Web component là gì?

Web Components là một tập hợp các API nền tảng web cho phép lập trình viên tạo ra các thành phần có thể tái sử dụng với chức năng được đóng gói. Web Components gồm ba thành phần chính:

• API Custom Elements cho phép định nghĩa các thành phần HTML với hành vi tùy chỉnh. Các thành phần này có thể được sử dụng giống như bất kỳ thành phần HTML tích hợp nào khác.
• Shadow DOM tạo ra một cây con DOM có phạm vi và bị cô lập trong một thành phần. Điều này cho phép các kiểu được đóng gói.
• HTML Templates cho phép định nghĩa các phần đánh dấu có thể tái sử dụng có thể được khởi tạo nhiều lần.

CSP có ý nghĩa gì trong bảo mật lập trình web?

CSP (Content Security Policy) là một tính năng bảo mật quan trọng trong phát triển web, giúp bảo vệ các trang web khỏi nhiều mối đe dọa mạng, đặc biệt là các cuộc tấn công Cross-Site Scripting (XSS).

Các lỗ hổng XSS liên quan đến việc đưa các tập lệnh độc hại vào trang web. CSP giải quyết vấn đề này bằng cách cho phép các Web Developer thực thi các chính sách quản lý nguồn nội dung có thể được tải. Hơn nữa, CSP cho phép báo cáo và gỡ lỗi, cung cấp cơ chế để Web Developer nhận được các báo cáo hành vi vi phạm chính sách. 

Làm thế nào để đo lường hiệu suất của một ứng dụng web?

Để đo lường hiệu suất của một ứng dụng web, các Web Developer có thể sử dụng nhiều công cụ, kỹ thuật và số liệu khác nhau:

• Sử dụng các công cụ phân tích và lập hồ sơ hiệu suất như Lighthouse, WebPageTest và Chrome DevTools
• Theo dõi các số liệu hiệu suất chính như First Contentful Paint (FCP), Time to Interactive (TTI) và Largest Contentful Paint (LCP)
• Triển khai Real User Monitoring (RUM) và Application Performance Monitoring (APM) để đo lường trải nghiệm của người dùng cuối và hiệu suất phía máy chủ
• Thực hiện kiểm tra tải và kiểm tra ứng suất để đánh giá hành vi của hệ thống trong điều kiện tải lưu lượng truy cập cao

Làm thế nào để dự đoán và khắc phục sự cố trình duyệt bị treo trong Chrome, Firefox và Edge?

Để khắc phục sự cố trình duyệt bị treo, Web Developer có thể thực hiện các cách sau:

• Xác định và xóa các tiện ích mở rộng bị trục trặc

Một tiện ích mở rộng hoặc tiện ích bổ sung bị trục trặc có thể khiến trình duyệt bị đóng băng. Khi này, hãy kiểm tra các tiện ích bổ sung đã cài đặt và xóa những tiện ích bổ sung không còn cần thiết nữa. Quá nhiều tiện ích mở rộng cũng có thể làm đóng băng hoặc làm chậm trình duyệt.

• Giảm mức sử dụng bộ nhớ của trình duyệt

Các trình duyệt tiêu tốn rất nhiều bộ nhớ, đặc biệt là khi mở nhiều tab. Nếu máy tính không có nhiều RAM, trình duyệt có thể chậm lại hoặc thậm chí bị sập.

• Tắt các tập lệnh không cần thiết

Các tập lệnh không cần thiết đang chạy trong trình duyệt có thể khiến trình duyệt bị đóng băng, bao gồm cả tình trạng treo và đóng băng. Có thể nhờ đến sự trợ giúp của các tiện ích bổ sung như NoScript cho Firefox và uMatrix cho Chrome để chặn các plugin như JavaScript, Java, Flash,… 

• Quét phần mềm độc hại

Phần mềm độc hại có thể làm hỏng bảo mật của trình duyệt và gây ra sự cố kết nối. Khi này bạn cần quét phần mềm độc hại trên trình duyệt bằng bất kỳ trình quét phần mềm độc hại cơ bản hoặc tích hợp nào.

Nếu bạn đã thử mọi cách mà sự cố vẫn tiếp diễn, hãy gỡ cài đặt trình duyệt và cài đặt phiên bản mới nhất.

Với tư cách là Web Developer, bạn thường tối ưu hóa thời gian tải ứng dụng web như thế nào?

Bạn tối ưu hóa thời gian tải ứng dụng web của mình như thế nào với tư cách là Nhà phát triển web?

• Nén và tối ưu hóa hình ảnh: Kích thước tệp hình ảnh nhỏ hơn giúp giảm thời gian tải. Sử dụng các công cụ để nén hình ảnh mà không làm giảm chất lượng.
• Sử dụng tệp CSS và JavaScript bên ngoài: Đặt CSS và JavaScript vào các tệp bên ngoài để tận dụng bộ nhớ đệm của trình duyệt và giữ cho các tài liệu HTML nhỏ hơn.
• Giảm thiểu chuyển hướng: Giảm số lượng chuyển hướng trên trang web của bạn để giảm thời gian yêu cầu và phản hồi HTTP, tăng tốc độ tải trang.
• Tải CSS và JavaScript không đồng bộ: Tải các tệp này không đồng bộ để cho phép nhiều tệp tải xuống cùng lúc, cải thiện hiệu suất.
• Thu nhỏ mã: Thu nhỏ HTML, CSS và JavaScript bằng cách xóa các khoảng trắng, chú thích và ký tự không cần thiết để giảm kích thước tệp và tăng tốc độ tải trang.
• Cache dữ liệu: Cache những dữ liệu ít thay đổi, file tĩnh để giảm tải cho trình duyệt. Có thể cân nhắc sử dụng CDN.

Tổng kết

Kiến thức là nền tảng quan trọng giúp bạn hình thành tư duy xây dựng và phát triển kỹ năng hoàn chỉnh cho mình. Bên cạnh những câu hỏi phỏng vấn Web Developer nêu trên, đừng quên cập những thêm những xu hướng mới trong lĩnh vực của bạn nữa nhé. Chúc bạn phỏng vấn thành công.