HƯỚNG DẪN THIẾT KẾ WEB-APP: 12 BƯỚC CƠ BẢN | CO-WELL Asia

Web-app đang là một trong những công cụ vô cùng đắc lực của doanh nghiệp trong việc quản lý nguồn lực nội bộ bởi tận dụng được sự phát triển của khoa học dữ liệu. Thay vì sử dụng các tài liệu giấy hoặc những phần mềm offline để lưu trữ và quản lý dữ liệu, các doanh nghiệp đang dần chuyển hướng sang các phần mềm thông minh hơn. Trong bài viết này, CO-WELL Asia sẽ mang đến hướng dẫn thiết kế web-app để bạn có thể dễ dàng hình dung được quy trình tạo nên loại phần mềm này.

Trước hết, tất cả chúng ta sẽ cùng khám phá những thông tin cơ bản như : Web-app là gì ? Có những hiệu quả như thế nào ? Web-app có gì khác với website hay không ?

Web-app là gì?

Web-app là một một chương trình máy tính được cho phép tương tác, được kiến thiết xây dựng bằng những ngôn từ web ( HTML, CSS, JS ), với chứng năng tàng trữ ( những data, những loại file ) và giải quyết và xử lý tài liệu. Web-app thường được một nhóm hoặc một người dùng sử dụng để triển khai những tác vụ qua internet .

Đây là định nghĩa đơn giản nhất về web-app, bạn có thể tìm hiểu ở bài viết này để đọc thêm định nghĩa web-app, sự khác nhau giữa website và web-app (một nhầm lẫn khá phổ biến), cũng như cách thức mà chương trình này hoạt động.

Đọc thêm: QUY TRÌNH THIẾT KẾ WEB APP

Hướng dẫn thiết kế web app Web app vs Website

Hướng dẫn thiết kế web-app: Điều kiện tiên quyết

Trước khi bắt tay vào kiến thiết xây dựng web-app, nhà tăng trưởng cần phải sẵn sàng chuẩn bị 1 số ít kiến thức và kỹ năng trình độ như sau :

  • Ngôn ngữ back-end (ví dụ: Python, Ruby) – kiểm soát cách web-app hoạt động
  • Ngôn ngữ front-end (HTML, CSS, Javascript) – liên quan đến giao diện, hiển thị cho web-app
  • DevOps (Github, Jenkins) – Triển khai / lưu trữ web-app

Còn giờ đây, hãy khám phá quy trình tiến độ để tạo nên một web-app nhé .

Hướng dẫn thiết kế web-app: 4 giai đoạn – 12 bước xây dựng

Giai đoạn 1: Ý tưởng

Bước 1: Lên ý tưởng

Trước khi bắt tay vào kiến thiết xây dựng web-app, bạn phải hiểu kỹ về những gì bạn cần làm, khởi đầu với câu hỏi tại sao bạn cần loại ứng dụng này, và sẽ sử dụng nó như thế nào .Ý tưởng kiến thiết xây dựng web-app nên mở màn từ một yếu tố nào đó. Ví dụ như với doanh nghiệp, khâu tàng trữ và quản trị thông tin người mua chưa được hoàn thành xong ( không update, không phân loại, không sắp xếp khoa học để hoàn toàn có thể tra cứu ). Từ đó, web-app bạn cần kiến thiết xây dựng chính là giải pháp cho yếu tố này của bạn .Bạn cũng nên chú ý quan tâm tới tính khả thi của ý tưởng sáng tạo. Hãy đặt ra 1 số ít câu hỏi như :

  • Những chức năng nào/ những lợi ích gì mà ứng dụng có thể mang lại?
  • Như thế nào là một ứng dụng tốt?
  • Xây dựng ứng dụng này sẽ mất bao nhiêu nguồn lực (thời gian, chí phí, con người)? Liệu tài nguyên hiện tạị của doanh nghiệp có thể đáp ứng được không?

 

Bước 2: Nghiên cứu thị trường

Bước thứ hai trong bài hướng dẫn thiết kế web-app này, CO-WELL cho rằng, sau khi đã có ý tưởng cho web-app của mình, việc tiếp theo là nghiên cứu thị trường để biết cần làm gì với sản phẩm của mình.

Hướng dẫn thiết kế web app Nghiên cứu thị trường

