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 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 đã rành về nó rồi thì hãy 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
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 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 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ự 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: Open Notepad (máy PC, windows)
- Windows 8 or later:
Mở màn hình 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ở app.
- Windows 7 or earlier:
Mở Start > Programs > Accessories > Notepad
1.2. Bước 1.1 Open TextEdit (Mac)
Mở Finder> Applications > TextEdit
Đồng thời thay đổi một số tùy chọn để có được ứng dụng lưu tệp với định dạng chính xác. Trong Preferences > Format > chọn “Plain Text”
Sau đó, trong “Open and Save”, hãy chọn hộp có nội dung “”Display HTML files as HTML code instead of formatted text”(“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 để code.
1.3. Bước 2: Viết code html
Viết hoặc sao chép code HTML sau vào Notepad:
<!DOCTYPE html>
<html>
<body>
<h1>My First Heading Cafedev.vn </h1>
<p>My first paragraph Cafedev.</p>
</body>
</html>
1.4. Bước 3: Lưu code HTML
Lưu tệp trên máy tính của bạn. Chọn File > Save as như trong menu Notepad.
Đặt tên cho tệp là “index.htm” và đặt mã hóa thành UTF-8 (là mã hóa ưa thích cho các tệp HTML).
Mẹo: Bạn có thể sử dụng .htm hoặc .html làm phần mở rộng tệp. Không có sự khác biệt, nó là 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 code online thông qua trang này or nhiều trang tương tự vậy.
2. Tìm hiểu các IDE chuyên nghiệp khác
2.1. Sublime Text
Sublime Text 3 là một text editor đơ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 ra là bản unregistered, thỉnh thoảng hiện sẽ ra pop-up thông báo bạn đang dùng thử và nhắc bạn mua bản chính thức nhưng bạn có thể bỏ qua và tiếp tục sử dụng)
- Nhẹ, khởi động nhanh, tốn í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 layout nhiều cột…
- Hỗ trợ nhiều plugin mạnh mẽ bởi cộng đồng developer đông đảo
- Giao diện đơn giản, tinh tế, có sẵn và hỗ trợ cài đặt nhiều theme
- …
Hiển thị màu mè khi code nhìn trực quan, cao hơn nữa và được ưa chuộng nhiều hơn, ace có thể tham khảo thêm về IDE sau.
2.2. Visual Studio Code
Visual Studio Code hay VSCode là trình soạn thảo code do gã khổng lồ công nghệ Microsoft sáng tạo và phát triển.Chỉ trong một thời gian ngắn trình soạn thảo này đã vượt qua tất cả những trình soạn thảo code nổi tiếng khác như Sublime text, Brackets, Atom… để trở thành trình soạn thảo code 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
- Hoạt động hiệu quả, trơn tru
- Dễ dàng tùy biến chức năng nếu như chịu khó mày mò
- Dễ sử dụng và miễn phí 100%
- Hỗ trợ tối đa và toàn diện nhiều ngôn ngữ lập trình
- Số lượng lập trình viên tham gia phát triển extension đô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
Sau nà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ảng khác nhau.
Nếu bạn 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:
Chào thân ái và quyết thắng!
