React Cơ bản ( React Router, React Context, UseState, UseEffect, UseNavigate, Axios,…)

[@DanielTruongDev]

// App.css *, *::before, *::after { box-sizing: border-box; padding:0; margin: 0; } body { background-color: #fae1dd; min-height: 100vh; scroll-behavior: smooth; text-rendering: optimizeSpeed; line-height: 1.5; padding:1rem 2rem 1rem 2rem; font-size:1.25rem; letter-spacing: 0.15rem; font-family: 'Inter', sans-serif; } .page-container{ display:flex; justify-content:center; height: 100vh; } // dogs.css .dogs-container { display: flex; flex-direction: row; width: 100%; flex-wrap: wrap; justify-content: space-between; margin-top: 4rem; text-align: center; } .dogs { background-color: #d8e2dc; padding: 1rem; border-radius: 14px; width: 350px; height: 450px; margin-bottom: 1.5rem; display: grid; align-items: center; grid-template-areas: "img info" "img info" "desc desc" "price price" "btn btn"; } .dogs-info { grid-area: info; } .dogs-img-container { grid-area: img; width: 150px; height: 150px; overflow: hidden; } .dogs-desc { grid-area: desc; } .dogs-price { font-weight: 700; margin: 1rem 0 1rem 0; grid-area: price; } .dogs-btn { padding: 0.35rem; border-radius: 14px; cursor: pointer; background-color: #e8e8e4; grid-area: btn; border: none; font-size: 1.25rem; transition: 100ms ease-in-out; } .dogs-btn-disabled { padding: 0.35rem; border-radius: 14px; background-color: #94d2bd; grid-area: btn; border: none; font-size: 1.25rem; transition: 100ms ease-in-out; } .dogs-btn:hover { background-color: #0a9396; color: white; } .dog-img { width: 100%; width: 120px; height: 120px; object-fit: cover; border-radius: 50%; } //cart.css .cart-container { display: flex; flex-direction: column; align-items: center; } .cart-items { text-align: center; margin-top: 4rem; background-color: #f8f9fa; box-shadow: 0px 0px 15px 5px #fec5bb; border-radius: 14px; font-size: 1.5rem; padding: 2rem; } .cart-item { display: flex; align-items: center; margin-bottom: 3rem; } .cart-header { font-size: 2rem; font-weight: 800; } .cart-item-img { border-radius: 50%; object-fit: cover; width: 70px; height: 70px; margin: 0rem 2rem 0 0; } .cart-total { font-weight: 800; } .cart-checkout { border: none; background-color: #fec5bb; border-radius: 14px; padding: 1rem; margin-top: 2rem; cursor: pointer; font-size: 1.5rem; transition:200ms ease-in-out; } .cart-checkout:hover, .cart-gohome:hover{ background-color: #ff8fa3; } .cart-gohome { border: none; background-color: white; border-radius: 14px; padding: 1rem; margin-top: 2rem; cursor: pointer; font-size: 1rem; transition:200ms ease-in-out; }

[@trungthienvo9235]

Thích giọng Nam và phong cách nói rất chuẩn tự nhiên, hay. Cám ơn!

[@luminshz]

Công nhận anh dạy dễ hiểu thật. Em từ Backend qua giờ muốn học thêm React để làm Fullstack mà còn quá nhiều khái niệm mới đối với em mà em nghe anh giảng thấy vô đầu hẳn luôn. Chúc anh luôn thành công trong cuộc sống ạ!

[@blackvlog4529]

bạn dạy hay quá , dễ hiểu thực sự , mình xem nhiều kênh mà tìm mãi được kênh thực chiến như vậy thank pro

[@kienthuc5phut97]

Cám ơn bạn, phải công nhận giữa người có mục đích dạy thật và mục đích kiếm học viên khác nhau hoàn toàn, mình coi mấy kênh khác nói vòng vo cuối cùng k hiểu gì luôn, xem kênh bạn đi thẳng vấn đề nhanh gọn!