Trước hết, một số ít thông tin bạn cần điều tra và nghiên cứu là :

  • Đã có một sản phẩm web-app tương tự trên thị trường chưa?
  • Có đối tượng khách hàng nào sử dụng web-app của bạn không?

Nghiên cứu thị trường là một khâu vô cùng quan trọng. Nhiều công ty khởi nghiệp hoàn toàn có thể có sáng tạo độc đáo bắt đầu rất hay nhưng vẫn lụi tàn sớm bởi không điều tra và nghiên cứu thị trường đủ thâm thúy để từ đó tạo ra loại sản phẩm / dịch vụ thực sự tương thích với thị trường .Có một vài công cụ tìm kiếm để bạn hoàn toàn có thể tìm ra xem có mẫu sản phẩm web-app nào tựa như với mẫu sản phẩm không. Một số công cụ được gợi ý là : Google, Patent and trademark search, … Nếu hiệu quả là có web-app như của bạn rồi thì cũng đừng quá lo ngại về việc bị trùng lặp sáng tạo độc đáo. Bởi rất hoàn toàn có thể đối thủ cạnh tranh của bạn đã làm ra loại sản phẩm như vậy trước, tung ra thị trường và người dùng đã không ít có nhận thức về những web-app có công dụng như vậy. Có thể nói là bạn đã được mở đường, bước tiếp theo là cần sở hữu thị trường đó .Còn nếu bạn không tìm thấy một web-app nào tựa như, thì rất hoàn toàn có thể bạn đang là người tiên phong. Mặt khác, cũng hoàn toàn có thể đã từng có loại sản phẩm tương tự như rồi, tuy nhiên lại hoạt động giải trí không hiệu suất cao và đi vào bế tắc .Vì vậy, cách tốt nhất để biết được tiềm năng của thị trường chính là đào sâu khám phá :

  • Thị trường mục tiêu mà web-app của bạn hướng tới

Chia sẻ ý tưởng sáng tạo web-app của bạn trên những forum tương quan đến thị trường tiềm năng của bạn. Nếu bạn biết bất kể ai thao tác trong thị trường tiềm năng của mình, hãy lý giải ý tưởng sáng tạo của bạn cho họ. Càng nhiều phản hồi nhân về, bạn càng có được nhìn nhận khách quan về mẫu sản phẩm của mình .

  • Google trend

Tìm kiếm xem mức độ chăm sóc của thị trường đến loại sản phẩm của bạn .

  • Công cụ SEO

Hãy viết ra list những từ khóa tương quan đến web-app của bạn. Nếu công cụ SEO chỉ ra rằng có rất nhiều người đang tìm kiếm những cụm từ khóa của bạn, thì có một tin vui nhỏ là bạn đã có một thị trường tiềm năng tiềm năng .

  • Social media

Tham gia những nhóm qua Twitter / Facebook và trình diễn ý tưởng sáng tạo của bạn với thị trường tiềm năng .Đến đây, khi đã triển khai xong những bước trên, bạn sẽ có đủ thông tin để hiểu liệu có thị trường cho mẫu sản phẩm của mình hay không .

Bước 3: Xác định các chức năng của web-app

Bạn càng thêm nhiều chức năng thì càng mất nhiều thời gian để xây dựng web-app của bạn. Ở bất kỳ bài viết  hướng dẫn thiết kế web-app nào, người viết cũng chia sẻ rằng, một web-app càng mất nhiều thời gian để xây dựng, bạn càng cảm thấy chán nản, giống như lắp ráp một mô hình cầu kỳ quá lâu mà bạn vẫn chưa xong vậy.

Ví dụ : Một vài tính năng cơ bản của một ứng dụng CRM đơn thuần : Cho phép người dùng :

  • Tạo một tài khoản
  • Lấy lại mật khẩu bị mất
  • Thay đổi mật khẩu của họ
  • Tạo liên hệ mới
  • Tải lên các liên hệ mới
  • Gán một giá trị cho danh bạ
  • Viết ghi chú dưới danh bạ
  • Gắn nhãn một liên hệ là khách hàng tiềm năng, khách hàng hoặc cộng tác viên
  • Lọc địa chỉ liên hệ theo khách hàng tiềm năng, khách hàng hoặc cộng tác viên
  • Xem tổng giá trị của khách hàng tiềm năng, khách hàng và cộng sự

