Hướng dẫn cài môi trường html
Show Mục tiêu của bài viết này là giúp bạn cài đặt môi trường để thực hành các bài học lập trình tiếp theo. Mình sẽ không dài dòng, không giới thiệu quá nhiều các ngôn ngữ, các IDE hay Text Editor mà chỉ tập trung làm sao bạn có thể cài đặt môi trường nhanh nhất, chuẩn nhất và dễ tiếp cận cũng như phổ biến nhất trên thế giới. Cài đặt công cụ cần thiết để học lập trìnhCài đặt Visual Studio CodeĐể bắt đầu lập trình một website, chúng ta cần một nơi để viết những dòng code của mình và lưu chúng lại. Các lập trình viên khác nhau lại sử dụng những IDE và Text Editor khác nhau, bạn không cần bận tâm họ dùng công cụ gì vì kết quả nó trả ra là như nhau cả. Hãy chỉ chọn 1 công cụ để code và hãy sử dụng thành thạo nó. Đây là lời khuyên tốt nhất. Anh A dùng Webstorm để code, anh B dùng Sublime Text, anh C dùng Visual Studio Code, … đừng lo lắng, vì đơn giản họ thích dùng phần mềm đó và họ đã quen sử dụng nó rồi. Bạn cũng hãy chọn cho mình một phần mềm để đồng hành cùng bạn thôi. Ở bài viết này, mình sẽ hướng dẫn các bạn cài đặt và sử dụng Visual Studio Code, một Text Editor hoặc cũng có thể gọi là Code Editor phổ biến được nhiều lập trình viên trên thế giới lựa chọn và sử dụng nhất. Quan trọng là nó nhẹ và miễn phí. Để so sánh IDE và Text Editor, bạn có thể tham khảo bài viết Sự khác nhau giữa IDE và Text Editor để biết thêm kiến thức chém gió với ae bạn bè, thực chất, kiến thức này không quan trọng. Tải Visual Studio Code tại đây. Lựa chọn phiên bản phù hợp với hệ điều hành bạn đang sử dụng và ấn và download. Việc cài đặt giống nó cũng đơn giản như mọi phần mềm khác. Visual Studio Code viết tắt là VS Code, hỗ trợ cả hệ điều hành Windows và MacOS. Sau khi download và cài đặt thành công, mở VS Code lên. Mình sẽ hướng dẫn cài một số plugin hỗ trợ cho các bạn code nhanh hơn và đẹp đẽ hơn trong quá trình viết code sau này. Cách cài plugin cho VS Code, những plugins hữu íchKhi đã mở VS Code, nhìn vào cột công cụ ngoài cùng bên tay trái, chọn Extensions icon , trên thanh tìm kiếm, hãy gõ tìm kiếm “Atom One Dark Theme” và ấn Install. Sau khi cài đặt xong hãy Enable nó lên nhéMàu sắc của VS Code đã thay đổi trông đẹp mắt và mềm mại hơn rồi đó. Có rất nhiều Theme cho VS Code, bạn có thể lựa chọn một theme khác phù hợp với phong cách của mình nhé. Quay lại thanh tìm kiếm, cài tiếp cho mình một số plugin sau với thao tác tương tự như trên:
Những plugin này mình thường sử dụng trong quá trình code. Chúng giúp mình code nhanh hơn và đẹp hơn,… các bạn cứ cài theo mình đi nhé. Cài đặt trình duyệt ChromeCó rất nhiều browser (trình duyệt) mạnh mẽ và phổ biến hiện nay nhưng trong series những bài hướng dẫn này, mình hi vọng bạn sẽ sử dụng Chrome để đồng bộ môi trường với mình nhé. Bạn có thể tải Chrome ở link này. Cài Chrome plugin Mate TranslateNếu các bạn đang sử dụng Chrome để duyệt web thì để thuận tiện trong quá trình dịch tiếng anh sang tiếng việt, plugin này cho phép bạn nhấp chuột 2 lần vào từ tiếng anh muốn dịch để xem bản dịch. Các bạn có thể download tại đây. Lời kếtBây giờ, bạn đã sẵn sàng để bắt đầu thực hành viết những dòng mã HTML đầu tiên, tạo ra website của chính mình. Tài liệu này sẽ giúp các bạn cài đặt môi trường làm việc để sắn sàng cho khoá học Các bước cần thực hiện:
1. Tải và cài đặt VSCode#
2. Tải và cài đặt NodeJS#
3. Cài đặt VSCode extension#Bật chế độ Format on save#
Cài extention Live Server#
4. Cài package surge.sh#
5. Thử deploy một website đơn giản#
noteTrong đó:
Chúc các bạn thành công nhé! 😉 |