[@VuNguyen-lh1rd]

Thề anh dạy cực dễ hiểu, chứ em xem ở các kênh lớn khác, lý thuyết nhiều nên kh đọng lại gì trong đầu, xem của a phát hiểu ngay vấn đề.

[@Lalakids-khamphacungbe]

thank pro. I learn a lot from you. You are mastering reactjs

[@Chovye]

Quá đẳng cấp bạn ơi học được từ bạn rất nhiều. Tks u !

[@anhkhoavo3295]

Lần đầu e mới xem a mà em thấy hay dễ hiểu nữa cảm ơn anh. Mong anh sẽ ra nhiều video mới nữa

[@hoanghuy.trannn]

Coi rất dễ hiểu và thực tế, đã ấn sub kênh của bạn liền luôn :>. Cảm ơn bạn đã chia sẻ kiến thức.

[@nguyenquangtienk16dn9]

Trời ơi giá như biết sớm hơn các video về React của anh thì em đã không rớt môn :(((

[@hungcoder6122]

rất hay cảm ơn bạn

[@moon2510]

Dạ anh dạy hay quá ạ! Em cũng mới bắt đầu học React, coi video này dễ hiểu ạ

[@hunglequoc7343]

hi vọng anh ra thêm mấy khóa node vs nextjs với công nghệ cho tương lai

[@myhanhnguyen5198]

anh day rat de hieu a.Cam on anh Duy rat nhieu. Em thich coi cac video cua anh. Anh oi, bao gio ranh anh ra video day ve backend voi cac du an mongDB, PostgreSQL di anh ah, voi ca anh day them ve cach su dung AWS Lambda nua nhe!

[@donaldjsdarius]

dù đã học rồi nhưng xem lại thì vẫn cuốn, video bạn làm hay lắm :v

[@21.obuiphuonglinh78]

bạn nói rất hay và dễ hiểu mặc dù mình không hiểu gì nhưng sẽ support kênh của bạn ạ 😇

[@K.Huynh.]

Em cảm ơn anh rất nhiều. qua em có gặp lỗi mà được anh hỗ trợ rất tận tình.

[@kivathang9655]

Cực dễ hiểu lun . Mong bạn ra thêm nhiều video hơn nữa ạ 👍👍

[@DanielTruongDev]

cảm ơn b đã ủng hộ ^^

[@bachkhoait4.052]

Bạn dạy rất dễ hiểu . Đã ấn like đăng kí để ủng hộ , mong bạn sớm ra những video tiếp theo from lào cai

[@chieesntra]

Rất dễ hiểu ạ, em cảm ơn anh

[@DanielTruongDev]

=))) ok em

[@DuyAnh-xz8dm]

Cảm ơn bạn video rất bổ ích

[@haibangngo7357]

ban day de hieu qua ban,ban lam them video ve React duoc khong

[@Eatkakamy]

hay và dễ hiểu à mong anh có thể ra video nhiều hơn , hướng dẫn cách dùng redux thì tốt quá ạ em học mãi mà vẫn mơ hồ về redux

[@DanielTruongDev]

nó tương tự cái React Context á em, để có gì anh làm video về Redux, Redux tool kit

[@vutrungquan782]

Em ko thấy phần fe trong github ạ anh xem lại giúp em với

[@tuanthamlam2274]

có 1 vấn đề là từ trang mycart chuyển sang dogs thì button added nó chuyển sang lại add to cart. có cách nào giải quyết không ạ

[@tunginh9523]

anh để vid lên 2k được không tại em thấy vid cua anh 1080p mà nó cứ như 480p á

[@hoangson8609]

Hay quá anh

[@phanvantri3516]

*Thanks a .Bổ ích*

[@anhtuan6027]

anh cho em hỏi cách xem folder frontend trên repo ạ

[@tranvandung5361]

A zai có thời gian làm hẳn series nodejs vs reactjs đi ạ

[@trieunguyentuan4589]

