4. Install Extensions Visual studio code - hướng dẫn cài đặt vscode extension để lập trình web

❤️ Donate ủng hộ phát triển kênh| Momo: 0975812064
Số TK : 0975812064 Ngân hàng TPBank - Chủ tài khoản: Phạm Trung Kiên
✅ Nếu thấy video hay và bổ ích hãy like và chia sẻ để mình biết
Các bạn đang quan tâm nhiều đến chủ đề nào và phát triển tiếp cho nội dung đăng sau này
✅ Đăng ký kênh để không bỏ lỡ video: dangky.tuhoc.cc
Playlist Video :
✅Lập trình web HTML-CSS-JS : web.tuhoc.cc/
✅Lập trình Android với kotlin : kotlin.tuhoc.cc/
✅Lập trình java : java.tuhoc.cc/
✅Lập trình C++ : c.tuhoc.cc/
✅ selenium C# : selenium.tuhoc.cc/
✅ ffmpeg cut, ghép video cực nhanh : ffmpeg.tuhoc.cc/
✅C# cơ bản cho người mới: csharp.tuhoc.cc/
✅ Python căn bản cho người mới: python.tuhoc.cc/
✅ pygame lập trình game cho người mới : pygame.tuhoc.cc/
✅ opencv python : opencv.tuhoc.cc/
✅ clip động lực để học tập : dongluc.tuhoc.cc/
#htmlcss #html5 #htmlcsswebsite
Xin chào mọi người!
Hôm nay, trên kênh KZbin của tuhoc.cc, chúng ta sẽ tiếp tục hành trình khám phá Visual Studio Code với chủ đề thú vị: "4. Install Extensions Visual Studio Code - Hướng dẫn cài đặt vscode extension để lập trình web".
Visual Studio Code (VS Code) là một trình soạn thảo mã nguồn mở mạnh mẽ và phổ biến trong cộng đồng lập trình. Tuy nhiên, một trong những lợi ích chính của VS Code là khả năng mở rộng thông qua các extension. Điều này cho phép chúng ta tùy chỉnh và mở rộng khả năng của trình soạn thảo để phù hợp với nhu cầu lập trình của mình.
Trong video mới này, chúng ta sẽ đi sâu vào việc cài đặt các extension quan trọng cho lập trình web trong Visual Studio Code. Tôi sẽ giới thiệu cho bạn một số extension phổ biến và hữu ích, như "Live Server", "HTML CSS Support", "Prettier", và nhiều hơn nữa. Chúng sẽ giúp bạn tăng năng suất, sửa lỗi tự động, và cung cấp các tính năng hỗ trợ khi phát triển ứng dụng web.
Qua video này, bạn sẽ được hướng dẫn từng bước cụ thể về cách tìm kiếm, cài đặt và quản lý extension trong VS Code. Tôi sẽ chia sẻ những gợi ý và bí quyết để bạn có thể tận dụng tối đa khả năng của các extension này, và từ đó nâng cao hiệu suất lập trình của mình.
Nếu bạn đang muốn nâng cao kỹ năng lập trình web của mình và tìm kiếm những công cụ hữu ích để làm việc hiệu quả hơn, video này là dành cho bạn. Đừng bỏ lỡ cơ hội học tập và khám phá cùng tôi trên kênh KZbin tuhoc.cc!
Hãy nhớ subscribe kênh và bật thông báo để không bỏ lỡ bất kỳ video hữu ích nào trong tương lai. Cảm ơn bạn đã theo dõi và hãy bắt đầu cuộc hành trình cùng tuhoc.cc ngay bây giờ!
Chúc bạn một ngày vui vẻ và thành công trong việc lập trình web!
more video about : Install Extensions Visual studio code - hướng dẫn cài đặt vscode extension để lập trình web
• Hướng dẫn cài đặt VSCo...
• 15 Extensions VS Code ...
• Top 10 VSCode Extensio...

[@vinhtramquang8047]

Nội cái phần cài thôi đã chi tiết kinh khủng. Mến thầy ở điểm đó. Đó công sức của thầy đã làm ra nhưng video đầy chất lượng như vậy. Con yêu thầy.

[@ango-eu6sz]

Cảm ơn thầy đã hướng dẫn. Con đg tự học 2 tháng hè để đi học chính thức cho đỡ bỡ ngỡ

[@linhdinh1807]

hướng dẫn gì mà nhiệt tình quá thầy ơi ! mong thầy tiếp tục hướng dẫn chi tiết như vậy !

[@user-xi1fg4qg5p]

Trời ông thầy này xịn xò kinh khủng. Bài giảng cực kỳ chi tiết, rất tận tâm luôn. Tự nhiên có động lực học lập trình vì thầy. Cám ơn thầy nhiều và chúc thầy nhiều sức khỏe

[@aolequang4484]

lần đầu tiên thấy 1 người dạy có tâm như vậy em cảm ơn thầy em sẽ follow thầy và xem video của thầy thương xuyên hơn.

[@emPIlu]