Giai đoạn 2: Thiết kế web-app

Bước 4: Phác thảo

Phác thảo wireframes của giao diện người dùng web-app của bạn. Đây chỉ là bản phác thảo nên bạn hoàn toàn có thể tự do phát minh sáng tạo nhé .Hướng dẫn thiết kế web app Phác thảo wireframeKhi phác thảo, hãy xem xét những điều sau :

  • Dẫn hướng (navigation)
  • Tính thương hiệu
  • Cấu trúc của trang
  • Các button trên trang
  • Các yếu tố tương tác

Hãy phác thảo ra nhiều phiên bản giao diện web-app của bạn, tưởng tượng xem những tính năng mà bạn muốn đưa vào sẽ ảnh hướng thế nào tới web-app .Sau khi phác thảo ứng dụng của bạn, đã đến lúc chuyển sang bước 5 : lên kế hoạch

Bước 5: Lên kế hoạch cho quy trình làm việc của web-app

Để tạo được một quy trình hoàn hảo nhất cho web-app, việc bạn cần làm là đặt mình vào vị trí của người dùng. Trong bước 5 của bài hướng dẫn thiết kế web-app, CO-WELL sẽ gợi ý quy trình làm việc cho web-app của bạn.

Hãy quay lại và xem xét bước 2 – điều tra và nghiên cứu thị trường của bạn. Bạn nên tìm kiếm những mẫu sản phẩm web-app của đối thủ cạnh tranh và ĐK dùng thử. Sau đó bạn hãy take note những điều bạn cho là tốt và không tốt ở những loại sản phẩm này, đặc biệt quan trọng là quy trình tiến độ thao tác của những web-app đó .Sau khi bạn nghiên cứu và phân tích xong những web-app của đối thủ cạnh tranh cạnh tranh đối đầu, đã đến lúc viết ra những tiến trình việc làm khác nhau cho ứng dụng của bạn. Hãy xem xét những điểm sau :

  • Làm thế nào để người dùng đăng ký?
  • Họ có nhận được email xác minh không?
  • Làm thế nào để người dùng đăng nhập?
  • Người dùng thay đổi mật khẩu của họ như thế nào?
  • Cách người dùng điều hướng trong ứng dụng
  • Người dùng thay đổi cài đặt của họ như thế nào?
  • Cách người dùng trả tiền cho ứng dụng
  • Làm cách nào để người dùng hủy đăng ký của họ?

Thế còn với một web-app có nhiều trang, thay vì tổng thể thao tác đều trên một trang thì sao ? Hãy viết list toàn bộ những trang khác nhau mà web-app của bạn sẽ có. Từ đó, bạn sẽ tưởng tượng được những trạng thái khác nhau của những trang. Ví dụ, trang chủ sẽ có hai trạng thái ; đăng nhập và đăng xuất. Người dùng đã đăng nhập sẽ thấy một trang khác với người dùng đã đăng xuất .

Đọc thêm: QUY TRÌNH THIẾT KẾ WEB APP

Bước 6: Thiết kế (Wireframing/ Protopyping)

Wireframing là quy trình lên một bản thiết kế cho web-app. Còn prototyping đưa wireframing lên một bước xa hơn – thêm một màn hình hiển thị tương tác .Quyết định làm wireframe hay prototype là tùy thuộc vào bạn. Nhưng nhìn chung, đây là yêu tố không hề thiếu nó sẽ giúp bạn tưởng tượng được cách bày trí giao diện để thao tác với web-app thuận tiện hơn .Bạn hoàn toàn có thể tạo wireframe / prototype bằng cách sử dụng những công cụ sau :

  • Sketch (macOS)
  • InVision Studio (macOs)
  • Adobe XD (macOS, Windows)
  • Figma (Web, macOS, Windows, Linux)
  • Balsamiq (macOS, Windows, Web)

Bước 7: Thử nghiệm và nhận phản hồi

Sau khi đã có một bản wireframe / prototype thích mắt để diễn đạt trực quan web-app của bạn, hãy đưa bản thiết kế này ra với người dùng thử. Ở quy trình tiến độ này, hãy tích lũy những phản hồi có tính kiến thiết xây dựng .

Nhận phản hồi