Làm về Mutil layout với v6 này đi bạn

[@tuananh1023]

Thấy anh post bài trên group Cộng đồng sinh viên IT em vào thả like để lưu lại mấy hôm nữa chứ chuẩn bị thi giữa kì chưa xem được ngay

[@DanielTruongDev]

thanks e nhe, chúc e thi siêu tốt :D

[@HuongLe-gj4mt]

anh ơi link git của anh folder frontend em thấy trống, anh update lại được ko ạ :((

[@dohainam0611]

Phần cuối ....xin chào tạm biệt á...chỉnh lại ....do tiếng chạy trc hình...khắc phục trong video sau nhé

[@DanielTruongDev]

ừa =))) mà th lỡ r

[@tranchicuong4141]

Quality

[@tolikbui4391]

41:31 lm kiểu j để nó chia ra dòng nhanh thế mn

[@DanielTruongDev]

b cài extension Prettier trong VSCode nha

[@baonguyenduonggia8532]

Anh có thể up lại link github k ? phần fronend không có ? tiện thể cho hỏi tý em gặp lỗi này mà k biết giải quyết sao cả Uncaught TypeError: Cannot read properties of undefined (reading 'map')

[@vunguyenviet191]

hình như bạn thiếu dấu {}

[@vunguyenviet191]

nên nó k hiểu map là gì ?

[@ngocdiepnguyen213]

E ơi chỗ lấy data từ backend sao chị làm như e hướng dẫn mà bị lỗi này: '"Invalid options object. Dev Server has been initialized using an options object that does not match the API schema. - options.allowedHosts[0] should be a non-empty string." E xem fix giùm chị với. Thanks e đã ra những video chị xem rất hay và dễ hiểu!

[@DanielTruongDev]

chị vào Discord hỏi cho tiện nha

[@ngocdiepnguyen213]

@@DanielTruongDev chị vào gửi câu hỏi rồi mà ko biết tạo có đúng ko nữa vì lần đầu chị biết cái discord này

[@Hehe-xq5sn]

ví dụ muốn add sp vào card nhưng mà muốn xóa đi sp thì xử lý ntn ạ

[@nhatbui229]

lấy cái id của dogs xong slice cái id đấy đi thôi

[@inhhunghoang4694]

Mong anh làm vuejs với expressjs

[@DanielTruongDev]

mình chưa xài vuejs bao h 😅

[@NamNguyen-qp1gk]

Chào bạn,bài rất hay.nhưng link git bị lỗi phải kh nhỉ,mình vào để lấy init dog mà kh vào đc

[@DanielTruongDev]

à để mình sứa lại link github, thanks b

[@ThanhTran27507]

anh học trường gì vậy ạ

[@DanielTruongDev]

Cal state fullerton á b

[@zpeng2004]

cho ban 1 sub ne , yeu yeu

[@huannguyenanh5332]

hi bạn, mình đã add "proxy": "localhost:8080" vào package.json những vẫn lỗi settle.js:19 Uncaught (in promise) AxiosError {message: 'Request failed with status code 404', name: 'AxiosError', code: 'ERR_BAD_REQUEST', config: {…}, request: XMLHttpRequest, …} nhờ bạn chỉ giáo giùm, tks

[@KuNhiRonaldo]

mình cũng bị lỗi này. Ko biết fix kiểu sao nhỉ. Bạn fix được chưa

[@vietlinh1219]

@@KuNhiRonaldo b thử xóa folder backend của b đi xong cop nguyên folder backend của a vào xem sao, lúc đầu tôi cũng vừa xem vừa làm theo cũng bị lỗi như thế xong cop của anh vào thì hết lỗi

[@KuNhiRonaldo]

@@vietlinh1219 cảm ơn bạn. Mình làm đc rồi nha

[@_kira2104]

@@vietlinh1219 cảm ơn bạn nhé, nếu có ai biết được lý do tại sao cop folder backend của daniel hết lỗi thì mọi người chỉ giúp với nha