Cafedev chia sẻ cho ace một số editor và IDE tốt nhất dành cho dev html từ cái đơn giản chơi tới cái phức tạp

Nhưng cái đơn giản(editor) thông thường người mới dùng nó sẽ rất tốt cho quá trình học, tuy nhiên nếu bạn đã ghét nó rồi thì hãy sử dụng các IDE chuyên nghiệp hơn để nâng cao hiệu suất code

Nội dung chính

• 1. Tìm hiểu HTML bằng Notepad hoặc TextEdit cho người mới bắt đầu
  • 1. 1. Bước 1. 0. Mở Notepad (máy PC, windows)
  • 1. 2. Bước 1. 1 Mở TextEdit (Mac)
  • 1. 3. Bước 2. viết mã html
  • 1. 4. Bước 3. Lưu mã HTML
  • 1. 5. Bước 4. Xem lại code html trên Browser(Chrome, Firefox) của bạn
• 2. Tìm hiểu các IDE chuyên nghiệp khác
  • 2. 1. Văn bản tuyệt vời
  • 2. 2. Mã phòng thu trực quan

1. Tìm hiểu HTML bằng Notepad hoặc TextEdit cho người mới bắt đầu

Các trang web có thể được tạo và sửa đổi bằng cách sử dụng các trình soạn thảo HTML chuyên nghiệp

Tuy nhiên, để học HTML, chúng tôi khuyên bạn nên sử dụng một trình soạn thảo văn bản đơn giản như Notepad (PC) hoặc TextEdit (Mac) cho những người mới học.

Chúng tôi tin rằng việc sử dụng trình soạn thảo văn bản đơn giản là một cách tốt để học HTML, để bạn có thể tự ghi nhớ cú pháp nhanh hơn

Thực hiện theo các bước bên dưới để tạo trang web đầu tiên của bạn bằng Notepad hoặc TextEdit

1. 1. Bước 1. 0. Mở Notepad (máy PC, windows)

• Windows 8 trở lên

Open screen start (biểu tượng cửa sổ ở phía dưới bên trái trên màn hình của bạn). Nhập từ “Notepad” để tìm và mở ứng dụng

• Windows 7 hoặc cũ hơn

Mở Bắt đầu > Chương trình > Phụ kiện > Notepad

1. 2. Bước 1. 1 Mở TextEdit (Mac)

Mở Finder > Applications > TextEdit

Đồng thời thay đổi một số tùy chọn để có ứng dụng lưu tệp với định dạng chính xác. Trong Tùy chọn > Định dạng > chọn “Văn bản thuần túy”

Sau đó, trong phần “Mở và Lưu”, hãy chọn hộp có nội dung “”Hiển thị tệp HTML dưới dạng mã HTML thay vì văn bản được định dạng”(“Hiển thị tệp HTML dưới dạng mã HTML thay vì văn bản đã được định dạng”)

Sau đó mở một tài liệu mới để viết mã

1. 3. Bước 2. viết mã html

Viết hoặc sao chép mã HTML sau đó vào Notepad

My First Heading Cafedev.vn 

My first paragraph Cafedev.

1. 4. Bước 3. Lưu mã HTML

Save file on your computer. Chọn Tệp > Lưu dưới dạng trong menu Notepad

Set name for file is “index. htm” và đặt mã hóa thành UTF-8 (là mã hóa tùy thích cho các tệp HTML)

mẹo. You can't use. htm or. html doing file extension section. Không có sự khác biệt nào, nó tùy thuộc vào bạn

1. 5. Bước 4. Xem lại code html trên Browser(Chrome, Firefox) của bạn

Mở tệp HTML đã lưu trong trình duyệt yêu thích của bạn (nhấp đúp vào tệp hoặc nhấp chuột phải – và chọn “Mở bằng”)

Kết quả sẽ trông giống như thế này

Ngoài ra, bạn có thể viết mã trực tuyến thông qua trang này hoặc nhiều trang tương tự như vậy

2. Tìm hiểu các IDE chuyên nghiệp khác

2. 1. Văn bản tuyệt vời

Sublime Text 3 là một trình soạn thảo văn bản đơn giản tuy miễn phí và mạnh mẽ, hỗ trợ rất nhiều tính năng thú vị. Các điểm mạnh của Sublime Text có thể kể đến như

• Miễn phí (thực tế là bản hủy đăng ký, màn hình hiển thị sẽ hiển thị cửa sổ bật lên thông báo bạn đang dùng thử và nhắc bạn mua chính thức nhưng bạn có thể vượt qua và tiếp tục sử dụng)
• Khởi động nhanh, khởi động nhanh, thu hồi ít tài nguyên
• Nhiều tính năng hữu ích như chỉnh sửa tại nhiều vị trí một lúc, soạn thảo toàn màn hình, soạn thảo với bố cục nhiều cột…
• Hỗ trợ nhiều plugin mạnh mẽ bởi cộng đồng nhà phát triển đông đảo
• Giao diện đơn giản, tinh tế, có sẵn và hỗ trợ cài đặt nhiều theme
• …

You can download it at here

Hiển thị màu mè khi code nhìn trực quan, cao hơn nữa và được coi là nhiều hơn, ace có thể tham khảo thêm về IDE sau

2. 2. Mã phòng thu trực quan

Visual Studio Code hay VSCode là trình soạn thảo code do guy to technology Microsoft sáng tạo và phát triển. Chỉ trong thời gian ngắn trình soạn thảo này đã vượt qua tất cả các trình soạn thảo mã nổi tiếng khác như Sublime text, Brackets, Atom… để trở thành trình soạn thảo mã phổ biến nhất trên thế giới. Nó bao gồm

• Giao diện đẹp, hiện đại và dễ thao tác
• Animated effect, trơn tru
• Dễ dàng tùy biến chức năng nếu như chịu khó mày
• Sử dụng dễ dàng và miễn phí 100%
• Hỗ trợ tối đa và toàn diện cho nhiều ngôn ngữ lập trình
• Số lượng thiết lập trình viên tham gia phát triển mở rộng đông đảo
• Tài liệu hướng dẫn phong phú hơn bất kỳ trình soạn thảo nào khác.

You can download it at here

Sau đây cafedev sẽ chia sẻ thêm cho ace chi tiết hơn về các IDE phù hợp với việc dev các ngôn ngữ nên đặt nền tảng khác nhau

Nếu thấy hay và hữu ích, bạn có thể tham gia các kênh sau của cafedev để nhận được nhiều hơn nữa