[Phần 2] Tạo trò chơi web chỉ trong 30 phút với AI.

Hôm nay, tiếp nối công việc trước đó, tôi đã tiến hành tách mã và thêm một vài chức năng.

Trước tiên, tôi đã yêu cầu tách nguồn mã ban đầu, trong đó html, js và css đều nằm trong cùng một file.

Câu hỏi 9: Hãy viết lại cấu trúc mã nguồn tích hợp ở trên thành các file html, js và css riêng biệt.

-> Tách thành 3 cấu trúc: index.html, game.js và styles.css

Câu hỏi 10: Trong mã nguồn trên, hãy thêm một vùng trạng thái hiển thị thông tin nhân vật ở bên trái màn hình console và bổ sung các chức năng liên quan.

-> Thêm thanh bên trái cố định và bổ sung/sửa đổi chức năng liên quan trong game.js để luôn hiển thị thông tin trạng thái.

Câu hỏi 11: Trong mã nguồn trên, hãy thêm nút và chức năng sử dụng điểm kỹ năng trong cửa sổ trạng thái.

-> Vì trước đây điểm kỹ năng được nhập trực tiếp vào cửa sổ alert nên tôi đã yêu cầu điều chỉnh. Giờ đây, nếu có điểm kỹ năng, nút sẽ được kích hoạt để người dùng có thể sử dụng trực quan hơn.

Câu hỏi 12: Trong mã nguồn trên, khi thắng trận, hãy cho phép quái vật rơi vàng tùy thuộc vào cấp độ của quái vật và hiển thị số vàng thu được trong cửa sổ trạng thái.

-> Đã bổ sung chức năng rơi vàng và điều chỉnh để hiển thị số vàng trong cửa sổ trạng thái bên trái.

Qua 4 câu hỏi trên, giao diện và cấu trúc đã được cải thiện đáng kể, tạo tiền đề cho việc bổ sung các chức năng khác như cửa hàng trong tương lai.

Tôi sẽ tiếp tục mở rộng bằng cách thêm chức năng cửa hàng (vật phẩm hồi phục, v.v.) và hệ thống kỹ năng.

https://ggoban.com/hof/