Một số chú ý quan tâm trong quy trình dùng thử web-app

  • Bắt đầu từ số lượng người dùng thử nhỏ.
  • Truy cập các diễn đàn của khách hàng mục tiêu (tệp khách hàng mà bạn đã có khi nghiên cứu thị trường) như: Group Facebook, các forum, gửi email marketing chào mời dùng thử.
  • Cho dù chỉ là quá trình thử nghiệm, bạn vẫn luôn cố gắng xây dựng mối quan hệ tốt với người dùng bởi họ chính là khách hàng tiềm năng nhất khi web-app của bạn chính thức “lên kệ.”

Giờ thì bạn đã nhận được phản hồi vô cùng có giá trị. Đã đến lúc bắt đầu xây dựng web-app của bạn.

Bước 8: Khởi công xây dựng – bắt đầu với cơ sở dữ liệu (database) 

Cơ sở dữ liệu là gì?

Cơ sở tài liệu đơn thuần là một tập hợp tài liệu. Dữ liệu hoàn toàn có thể được tàng trữ vào đĩa hoặc trong bộ nhớ trên sever hoặc cả hai. Bạn hoàn toàn có thể tạo một thư mục trên ổ cứng, tàng trữ một vài tài liệu và gọi nó là cơ sở tài liệu .Hệ thống quản trị cơ sở tài liệu là một mạng lưới hệ thống cung ứng cho bạn những API đồng điệu để :

  • Tạo, cập nhật và xóa cơ sở dữ liệu
  • Đọc và ghi dữ liệu vào cơ sở dữ liệu
  • Truy cập an toàn vào cơ sở dữ liệu bằng cách cung cấp quyền truy cập nhiều cấp độ vào các khu vực và chức năng khác nhau
  • Dữ liệu bạn cần lưu trữ và những gì người dùng của bạn cần làm, sẽ xác định loại cơ sở dữ liệu cần thiết để chạy web-app của bạn.

Các loại cơ sở dữ liệu

Có nhiều loại cơ sở tài liệu cho nhiều mục tiêu khác nhau. Web-app thường sử dụng một trong những loại sau :

SQL

Bạn nên sử dụng cơ sở tài liệu SQL nếu tài liệu của bạn có tương quan mật thiết đến nhau. Dữ liệu của bạn được coi là có tương quan đến nhau khi bạn có nhiều loại hồ sơ xác lập rõ có mối quan hệ giữa chúng. Ví dụ : “ Khách hàng ” hoàn toàn có thể có nhiều “ Hóa đơn ” được tàng trữ trong hồ sơ. Thông thường, bạn sẽ tạo bảng Khách hàng và bảng Hóa đơn – bảng này hoàn toàn có thể được link với nhau. Ví dụ. Customer. Id = Invoice. CustomerId .Cơ sở tài liệu SQL chiếm hữu ngôn từ truy vấn cực kỳ can đảm và mạnh mẽ được cho phép bạn trình diễn tài liệu của mình theo tổng thể những cách. MySQL, Postgresql, Microsoft SQLServer là một số ít ngôn từ thông dụng nhất – cùng với nhiều dịch vụ tân tiến hơn .

Documents database

Bạn nên sử dụng document database nếu tài liệu của bạn không tương quan đến nhau nhiều. Document database tàng trữ “ tài liệu ”. Mỗi bản ghi trong cơ sở tài liệu của bạn là một khối tài liệu có cấu trúc lớn – thường ở định dạng JSON .Ví dụ về 1 số ít loại document database là : MongoDb, CouchDb, Firebase ( serverless ), Dynamo Db ( AWS ) .

Tách các cơ sở dữ liệu như thế nào?

Mỗi người mua sẽ có một tập tài liệu riêng. Một trong những điều tồi tệ nhất là để tài liệu của một người mua bị rò rỉ ra ngoài. Ngay cả khi chỉ có một lượng nhỏ tài liệu bị rò rỉ, và những tài liệu này không nhạy cảm, không có thiệt hại nào xảy ra, thì một sự cố này cũng là giảm đi đáng kể lòng tin của người mua vào tính bảo mật thông tin web-app của bạn .Bạn phải kiến thiết xây dựng một kế hoạch vững chãi để tách biệt tài liệu người mua của mình để bảo vệ rằng điều này không khi nào xảy ra .Bạn có hai lựa chọn – Tách vật lý và Tách logic .

Tách biệt vật lý

