Code Music Player Xịn Xò Từ A-Z
– Giải thích cách hoạt động của querySelector.bind(document):
– Link code HTML, CSS mẫu:
– Link full code HTML, CSS, Javascript:
– Link ảnh thiết kế:
Tham gia các khóa học MIỄN PHÍ tại F8 tại đây nhé (đã quyết định theo thì hãy cố gắng đến cùng):
1. Kiến thức & cái nhìn tổng quan về ngành:
2. Code giao diện trang web với HTML, CSS:
3. Xử lý hiển thị tốt giao diện trên nhiều thiết bị khác nhau (responsive):
4. Lập trình Javascript cơ bản:
5. Lập trình Javascript nâng cao:
6. Lập trình Backend với Node & ExpressJS:
—
Các bài hát sử dụng trong video:
1. Vicetone – Nevada
2. K-391 – Summertime [Sunshine]
3. TheFatRat (feat. Laura Brehm)
4. Lost Frequencies feat. Janieck Devy – Reality
5. Đen – Ngày Khác Lạ ft. Giang Pham, Triple D
6. Lemon Tree – DJ DESA REMIX
7. Maroon 5 – Sugar
8. Westlife – My Love
9. Charlie Puth – Attention
10. Monsters – Katie Sky
Bạn muốn học lập trình hiệu quả hơn không?
Hãy học tại trang web thay vì Youtube. Lý do tại sao mời bạn bấm vào đây:
#hoclaptrinh #frontend #html-css #javascript #backend #devops
—————————————
☻ Phần mềm sử dụng trong video:
Công cụ dịch Tiếng Anh:
Công cụ đo đạc giao diện web:
Công cụ viết CV xin việc chuyên nghiệp:
☻ Tiện ích cho Visual Studio Code:
Gợi ý code: Tabnine Autocomplete AI (
Tự động đóng thẻ: Auto Close Tag (
Tự động đổi tên thẻ đóng/mở: Auto Rename Tag (
Thêm màu sắc cho các cặp ngoặc: Bracket Pair Colorizer (
Icon theme: Material Icon Theme (
Hiển thị thông tin Git (commit, author, …): Gitlens (
☻ Khóa học lập trình web MIỄN PHÍ:
Kiến thức cơ bản, cốt lõi cho dân IT:
HTML, CSS từ zero đến Hero:
Xây dựng web responsive:
Lập trình Javascript cơ bản:
Xây dựng web với Node & Express:
HTML, CSS tips:
Ứng dụng cảnh báo khi sờ lên mặt:
Xem thêm tại:
☻ Chú ý :
– Không văng tục chửi bậy, bình luận có văn hóa.
– Không hỏi khi chưa xem xong video.
Sai phạm sẽ được mời khỏi kênh.
☻ F8 là nơi học lập trình để đi làm!
Tại sao bạn nên học lập trình tại đây? Ở đây chúng tôi có:
– Nội dung bài học chỉn chu và chi tiết giúp học viên hiểu từ cái gốc
– Kỹ năng sư phạm khác biệt từ người dạy giúp học viên có thêm nhiều động lực
– Hình ảnh và âm thanh chất lượng cao giúp học viên thêm hứng thú
🍺 Buy me a beer
F8 Official
(c) Sơn Đặng
Website:
Facebook cá nhân:
Nhóm Học Lập Trình Web:
Email: sondnf8@gmail.com
© Bản quyền thuộc về Channel F8 Official ☞ Do not Reup
© Nghiêm cấm sử dụng video nhằm mục đích thương mại dưới mọi hình thức.
*Giải thích cách hoạt động của querySelector.bind(document): https://www.youtube.com/watch?v=6j9b2_E34JM
Nhiệm vụ còn lại dành cho các bạn:
1. Hạn chế tối đa các bài hát bị lặp lại
2. Fix lỗi khi tua bài hát, click giữ một chút sẽ thấy lỗi, vì event updatetime nó liên tục chạy dẫn tới lỗi
3. Fix lỗi khi next tới 1-3 bài đầu danh sách thì không “scroll into view”
4. Lưu lại vị trí bài hát đang nghe, F5 lại ứng dụng không bị quay trở về bài đầu tiên
5. Thêm chức năng điều chỉnh âm lượng, lưu vị trí âm lượng người dùng đã chọn. Mặc định 100%
clip hay qua
23:37
Great video, the program works great
Absolute G <3
E!
A Sơn và ae cho em hỏi chút, em không biến this thành _this, có phải vì lí do đó khi làm đến bước nextSong phút thứ 53:00 thì nextSong của e biến thành constructor đúng k a ???
58:17 đảo cảm xúc cực nhanh :))
cho mình hỏi là mình muốn ad vào góc bên phải blog spot rồi , sau khi ad thành công viết bài kiểu gì ạ
Cám ơn anh, một video tuy dài nhưng vô cùng bổ ích vs những ai đam mê js như e,
Mình không thể get được các element mà được thêm vào dom bằng hàm render như của a sơn. Mọi người ai biết giải thích giúp mình với ạ. Thank all
Cả video chỉ không hiểu đúng đoạn config ạ, ngoằng thật sự :))
Cảm ơn anh Sơn đã làm vid
Anh cho em hỏi về 1 chút về kĩ thuật anh dùng padding-top ở phút 13:39 thì em có tự test thì thấy nếu bỏ đi padding-top thì height của thẻ cha cũng trở về 0 thì cái padding-top có phải thay vì mình viết thêm 1 cái height cho thẻ cha và thẻ con sẽ kế thừa cái height ấy thông qua thuộc tính inherit thì mình ko cần viết height cho thẻ cha mà chỉ cần để padding-top cho thẻ con thì nó cũng sẽ lấp đầy được cái height của thẻ cha đúng ko anh. Nhưng mà chỉ số 100% này nó lại kế thừa từ width của thằng Cha để nó setup cho cúi height của nó vì khi em comment width:100% đi thì width bằng 0*200. Không biết em hiểu như thế có đúng không anh !
cho mình hỏi dùng extension gì để nó gợi ý thuộc tính vậy ạ.
Như 14:25 mình cd. như video mà nó không gợi ý offsetWidth
Anh có thể thêm phần hiện thời gian bài hát vào không?
đến đoạn play tui ko chạy nhạc đc mà nó hiện lỗi này :(( Uncaught (in promise) DOMException: The element has no supported sources.
anh ơi cónếu thay javascript bằng angularthì có thể viết đc ạ
Bạn có thể làm thêm chức năng hiển thị lời karaoke bài hát .lrc như zingmp3, NCT không?
Thiếu phần thời gian của bài hát và thời gian người dùng đang nghe đến phút thứ mấy
Nay xem đúng có không khí tết luôn. Ae nào xem vào 29 điểm danh nào
mọi người cho e hỏi muốn thay bài hát làm như nào ạ ?
mùng 1 năm nay có cái gì nữa không anh ơi
00:04:53 Có cách nào set chiều cao cho position: fixed mà không cần dùng margin cho element tiếp theo không Sơn?
anh ơi em hỏi chút là tại 1:16:13 em không dùng kiểu là ES6 viết cho this.song.map((song,index) => …. mà thay vào đó em dùng function(song,index) {} thì kết quả lại k ra được ạ, đoạn này em chưa rõ ạ, cảm ơn anh ạ
link audio kiểu gì vậy ạ của e toàn bị lỗi ai chỉ e với
Này là ngôn ngữ gì vậy mn
A Sơn ơi, cho em hỏi là em làm thử web này rồi đẩy code lên mạng, nhưng chạy bằng trình duyệt trên iphone thì khi tắt màn hình đi nó ko hoạt động đc tiếp ạ, còn vs android thì vẫn oke ạ. Em tìm cách khắc phục nhưng hình như IOS ko cho web chạy ngầm trên điện thoại nên là việc e muốn nhạc vẫn tiếp tục phát khi tắt màn hình là ko khả thi luôn ạ? E cám ơn a
rất hay anh … <3
Thank a !
cho e hỏi là phần nhạc đã chạy qua thì css như nào vậy ạ. E cám ơn nhiều
cuối cùng thì sau gần 5 tháng thì cũng tới được phần này rồi hơi chậm nhưng thật vui vì bản thận đã lỗ lực hết mình cảm ơn anh Sơn Đặng thật là nhiều ạ
Đoạn 16:16 theo mình mình nghĩ không phải là do kéo nhanh quá đâu mà do scrollTop nó lớn hơn 200 nên newcdWidth = 200 – 300(minh ví dụ) nên nó nhỏ hơn 0
mỗi lần a Sơn bật nhạc chạy thấy anh lắc đầu theo nhìn tếu thiệt :))
cho e hỏi là khi e thử chạy code trên safari của iphone thì khi cho trình duyệt ở background hay khóa màn hình thì code javascript ko chạy tiếp được thì làm sao để khắc phục đc điều này ạ? e cảm ơn ạ :3
anh ơi nhạc của em có 5 bài, nó chạy random hết 5 bài xong thì tự dừng. Bây giờ làm sao cho nó tự động chạy lại cả list nhạc ạ ? Kiểu khi e học bài thì e mở cho list nhạc nó chạy miết vậy đến khi e tắt thì thôi ý :(( anh bày e với
43:50 tại sao "100*e.target.value" thì chạy mà trước đó anh để 100 phía sau thì ko dc chạy ạ? đều là nhân với nhau cả mà? mình chưa hiểu khúc đó, ai giải thích giúp với ạ
anh sơn đẹp trai v :)) kkk
1.
2. đổi onchange thành oninput
3. đổi nearest thành center
4.
5.
anh cho em hỏi lấy link âm nhạc thế nào ạ
Đang định vào học nốt bài của a thì f8 lỗi nên vào lại youtube lun :))
Hay quá anh owiiiiiiiii <3
tu bai BIND sang 😀