cảm ơn tác giả rất nhiều em tự học rất hay 🥰🥰🥰🥰

[@user-dw3wj9vg2h]

Thầy dạy rất hay ạ mong kênh phát triển hơn nữa❤❤

[@longthanh914]

Dạ em cảm ơn thầy đã chia sẽ những kiến thức bổ ích này ạ

[@yennguyen-nk7ky]

Hướng dẫn vô cùng chi tiết ạ.Cảm ơn anh 👍

[@user-dw3wj9vg2h]

Thầy dạy rất hay ạ ❤❤

[@nhatduynguyenbui6739]

làm rất có tâm, chúc anh nhiều sức khỏe

[@dovihogaming4859]

Bài giảng thật sư rất hay và rất hữu ích, cảm ơn thầy.

[@JustTreee]

Dinh qua anh oiiii , e cam on anh nhieu , qua chi tiet luon a

[@minhkhoavo5807]

rất hay, em cám ơn anh nhiều

[@HUYPK0809]

hay quá thầy ơi

[@Ngduck06]

hay quá thầy

[@user-wf5qc1cx6j]

Hay quá

[@technologymobile5385]

rất chi tiết

[@SonNguyen-uw7it]

Dùng ctrl shift p dùng emmet wrap cũng được

[@nguyencanh8369]

Thanks

[@tuyennguyenvan9800]

anh ơi em gõ vs code js nhưng trong code toàn hiện dấu "" mà k sửa về thành dấu ' ' này đc mong anh tl ạ

[@vankhanhle7177]

âm thanh nói nhỏ quá lần sau tăng tiếng lên nha bác :3

😘 mình sẽ kiểm điểm bản thân nha 😜😜

[@TuanPhuong-td7cu]

Của e html hiện giao diện xong e tạo CSS IMG thử nhưng không hiện giao diện màu, e làm theo mà k đc

[@ManNhi_tl]

go❤

[@binhthai9103]

em ko pt sao h tự dưng ấn h1 ko ra gợi ý như trước nữa

[@datnguyenquy2386]

a ơi e dùng cái prettier nó format cái lorem10 toàn thành kiểu lorem10 chứ cái p không trên 1 dòng thì phải lms ạ

e vào setting ( hoặc nhấn phím tắt Ctrl + dấu , ) -> Nhìn sang góc phải trên cùng có biểu tượng tờ giấy có mũi tên , ngay dưới nút - thu nhỏ cửa sổ . chỉ vào nó hiện chữ open setting (JSON) , xóa toàn bộ code trong đó thay bằng code dưới đây xem sao nhé. Đây là code trên vs code của a : { "workbench.colorTheme": "Default Dark+", "editor.formatOnSave": true, "files.autoSave": "afterDelay", "debug.console.fontSize": 16, "markdown.preview.fontSize": 16, "terminal.integrated.fontSize": 16, "editor.accessibilityPageSize": 14, "[html]": { "editor.defaultFormatter": "vscode.html-language-features" }, "liveServer.settings.donotShowInfoMsg": true, "editor.linkedEditing": true, "editor.defaultFormatter": "esbenp.prettier-vscode", "workbench.iconTheme": "material-icon-theme", "git.autofetch": true, "git.enableSmartCommit": true, "git.confirmSync": false, "cSpell.language": "en,vi", "files.autoSaveDelay": 5, "liveServer.settings.wait": 3, "liveServer.settings.fullReload": true, "editor.scrollbar.horizontalScrollbarSize": 16, "editor.fontSize": 17, "liveServer.settings.donotVerifyTags": true, "terminal.integrated.defaultProfile.windows": "Git Bash", "git.openRepositoryInParentFolders": "never", "emmet.syntaxProfiles": { "html": { "inline_break": 1 } }, "window.zoomLevel": 2, "editor.minimap.enabled": false }

[@user-gb8yk4of9l]

sao em f1 maf ko ra anh nhi

[@TienNguyen-mi8dd]

Tất cả các dự án mình làm thì mặc định dự án tên là index hả ad

file index.html là 1 file đặc biệt. trình duyệt sẽ tìm đến file này để ưu tiên hiển thị e nhé. e thử đổi tên đi mà xem 😁

[@rikshe]

Hd chi tiết quá ạ nhưng sao font chữ trên màn hình hơi nhỏ và nhòe ạ

e chỉnh video youtube lên 1080 xem

[@ThanhNguyen-lj8jr]

nhiều extension như vậy có nặng máy k a tại lap e chip i5 hơi yếu

Nó nhẹ hều ý mà e, có nặng thì thằng chrome nó hút ram thôi 😄

[@tinhNguyen-jx4pp]

heart

[@LamNguyen-ey4kn]

Thầy ơi, Phần Show live serve preview em cài rồi, hiện lên trang màu trắng nhưng văn bản nó không xuất hiện thầy ạ huhuhu thầy giúp em với (đã viết code giống thầy), kể cả phần Go live để xem cũng chỉ hiện trang màu trắng chứ không hiển thị văn bản ạ!