Mỗi người mua của bạn có một cơ sở tài liệu riêng ( mặc dầu hoàn toàn có thể san sẻ một sever cơ sở tài liệu với những người khác ). Điều này khiến việc mắc lỗi dẫn đến rò rỉ tài liệu trở nên khó khăn vất vả hơn nhiều. Một số đặc thù của việc tách biệt cơ sở tài liệu theo cách này :

  • Ưu điểm:
  • An toàn nhất
  • Có thể mở rộng hơn
  • Nhược điểm:
  • Quản lý, bảo trì và nâng cấp phức tạp hơn
  • Việc truy vấn tất cả dữ liệu khách hàng của bạn cùng nhau khó hơn

Ví dụ : liệt kê toàn bộ Hóa đơn trong cơ sở tài liệu sẽ chỉ trả lại Hóa đơn cho một trong những người mua của bạn. Để nhận hóa đơn của Khách hàng khác, bạn cần liên kết với cơ sở tài liệu khác .Vì mỗi tài liệu của người mua của bạn đều nằm trong cơ sở tài liệu riêng, nên bạn hoàn toàn có thể thuận tiện truyền tải tổng thể chúng trên nhiều sever cơ sở tài liệu mà không cần phải “ phân chia ”. Ứng dụng của bạn sẽ thuận tiện lan rộng ra hơn nhiều theo cách này .

  • Một số loại mã bạn sẽ cần viết:hơo một máy khách mới, bạn cần tạo một cơ sở dữ liệu mới và điền vào bất kỳ dữ liệu gốc nào.
  • Bạn cần lưu trữ ở đâu đó tất cả các khách hàng của mình và cách kết nối với cơ sở dữ liệu của từng khách hàng.
  • Nếu bạn cần nâng cấp cơ sở dữ liệu của mình (ví dụ: thêm bảng mới), bạn cần viết mã để nâng cấp từng bảng riêng biệt.
  • Nếu bạn cần truy vấn tất cả dữ liệu của khách hàng thành một, bạn cần lấy dữ liệu ra khỏi từng dữ liệu và tổng hợp lại.

Tách biệt logic

Giả sử tài liệu về tổng thể những người mua của bạn được tàng trữ trong một cơ sở tài liệu khổng lồ. Mỗi khi bạn cần lấy tài liệu cho một máy khách, bạn cần gồm có một bộ lọc cho máy khách. Ví dụ. ‘ Chọn ’ từ những người mua có customerClientId = 1234 ”. Đặc điểm của tách biệt logic :

  • Ưu điểm :
  • Bắt đầu dễ dàng hơn
  • Dễ dàng bảo trì và nâng cấp hơn
  • Có thể dễ dàng truy vấn tất cả dữ liệu khách hàng của bạn bằng một truy vấn
  • Nhược điểm:
  • Dễ mắc lỗi dẫn đến vi phạm dữ liệu
  • Khó mở rộng quy mô hơn

 

Bước 9: Xây dựng Front-end

Trên thực tế, ta sẽ xây dựng Front-end và Back-end cùng lúc với nhau. Nhưng trong bài viết hướng dẫn thiết kế web-app này này, chúng ta sẽ tìm hiểu về frontend trước.

Frontend ( giao diện người dùng ) là thành phần trực quan của web-app của bạn. Nó xác lập những gì bạn nhìn thấy và tương tác. Giao diện người dùng được tăng trưởng với HTML, CSS và JavaScript. Nếu sử dụng những trang sever, việc mở màn rất thuận tiện. Backend framework của bạn đã được thiết lập xong và sẵn sàng chuẩn bị kiến thiết xây dựng .SPA phức tạp hơn một chút ít. Đầu tiên, bạn cần thiết lập thiên nhiên và môi trường tăng trưởng của mình. Các thành phần của môi trường tự nhiên này sẽ là :

  • Trình chỉnh sửa mã, chẳng hạn như VS Code, Sublime Text
  • Packaging framework
  • Webpack
  • Gulp
  • Grunt
  • Frontend framework (nên sử dụng, trừ khi bạn đã có nhiều kinh nghiệp phát triển):
  • React
  • Ember
  • Vue
  • Svelte

Định thông số kỹ thuật packaging tool của bạn để tiếp xúc với với phần backend – thường chạy trên một cổng khác trên localhost. Bạn có bộc lộ bằng cách sử dụng proxy HTTP của Node .

Bước 10: Xây dựng backend

Bước thứ 10 trong bài hướng dẫn thiết kế web-app này là xây dựng backend. Đây là một khâu vô cùng quan trọng bởi backend chính là thứ quản lý dữ liệu của bạn. Điều này đề cập đến cơ sở dữ liệu, máy chủ và mọi thứ mà người dùng không thể thấy trong web-app.

Khi thiết kế xây dựng web-app của mình, bạn cần chọn giữa :

  • Trang Máy chủ (Ứng dụng Nhiều Trang)
  • Ứng dụng trang đơn

Các việc làm chính của backend sẽ là :

  • Cung cấp HTTP endpoint cho frontend, cho phép nó hoạt động trên dữ liệu của bạn. Ví dụ. Tạo, đọc, cập nhật và xóa bản ghi
  • Xác thực người dùng
  • Ủy quyền: Khi người dùng đã đăng nhập đưa ra yêu cầu, backend sẽ xác định xem họ có được phép (được ủy quyền) thực hiện hành động được yêu cầu hay không.
  • Phục vụ frontend

Nếu bạn đã chọn Trang sever, backend của bạn cũng sẽ tạo frontend và Giao hàng người dùng .Với một ứng dụng trang đơn, backend sẽ chỉ phân phát những tệp frontend tĩnh của bạn ( tức là “ Trang đơn ” của bạn và những nội dung tương quan của nó ) .Quản lý Đăng nhập / Người dùng :

  • Người dùng sẽ xác thực như thế nào?
  • Tên người dùng và mật khẩu?
  • Mở ID (tức là đăng nhập bằng Google, FB, v.v.)
  • Bạn sẽ tạo những cấp độ người dùng nào trong hệ thống?

Bạn thường sẽ cần tạo nhiều thiên nhiên và môi trường. Ví dụ :

  • Thử nghiệm – cho tất cả các tính năng phát triển mới nhất.
  • Beta – cung cấp các bản phát hành sớm cho khách hàng.
  • Sản phẩm – Hệ thống trực tiếp của bạn.

Bước 11: Hosting

Hosting là gì ?Hosting tương quan đến việc chạy web-app của bạn trên một sever đơn cử. Bạn hoàn toàn có thể làm theo những bước sau :

  • Mua miền
  • Mua / Thiết lập chứng chỉ SSL
  • Chọn một nhà cung cấp Cloud:
    Amazon
    MS Azure
    Nền tảng đám mây của Google

Bước 12 – Triển khai

Bạn đã có ý tưởng của mình, xác thực nó, thiết kế và phát triển ứng dụng web và chọn nhà cung cấp dịch vụ hosting. Bây giờ bạn đang ở bước cuối cùng của bài viết hướng dẫn thiết kế web-app: triển khai.

Các công cụ tăng trưởng sau phân phối năng lực tích hợp liên tục và sẽ giúp bạn tiến hành ứng dụng web lên dịch vụ tàng trữ đám mây của bạn :

  • GitLab
  • Bitbuckets
  • Jenkins

Để mở màn, bạn chỉ hoàn toàn có thể tiến hành trực tiếp từ máy tính của mình .

KẾT

Trên đây là hướng dẫn thiết kế web-app do CO-WELL tổng hợp. Hy vọng bài viết này đã cung cấp cho bạn những thông tin cần thiết để bạn có thể đào sâu hơn trong quá trình chinh phục loại phần mềm vô cùng thú vị này.

CO-WELL Asia là đơn vị chức năng chuyên phân phối dịch vụ tăng trưởng website và ứng dụng. Với kinh nghiệm tay nghề hơn 10 năm tăng trưởng cho những người mua Nước Ta, Nhật Bản, … CO-WELL tự tin sẽ mang lại dịch vụ, loại sản phẩm tốt nhất để những người mua doanh nghiệp hoàn toàn có thể tận dụng lợi thế của công nghệ thông tin trong việc nâng cao doanh thu, quản trị nguồn lực nội bộ .Nếu bạn có nhu yếu thiết kế xây dựng website, ứng dụng, đừng ngần ngại LIÊN HỆ với CO-WELL để được tư vấn trọn vẹn không lấy phí !

Đọc thêm: QUY TRÌNH THIẾT KẾ WEB APP