[@kiennguyentrung2618]

save chưa bro

[@Le-he4rt]

tại sao em cài live server preview rồi gõ show live server preview nó kh ra zậy anh ,em bấm f1 trên bàn phím thì nó chỉ tắt âm lượng

laptop e ấn thử Fn + F1 nhé

[@tuhocwebsite]

Cài icon them vs code trực tiếp trong extension của vs không được hả a ,sao phải vào google?

Được e ạ, cứ nhớ tên tìm là cài được. Qua google để nhiều khi có bạn nào tìm kiếm các tiện ích trên google thì cũng biết add vào vscode cho linh động. Để cho biết thêm hướng cài ý mà

[@ThinhTran-lo3wh]

anh ơi sao anh để tiếng việt mà gõ h1 xong nhấn enter nó cũng ra như khi mình để tiếng anh là cài thế nào ạ

hi e, a không bị lỗi đấy. 1. a dùng evkey chứ không dùng unikey. 2. e kiểm tra ngôn ngữ trên win. để là english nhé và dùng thêm evkey thử.

[@ucminhpham8548]

Cho em hỏi cái live sever Khi mà em chọn go live thì nó có thông báo sever started, nhưng mà lại không hiện trang lên thì phải làm sao ạ?

e có đang ở tab index.html không nhỉ. xem win nó có hỏi chọn trình duyệt không e nhé.

[@ucminhpham8548]

@ nó không hiện hỏi chọn trình duyệt ạ

[@ucminhpham8548]

@ cái này em chuyển sang dùng cái edge extension được ko ạ? Tại em thấy nó cũng tương tự

được e. dùng cái nào tiện thì dùng. còn cái này nữa này marketplace.visualstudio.com/items?itemName=ms-vscode.live-server

[@ThaoNguyen-ri3xj]

Biểu tượng con rệp để đo các box đó tên j v a?

e cài extension chrome này nhé : chromewebstore.google.com/detail/pesticide-for-chrome/bakpbgckdnepkmkeaiomhmfcnejndkbi?pli=1

[@user-dw3wj9vg2h]

Thầy ơi chỗ cài live server preview sao em nhấn f1 k ra chỗ tìm kiếm vậy ạ😢

e check xem cài thành công chưa, thử tắt bật vscode xem sao nhé

[@tiendang4322]

tại sao image preview lại không hiển thị được ảnh nữa nhỉ mặc dù e thử gỡ đi tải lại

tắt vscode bật lại thử xem e. với lại nếu e chèn link online thì nó cũng o hiện dc. e để ảnh trong thư mục hay online nhỉ

[@tiendang4322]

@ e để trong thư mục lại k hiện, nma chèn link online có cái hiện có cái không

[@MD-bd9hh]

Dạ anh ơi cho em hỏi, làm sao để gõ được tiếng việt trên VSC vậy ạ, em gõ nó cứ bị kiểu: Xin chafo moij nguoi

e dùng hệ điều hành gì nhỉ ?

[@MD-bd9hh]

Dạ em dùng win10 ạ

[@MD-bd9hh]

Em code trên scrimba rồi copy dán vào VS Code thì nó ra được tiếng việt, nhma em code trực tiếp trên VS Code thì nó bị kiểu: xin chaof moij nguoifw

[@Bau-vy7xb]

thầy ơi, cái Go live em ấn vào sao nó k tự mở trang web ạ

e có đang ở tab file index không nhỉ. Kiểm tra xem win nó có hỏi em chọn trình duyệt để mở không nhé

[@Bau-vy7xb]

win k hỏi chọn trình duyệt luôn thầy ơi =((

@@Bau-vy7xb e cài extension này,sau khi cài, chuột phải index.html chọn show preview là xong

[@Bau-vy7xb]

@ vẫn v thầy ạ☹️, thôi chắc chịu khó shift alt r thôi thầy

@@Bau-vy7xb vào discord kênh pm a luôn a ultraview qua xem nào.

[@laptrinhcc]

Trên vs code của e không thấy chữ Go live anh có thể giúp e hiện thị nó ra được không

e cài xong extension chưa. ktra kỹ lại nhé.

[@laptrinhcc]

@ e cài extension rồi ạ .E đã tìm ra rồi ạ ,e đã tắt hiển thị thanh status bar,và e đã bật lên rồi ạ ,cám ơn a vì những video hữu ích,chúc a một ngày tốt lành

@@laptrinhcc oki e. chúc e học tốt nhé. a còn đang đi viện khám . kkk.

[@laptrinhcc]

@ anh không khoẻ à ,chắc hồi trước a bị covid ,nên sức khỏe bị ảnh hưởng đó...,chúc anh mau khỏe nhé! ❤️

@@laptrinhcc dạo này ngủ ít làm video đâm ra người yếu e ạ. đang bị rối loạn tiêu hóa. 🥲

[@user-dw3wj9vg2h]

Thầy dạy rất hay ạ mong kênh phát triển hơn nữa❤❤