Cảm ơn các bạn đã xem video của mình nhé 😍 Bạn nào đã hiểu cách chia component rồi thì thả tim cho mình biết cái nè ❤️ Nếu có thắc mắc hay muốn trao đổi thêm về việc chia component với mình thì hãy bình luận bên dưới nhé. hehe
Tks anh, video rất hay ạ, em có câu hỏi nếu đc a giải đáp giúp em: Ví dụ e có container manage product render component list product. Trong đó có modal chỉnh sửa product, e nên sử dụng các state ( các thông tin về product ) ở container hay trong component vậy a? Vì e sử dụng Formik trong modal nhưng có 1 số field e k quản lý bằng formik mà phải sử dụng state ( do mới xài formik nên 1 số field e k tích hợp vô đc ). Nếu sử dụng state của container khi gõ chữ hơi lag còn để state ở component thì mượt hơn. Mong a giải đáp giúp e, em cảm ơn
hi Ngọc, có một số thứ cần lưu ý ở đây nè 1. State em đặt ở container là đúng rồi nhé. 2. Việc quản lý form, em nên để component riêng biệt nó tự quản lý lấy, đừng cập nhật trực tiếp lên container. Khi nào submit thì mới đẩy lên container xử lý và cập nhật state trên container nha. Em coi video này để hiểu cách đẩy phần form ra một component riêng nha th-cam.com/video/HbERbcazLhY/w-d-xo.html Hi vọng giải đáp được thắc mắc của em 🙂
hi Trung, hiện thì a hk có full series về ReactJS cơ bản nè 🙂 Anh chỉ dự định làm project thực tế thôi nhen Trung. Hiện thì đang có cái series project thực tế reactjs va redux nè 😉
Mình thấy có một vấn đề như này: giả dụ vì một lý do nào đó mà state/props của thằng container thay đổi dẫn đến việc phải re render lại toàn bộ components trong container. để hạn chế vấn đề này mình thường cho các component trong container tự lấy tự xử lý dữ liệu giảm bớt việc re render lại toàn bộ. Còn ý kiến của bác thì như thế nào ?
hi Vũ, một câu hỏi hay nè, mình xin trả lời như sau: 1. Khi component mà Vũ cho xử lý dữ liệu, thì nó đã thành container rồi. 2. Container có thể chưa container con, nên việc của Vũ làm là hợp lý nhé. 3. Nếu việc re-render của component nó độc lập với các components khác thì bạn làm như vậy là hoàn toàn hợp lý. Nên theo mình, nếu trường hợp của Vũ là như vậy thì mình hoàn toàn đồng ý nhé! Cảm ơn Vũ đã đặt câu hỏi cho mình nhen 👍
Chuyên Bún's hihi hên quá, đúng video đúng thời điểm 😍 Cảm ơn bạn nhiều nha 😉 Nếu có phần nào khó bạn có thể gợi ý mình để làm cho những video sau nha 🙂
Mình có thắc mắc thế này mong bạn giải đáp: - Ví dụ mình ko call API ở HomePage mà cho ProductList (lastest recipes) là container và call API ở đây > sau đó truyền props xuống cho dumb cmp là ProductDetail (card) thì có được không? Vì mình thấy thế này, nếu có gì đó ảnh hưởng tới 1 container lớn như HomePage chẳng hạn thì việc re-render lại toàn bộ container này là có và kéo theo là call API & re-render các cmp con ko cần thiết. Mong bạn giải đáp, cám ơn bạn. Chúc bạn sức khỏe và thành công.
hi Tâm, cảm ơn bạn đã đặt câu hỏi cho mình, mình xin giải đáp thắc mắc như sau: 1. Container HomePage có thể chứa container con ProductList. 2. Nhưng nếu bạn cho ProductList thành container, thì bạn sẽ không tái sử dụng được. Ví dụ HomePage muốn có ProductList 6 items, qua trang ProductSearch muốn có ProductList 12 items thì bạn làm thế nào? Vậy nên mình không nên cho ProductList làm container nhé. 3. Về việc re-render, bạn dùng PureComponent giúp mình, cái này nó sẽ giúp mình ko re-render nếu props hoặc state không thay đổi. 4. Còn trường hợp bạn vẫn muốn tách cái ProductList đó, thì hãy tạo ra một ProductContainer chẳng hạn. HomePage chứa ProductContainer ProductContainer sẽ gọi API và render cái ProductList. Hi vọng giải đáp được thắc mắc của bạn. 🙂
@@EasyFrontend cám ơn bạn đã giải đáp cho mình. Nãy mình có kết bạn trên FB, rất mong những video sắp tới của bạn về React nói riêng và FE nói chung. 😄
hi Steven, về phần này khá đơn giản nên mình dự định ko có làm nữa nè, thay vào đó mình chỉ làm một project thực tế cho mọi người thực hành thôi. Hiện bạn có đang gặp khó khăn gì về reactjs hk nhỉ? 🙂
hi em, cơ bản nó là component trả về component cộng thêm một số thứ gì đó em nhen hehe hiện anh hk có plan để làm video về topic này nè, tại anh chuyển sang dùng hooks òi, hk có dùng HOC nữa :)
chào a, e vừa nhảy ngang qua tìm hiểu reactjs, react-native, những phần về cấu trúc tệp, thư mục này a có thể chia sẻ cho e ít src để tham khảo vs dễ hiểu hơn đc k ạ?
ở thời điểm hiện tại thì anh hk có phân biệt trong cây thư mục nữa em nha ý tưởng là dùng càng nhiều UI components càng tốt, logic nằm ở ít components thôi, thường là page-level, hoặc nếu phức tạp quá thì dưới page-level một bậc
giả dụ như home page em không tương tác với api, em gọi luôn 4 component kia và k truyền gì qua cpn recipelist cả, vì em muốn component nào tương tác với api thì chia ra 2 file 1 file render ra ui giống như anh nói cho gì render đó, còn 1 file tương tác với api, anh thấy cách làm này sao anh
hi Dũng ơi, cách này được nhé em, cơ bản là thay vì dồn lên hết page level thì mình chia nhỏ ra tí, 1 page có nhiều container, mỗi container sẽ phụ trách việc xử lý data, xong pass data xuống UI component render lên là xong hehee.
hi Lâm, cảm ơn bạn đã quan tâm nhé. Cái này thiên về chia sẻ, tâm sự, chắc mình gom lại một video để giải đáp cho các bạn nhé. :) Hiện cho mình xin hỏi tí, Lâm hiện có đang làm gì với js/reactjs hk?
Khải Lâm hi Lâm, em có nắm được JS vững hk? với nó còn tư duy lập trình, kĩ thuật lập trình và các thuật toán nữa, nên nếu chưa có thì em đọc thêm tài liệu tìm hiểu nhen 🙂
hi Thanh, em có thể tham khảo series hooks, rồi redux và cái mới nhất là series về redux saga em nha, toàn là mini project ko á em 😉 Em xem các playlist ở đây nhen: th-cam.com/users/EasyFrontendplaylists
AmlfD NT lol cảm ơn bạn nhiều nha 😍 Ngày mai sẽ có một cái về reactjs component life cycle vào 9h tối nhé. Riêng bạn có yêu cầu làm video về chủ đề gì hk? 🙂
Easy Frontend mình chỉ hóng có dự án theo kèm thì lượng người xem với người biết tới kênh sẽ nhiều hơn vì đa số có rất ít kênh có dự án theo kèm Ví dụ có dự án về web chẳng hạn, nhưng sẽ tốn khá nhiều công sức của bạn nên mình chỉ hóng chứ không dám yêu cầu
AmlfD NT à mình hiểu, tức là dạng làm full một cái website nào đó bằng reactjs chẳng hạn đúng hk? 🙂 Cái này take time thiệt =)) nhưng sau khi cho mn các kiến thức cần thiết thì mình sẽ làm cho mn hiểu rõ hơn nè hehe 😉 Nhưng ý tưởng rất hay, cảm ơn bạn nhiều nhé 😍
Hi anh, có thể cho em hỏi về container / component khi so với atomic design được không ạ. Hiện tại em dùng theo kiểu atomic và thấy container tương đương page và component tương đương template, template thì sẽ gọp các mục từ organisms > molecules > atoms lại. Em thấy cách chia này điểm lợi là sẽ chia nhỏ thiệt nhỏ, có thể tái sử dụng nhưng mà em cảm giác có vẻ hơi bị rối. Anh cho em vài góp ý nha, em có nên tiếp tục dùng không hay chuyển qua container / component cho đơn giản bớt ạ. Cám ơn anh!
hi Lâm ơi, thật sự là mình cũng chưa làm cách mà Lâm nói nên cũng ko có kinh nghiệm thực tế để so sánh 🙂 Nhưng với container/component thì mình thấy đủ rồi nè, và thẩm chỉ thỉnh thoảng nó cũng đã đủ rối 😅
@@EasyFrontend Tuy chưa so sánh nhiều nhưng qua chia sẻ của anh thì chắc em phải đơn giản project bớt đi. Thực sự thì anh dạy khá hay, dễ hiểu và rất đúng trọng tâm mà ít người đề cập đến :3 Cám ơn anh, hi vọng anh ra nhiều clip thêm xD
hi em, anh thì cũng xem docs rồi build UI để có kinh nghiệm nè. Kiều nào đi nữa em cũng cần học mấy kiến thức cơ bản trước rồi hẳn bay vào làm nè. Nếu docs chán quá thì em hãy tìm một khóa học online trên Udemy chẳng hạn để học nhé hihi
a nghĩ giờ nó không còn hợp lý lắm tuy nhiên có một mindset a vẫn còn giữ là tách UI và logic nhen Daniel hehe build càng nhiều stateless component càng tốt, để một vài ông thần stateful thôi, để mình dễ quản lý hehe
hi Vỹ, link đây em nha, dùng links này mới có giảm giá, em tìm trên google thì ko có nè hihi Easy Frontend - Code xịn hơn mỗi ngày 🔥 Khoá học Javascript: course.ezfrontend.com/javascript 🎁 Khoá học ReactJS: course.ezfrontend.com/reactjs 🎯 Fan cứng Easy Frontend: bitly.com/easy-fan-cung Nếu khó khăn gì thì ping trên facebook anh hen :)
Văn Tùng Phạm hi Tùng, cảm ơn bạn đã quan tâm nha. Hiện do mùa dịch nên có thể mình sẽ ra 1-2 videos về react hàng tuần. Nhưng tương lai thì chưa biết được nữa nè. Khi nào có lịch cụ thể mình sẽ update lên cho mn nắm hen. 🙂
hi Chung, câu hỏi hay nè. Trả lời ngắn gọn là logic bạn viết ở container nhé 🙂 Chi tiết như sau, vd bán có container là HomePage, bạn có một component là ProductList. Trong ProductList bạn có một nút là Refetch (nút này để lấy lại dữ liệu mới về). Vậy nếu mình muốn click lên nút này để lấy dữ liệu mới thì làm sao? ProductList - Props: productList (type là ) và onRefetchClick (type là function) 1. Thêm một props dạng function cho ProductList: onRefetchClick 2. Khi nút Refetch được click thì chỉ việc pass cái handler onRefetchClick: 3. Ở container HomePage thì sẽ truyền handler vào cho ProductList khi nút refetch được click. ví dụ có hàm handleRefetchClick() {lên server lấy dữ liệu rồi update lại state productList} trong hàm render của HomePage thì mình sử dụng thế này
@@EasyFrontendcảm ơn anh ! E hiểu ạ. nhưng nếu có nhiều sự kiện như vậy. giả dụ có tầm 20 sự kiện đi. Xong việc truyền tới 20 props và setState từ việc truyền vào thằng con function như vậy có làm giảm hiệu suất đi không ạ ?
Chung Đinh hi Chung, nếu nhiều sự kiện như vậy thì em coi lại cách chia component của em nha, component đó chia hơi lớn rồi đó 🙂 Trường hợp cần thiết, e cân nhắc cho component đó trở thành một container luôn cũng được nha. 🙂
@@EasyFrontend Vì e có từng làm qua những component có nhiều logic. phải có tầm 20 state chưa kể những state để mình lưu trữ dữ liệu từ server. Vậy tại sao mình không để component xử lí logic của chỉnh nó và thằng container chỉ là thằng đi lấy dữ liệu về thôi ạ ?
Chung Đinh Ý bạn ơi, bản thân chính nó có thể tự handle logic liên quan tới state của nó nha. Chứ hk phải là hk đc handle logic. Xin lỗi bạn nếu mình làm bạn rối. Chính xác là mình đừng handle logic liên quan tới global state, hoặc dữ liệu của project trong dump component nè. Còn mình thì đồng ý vs bạn - Container lấy dữ liệu từ server, quản lý việc thay đổi dữ liệu này. - Component bên dưới chỉ sử dụng lại các dữ liệu từ container thông qua props và handle thêm logic nếu có state ( component state, chứ hk phải global state ) Như vậy rõ hơn chưa Chung? 🙂
Thiện Nguyễn à okie Thiện, vậy có gì trong quá trình làm mà gặp gì khó khăn thì có thể trao đổi vs mình hen 🙂Mình hk tl liền được, nhưng xong việc mình sẽ tl cho hen 🙂
ồ cuối cùng cũng tìm được a em muốn học react , khi em search youtube học react thì nó toàn cái cũ đã bị thay đổi. Giờ không tương thích nữa. Bây giờ a có học liệu react đầy đỷ ko cho em xin với (mail : cuphong2003hk@gmail.com). EM rất thích video của a. Giờ a cố gắng ra đầy đủ nhất về react nhé.
hi em, cảm ơn em rất nhiều nhé 😉 Hiện thì anh hk có trọn bộ về reactjs nè, chỉ có mấy videos trên TH-cam thôi nè 🙂 Hiện anh đang làm mấy cái project thực tế vs mn, để mn có thể học được nhiều thứ hơn 😉
![โรงเรียนดัดสันดาน นักเรียนเถื่อน..!! [โรงเรียนไดเม่]](http://i.ytimg.com/vi/vRKPeXn4Fl4/mqdefault.jpg)
Cảm ơn các bạn đã xem video của mình nhé 😍
Bạn nào đã hiểu cách chia component rồi thì thả tim cho mình biết cái nè ❤️
Nếu có thắc mắc hay muốn trao đổi thêm về việc chia component với mình thì hãy bình luận bên dưới nhé. hehe
Cảm ơn a
haha đc vậy thì hay quá em ơi, cảm ơn em nhen hihi, trên kênh còn nhiều series hay, em có thể tham khảo thêm nhen 😊
Phải như em xem video này sớm hơn 😭😭, e đã mất khá nhiều time để tự tìm hiểu mấy thứ này
e đang lu bu về reactjs qua list học của a nó đc thông não hẳn, cảm ơn a :p
Em cảm ơn ạ, anh dạy cuốn quá, rep comment cũng tâm huyết luôn, em đọc thêm comment cũng hiểu thêm được vấn đề =))
yeahhhhh cảm ơn em nhiều Nghĩa ơi 😍 Anh rất vui khi được trao đổi với mn, nên nếu có gì ko rõ cứ thoải mái comment nhé Nghĩa hehee
Rất hữu ích, giọng dễ nghe, nói chuyện rất luôn cuốn !! cảm ơn anh nhén ❤️
yeahh cảm ơn Thuận nhiều nhaaaaaa! 🙂
Nếu bạn có gì còn thắc mắc, chưa hiểu thì có thể hỏi mình nha 😉
mình nghĩ việc chia nhỏ component nhằm tách bớt state ở component cha để tránh những re-render ko cần thiết
yeah mình đồng ý, state nào ko cần thiết chia sẻ thì nên đưa xuống component con xử lý 👍
Intro music khá ấn tượng.
Bài giảng rất bổ ích cho những newbie như e. Trước giờ code lung tung quá.
Thang Dang Xuan hihi rất vui vì video giúp ích cho bạn, nếu bạn có thắc mắc gì thì thoải mái trao đổi với mình nhé! Cảm ơn Thắng nha! 🙂
Tks anh, video rất hay ạ, em có câu hỏi nếu đc a giải đáp giúp em:
Ví dụ e có container manage product render component list product. Trong đó có modal chỉnh sửa product, e nên sử dụng các state ( các thông tin về product ) ở container hay trong component vậy a? Vì e sử dụng Formik trong modal nhưng có 1 số field e k quản lý bằng formik mà phải sử dụng state ( do mới xài formik nên 1 số field e k tích hợp vô đc ). Nếu sử dụng state của container khi gõ chữ hơi lag còn để state ở component thì mượt hơn. Mong a giải đáp giúp e, em cảm ơn
hi Ngọc, có một số thứ cần lưu ý ở đây nè
1. State em đặt ở container là đúng rồi nhé.
2. Việc quản lý form, em nên để component riêng biệt nó tự quản lý lấy, đừng cập nhật trực tiếp lên container. Khi nào submit thì mới đẩy lên container xử lý và cập nhật state trên container nha. Em coi video này để hiểu cách đẩy phần form ra một component riêng nha th-cam.com/video/HbERbcazLhY/w-d-xo.html
Hi vọng giải đáp được thắc mắc của em 🙂
Trước hết xin cảm ơn Anh đã làm clip! Anh nói hay dễ hiểu quá không biết anh có Tutorial dạy react js cơ bản không?
hi Trung, hiện thì a hk có full series về ReactJS cơ bản nè 🙂 Anh chỉ dự định làm project thực tế thôi nhen Trung. Hiện thì đang có cái series project thực tế reactjs va redux nè 😉
rõ ràng dễ hiểu còn phát âm chuẩn nữa, nhưng mà a góp ý mai mốt nên hạn chế dùng từ "Được chưa" ở cuối câu ha e, nghe nó hơi nặng nặng á.
hihi e cảm ơn a Nhật nhé, sr a vụ cái chữ cuối câu, nó thành thói quen của em rồi ạ =))) Hơi khó sửa, mà em sẽ để ý tới nó hihi 😉
Mình thấy có một vấn đề như này: giả dụ vì một lý do nào đó mà state/props của thằng container thay đổi dẫn đến việc phải re render lại toàn bộ components trong container. để hạn chế vấn đề này mình thường cho các component trong container tự lấy tự xử lý dữ liệu giảm bớt việc re render lại toàn bộ. Còn ý kiến của bác thì như thế nào ?
hi Vũ, một câu hỏi hay nè, mình xin trả lời như sau:
1. Khi component mà Vũ cho xử lý dữ liệu, thì nó đã thành container rồi.
2. Container có thể chưa container con, nên việc của Vũ làm là hợp lý nhé.
3. Nếu việc re-render của component nó độc lập với các components khác thì bạn làm như vậy là hoàn toàn hợp lý.
Nên theo mình, nếu trường hợp của Vũ là như vậy thì mình hoàn toàn đồng ý nhé!
Cảm ơn Vũ đã đặt câu hỏi cho mình nhen 👍
@@EasyFrontend Thanks bác, mình đã hiểu !
@@EasyFrontend 3. Nếu việc re-render của component nó độc lập với các components khác là sao ạ? Anh giải thích cụ thể giúp e với ạ. Thanks anh
cảm ơn chia sẻ của anh🤩 đúng cái em đang tìm hiểu luôn ạ
Chuyên Bún's hihi hên quá, đúng video đúng thời điểm 😍 Cảm ơn bạn nhiều nha 😉 Nếu có phần nào khó bạn có thể gợi ý mình để làm cho những video sau nha 🙂
Mình có thắc mắc thế này mong bạn giải đáp:
- Ví dụ mình ko call API ở HomePage mà cho ProductList (lastest recipes) là container và call API ở đây > sau đó truyền props xuống cho dumb cmp là ProductDetail (card) thì có được không?
Vì mình thấy thế này, nếu có gì đó ảnh hưởng tới 1 container lớn như HomePage chẳng hạn thì việc re-render lại toàn bộ container này là có và kéo theo là call API & re-render các cmp con ko cần thiết. Mong bạn giải đáp, cám ơn bạn. Chúc bạn sức khỏe và thành công.
hi Tâm, cảm ơn bạn đã đặt câu hỏi cho mình, mình xin giải đáp thắc mắc như sau:
1. Container HomePage có thể chứa container con ProductList.
2. Nhưng nếu bạn cho ProductList thành container, thì bạn sẽ không tái sử dụng được. Ví dụ HomePage muốn có ProductList 6 items, qua trang ProductSearch muốn có ProductList 12 items thì bạn làm thế nào? Vậy nên mình không nên cho ProductList làm container nhé.
3. Về việc re-render, bạn dùng PureComponent giúp mình, cái này nó sẽ giúp mình ko re-render nếu props hoặc state không thay đổi.
4. Còn trường hợp bạn vẫn muốn tách cái ProductList đó, thì hãy tạo ra một ProductContainer chẳng hạn.
HomePage chứa ProductContainer
ProductContainer sẽ gọi API và render cái ProductList.
Hi vọng giải đáp được thắc mắc của bạn. 🙂
@@EasyFrontend cám ơn bạn đã giải đáp cho mình. Nãy mình có kết bạn trên FB, rất mong những video sắp tới của bạn về React nói riêng và FE nói chung. 😄
Bạn có thể làm khoá học react js cho ng mới học đc không! Thanks
hi Steven, về phần này khá đơn giản nên mình dự định ko có làm nữa nè, thay vào đó mình chỉ làm một project thực tế cho mọi người thực hành thôi. Hiện bạn có đang gặp khó khăn gì về reactjs hk nhỉ? 🙂
Hi vọng sắp tới anh làm video về Higher Order Component ạ ^^
hi em, cơ bản nó là component trả về component cộng thêm một số thứ gì đó em nhen hehe
hiện anh hk có plan để làm video về topic này nè, tại anh chuyển sang dùng hooks òi, hk có dùng HOC nữa :)
chào a,
e vừa nhảy ngang qua tìm hiểu reactjs, react-native,
những phần về cấu trúc tệp, thư mục này a có thể chia sẻ cho e ít src để tham khảo vs dễ hiểu hơn đc k ạ?
hi Tuấn ơi, em có thể tham khảo ở cái series về Redux nhé 😉
@@EasyFrontend e cám ơn a
Cảm ơn anh đã chia sẻ những kiến thức thế này :D Chúc anh nhiều sức khỏe
hihi cảm ơn em nhiều nhé Vũ 😍 Chúc em nhiều sức khoẻ và học tập thật tốt nhen 😉
anh ơi có vị dụ thực tế không ạ. nghe lý thuyết không thì thấy không thấm lắm ạ
rk nó liên quan chi về cây thư mục của mình trong project ko anh? như phải chia ra 2 thư mục là container và components
ở thời điểm hiện tại thì anh hk có phân biệt trong cây thư mục nữa em nha
ý tưởng là dùng càng nhiều UI components càng tốt, logic nằm ở ít components thôi, thường là page-level, hoặc nếu phức tạp quá thì dưới page-level một bậc
@@EasyFrontend dạ e cảm ơn chia sẻ của a ạ
cám ơn người anh đi trước truyền lại những kiến thức cho tụi em cần ^^ a nên sắp xếp lịch làm series dài từ react-redux-router-saga-hooks nữa a nhé :v
Tân Nguyễn hihi cảm ơn Tân nhiều nha 😍à mà hiện có nhiều tài liệu về mấy cái này rồi, Tân thấy nó chưa hiệu quả hay sao Tân? 🙂
@@EasyFrontend tại mình thấy kiến thức của họ đã cũ rồi á
Tân Nguyễn À anh hiểu òi, cảm ơn Tân đã phản hồi nhé 🙂
giả dụ như home page em không tương tác với api, em gọi luôn 4 component kia và k truyền gì qua cpn recipelist cả, vì em muốn component nào tương tác với api thì chia ra 2 file 1 file render ra ui giống như anh nói cho gì render đó, còn 1 file tương tác với api, anh thấy cách làm này sao anh
hi Dũng ơi, cách này được nhé em, cơ bản là thay vì dồn lên hết page level thì mình chia nhỏ ra tí, 1 page có nhiều container, mỗi container sẽ phụ trách việc xử lý data, xong pass data xuống UI component render lên là xong hehee.
Mong được nghe anh chia sẻ thêm nhiều về khó khăn trong việc học JS với ReactJS
hi Lâm, cảm ơn bạn đã quan tâm nhé. Cái này thiên về chia sẻ, tâm sự, chắc mình gom lại một video để giải đáp cho các bạn nhé. :) Hiện cho mình xin hỏi tí, Lâm hiện có đang làm gì với js/reactjs hk?
@@EasyFrontend em đang học bên Full stack web phần react rồi, mà e chưa hiểu cách viết JS với reactJS như nào hx
@@khailam7681 ơ em học hết rồi mà sao chưa biết cách viết là sao Lâm?
Hay là không biết cách tổ chức folder, file trong project hở Lâm? :)
@@EasyFrontend cũng có thể e chưa biết cách tư duy viết code, a có cách nào chia sẻ e với
Khải Lâm hi Lâm, em có nắm được JS vững hk? với nó còn tư duy lập trình, kĩ thuật lập trình và các thuật toán nữa, nên nếu chưa có thì em đọc thêm tài liệu
tìm hiểu nhen 🙂
Hi anh! Anh ơi cho em hỏi ngoài lề xíu ạ...Thường thì dự án thực tế nên responsive bằng bootstrap hay flexbox thuần vậy anh ?
hi em, mình linh hoạt kết hợp cả 1 sao cho thuận tiện nhất em nhen 😉
làm thêm 1 khóa làm project thực tế đi anh đơn giản để làm mẫu á anh
hi Thanh, em có thể tham khảo series hooks, rồi redux và cái mới nhất là series về redux saga em nha, toàn là mini project ko á em 😉
Em xem các playlist ở đây nhen: th-cam.com/users/EasyFrontendplaylists
@@EasyFrontend em xem mấy khóa react của anh hết rồi đợi anh ra mới mới nữa đó anh ơi khá hay cảm ơn anh
Cảm ơn tác giả !
hay quá, cám ơn bạn nha! ^^
yeahhh cảm ơn Phương nhé hehe, kênh còn nhiều series xịn bạn có thể tham khảo thêm nha 😍
Mong bác làm demo 1 trang web băng react dc ko a
viet truong Sắp tới sẽ có nha bạn ơi, mình đang soạn tài liệu nè hihi 🥰
em muốn mua khóa reactjs của anh trên udemy mà k có visa mastercard paypal thì còn cách nào khác để thanh toán không anh
à anh có thể hỗ trợ em thanh toán qua ngân hàng hoặc momo nhen, liên hệ anh qua facebook để được hỗ trợ nha Đức
facebook.com/nvhauesmn/
@@EasyFrontend anh check ib giúp e với ạ
Smart >< Dumb :)))) đặt tên quá đáng ghê :)))
Tứ Cảnh hahaaa ấn tượng cho dev dễ nhớ mà =))))) lúc đầu a thấy cũng hết hồn, y như chửi hahaa
authentication (login,logout) cho một web ecommerce thì e nên chia component như nào cho tối ưu ạ , ecó sử dụng redux ?
hi Trường, cái này hơi khó trả lời em nhen, nó hơi chung chung hihi 🙃
A ơi giá với đky khóa học react router v6 ở đâu anh?
hi Thường, hiện react router v6 ko có khóa học hiện, chỉ có tích hợp trong khóa reactjs trên udemy thôi em nhen, cơ mà anh chưa làm tới phần này hihi
@@EasyFrontend :=) ôi buồn thế anh
anh ơi ah có source nào của ah chia theo cái này không ạ.vì khi nhìn vào code e dễ hiểu hơn.ah có thể share cho e được k ạ.e cảm ơn :))
hihi chào bạn, cảm ơn bạn đã quan tâm nha. Vì code dự án nên hk thể share được, nhưng sắp tới mình sẽ soạn code rồi gửi mn tham khảo nhen 😍
Hóng dự án vs tất cả dự án theo list của chủ kênh
AmlfD NT lol cảm ơn bạn nhiều nha 😍 Ngày mai sẽ có một cái về reactjs component life cycle vào 9h tối nhé. Riêng bạn có yêu cầu làm video về chủ đề gì hk? 🙂
Easy Frontend mình chỉ hóng có dự án theo kèm thì lượng người xem với người biết tới kênh sẽ nhiều hơn vì đa số có rất ít kênh có dự án theo kèm
Ví dụ có dự án về web chẳng hạn, nhưng sẽ tốn khá nhiều công sức của bạn nên mình chỉ hóng chứ không dám yêu cầu
AmlfD NT à mình hiểu, tức là dạng làm full một cái website nào đó bằng reactjs chẳng hạn đúng hk? 🙂 Cái này take time thiệt =)) nhưng sau khi cho mn các kiến thức cần thiết thì mình sẽ làm cho mn hiểu rõ hơn nè hehe 😉 Nhưng ý tưởng rất hay, cảm ơn bạn nhiều nhé 😍
Easy Frontend ok tks kênh. Hóng
Hi anh, có thể cho em hỏi về container / component khi so với atomic design được không ạ.
Hiện tại em dùng theo kiểu atomic và thấy container tương đương page và component tương đương template, template thì sẽ gọp các mục từ organisms > molecules > atoms lại.
Em thấy cách chia này điểm lợi là sẽ chia nhỏ thiệt nhỏ, có thể tái sử dụng nhưng mà em cảm giác có vẻ hơi bị rối.
Anh cho em vài góp ý nha, em có nên tiếp tục dùng không hay chuyển qua container / component cho đơn giản bớt ạ.
Cám ơn anh!
hi Lâm ơi, thật sự là mình cũng chưa làm cách mà Lâm nói nên cũng ko có kinh nghiệm thực tế để so sánh 🙂 Nhưng với container/component thì mình thấy đủ rồi nè, và thẩm chỉ thỉnh thoảng nó cũng đã đủ rối 😅
@@EasyFrontend Tuy chưa so sánh nhiều nhưng qua chia sẻ của anh thì chắc em phải đơn giản project bớt đi.
Thực sự thì anh dạy khá hay, dễ hiểu và rất đúng trọng tâm mà ít người đề cập đến :3
Cám ơn anh, hi vọng anh ra nhiều clip thêm xD
hihi rất vui khi chia sẻ của anh có thể giúp được chút ít gì đó cho em nè, hi vọng sẽ tiếp tục trao đổi với em ở những video tiếp theo nha 🙂
em định học jquey mà tìm hiểu thì cái này đã lỗi thời, vậy nên có thể skip cái này đc đúng ko anh
yeah mình có thể skip jquery em nhen, học javascript xong tới reactjs luôn em nha
Anh có làm khoá học về reactjs ko anh hay chỉ làm các video như này ạ
hi Bảo, hiện thì a ko có dự định làm full khoá reactjs online nhé. A chỉ có dự định làm một project thực tế cho reactjs thôi 🙂
Em mới tập học Reactjs thì có thể cho em hỏi cách học như thế nào không ạ. Em xem theo doc mà khó hiểu quá.
hi em, anh thì cũng xem docs rồi build UI để có kinh nghiệm nè.
Kiều nào đi nữa em cũng cần học mấy kiến thức cơ bản trước rồi hẳn bay vào làm nè.
Nếu docs chán quá thì em hãy tìm một khóa học online trên Udemy chẳng hạn để học nhé hihi
@@EasyFrontend Vâng ạ. Em cảm ơn ạ
Cám ơn anh nhé.video hay lắm anh ạ.
hihi cảm ơn Dũng nhiều nha! :) Bạn nhớ áp dụng vào dự án rồi nếu có thắc mắc gì thì có thể trao đổi thêm với mình nha hehe
cách này còn áp dụng cho 2022 không ạ
a nghĩ giờ nó không còn hợp lý lắm
tuy nhiên có một mindset a vẫn còn giữ là tách UI và logic nhen Daniel hehe
build càng nhiều stateless component càng tốt, để một vài ông thần stateful thôi, để mình dễ quản lý hehe
Anh ơi, có thể cho em xin link khoá học trả phí reactjs của anh không ạ ? Em tìm trên google mà không thấy.
hi Vỹ, link đây em nha, dùng links này mới có giảm giá, em tìm trên google thì ko có nè hihi
Easy Frontend - Code xịn hơn mỗi ngày
🔥 Khoá học Javascript: course.ezfrontend.com/javascript
🎁 Khoá học ReactJS: course.ezfrontend.com/reactjs
🎯 Fan cứng Easy Frontend: bitly.com/easy-fan-cung
Nếu khó khăn gì thì ping trên facebook anh hen :)
a oi cho e hỏi 1 tuần a ra mấy video về react vậy a ?
Văn Tùng Phạm hi Tùng, cảm ơn bạn đã quan tâm nha. Hiện do mùa dịch nên có thể mình sẽ ra 1-2 videos về react hàng tuần. Nhưng tương lai thì chưa biết được nữa nè. Khi nào có lịch cụ thể mình sẽ update lên cho mn nắm hen. 🙂
@@EasyFrontend vâng e cảm ơn a
Vậy logic mình sẽ viết ở đâu ạ? Ví dụ e muốn click vào 1 nút trong component rồi gọi lên server lấy dữ liệu. Thì flow sẽ như nào ạ?
hi Chung, câu hỏi hay nè. Trả lời ngắn gọn là logic bạn viết ở container nhé 🙂
Chi tiết như sau, vd bán có container là HomePage, bạn có một component là ProductList.
Trong ProductList bạn có một nút là Refetch (nút này để lấy lại dữ liệu mới về).
Vậy nếu mình muốn click lên nút này để lấy dữ liệu mới thì làm sao?
ProductList
- Props: productList (type là ) và onRefetchClick (type là function)
1. Thêm một props dạng function cho ProductList: onRefetchClick
2. Khi nút Refetch được click thì chỉ việc pass cái handler onRefetchClick:
3. Ở container HomePage thì sẽ truyền handler vào cho ProductList khi nút refetch được click.
ví dụ có hàm handleRefetchClick() {lên server lấy dữ liệu rồi update lại state productList}
trong hàm render của HomePage thì mình sử dụng thế này
@@EasyFrontendcảm ơn anh ! E hiểu ạ. nhưng nếu có nhiều sự kiện như vậy. giả dụ có tầm 20 sự kiện đi. Xong việc truyền tới 20 props và setState từ việc truyền vào thằng con function như vậy có làm giảm hiệu suất đi không ạ ?
Chung Đinh hi Chung, nếu nhiều sự kiện như vậy thì em coi lại cách chia component của em nha, component đó chia hơi lớn rồi đó 🙂
Trường hợp cần thiết, e cân nhắc cho component đó trở thành một container luôn cũng được nha. 🙂
@@EasyFrontend Vì e có từng làm qua những component có nhiều logic. phải có tầm 20 state chưa kể những state để mình lưu trữ dữ liệu từ server. Vậy tại sao mình không để component xử lí logic của chỉnh nó và thằng container chỉ là thằng đi lấy dữ liệu về thôi ạ ?
Chung Đinh Ý bạn ơi, bản thân chính nó có thể tự handle logic liên quan tới state của nó nha. Chứ hk phải là hk đc handle logic. Xin lỗi bạn nếu mình làm bạn rối. Chính xác là mình đừng handle logic liên quan tới global state, hoặc dữ liệu của project trong dump component nè.
Còn mình thì đồng ý vs bạn
- Container lấy dữ liệu từ server, quản lý việc thay đổi dữ liệu này.
- Component bên dưới chỉ sử dụng lại các dữ liệu từ container thông qua props và handle thêm logic nếu có state ( component state, chứ hk phải global state )
Như vậy rõ hơn chưa Chung? 🙂
Hay quá a ơi 👍
hihi cảm ơn e nhiều Tài ơi. Hiện em có đang học hay làm việc với reactjs hk Tài? :)
hiện tại anh làm cty nào vậy anh?
hi Tuấn, a hiện đang làm cho một cty bên mảng crypto currency em nha 😉
không học ReactJS nhưng xem rất hay hehe :))
=)) cảm ơn bạn Việt nhiều nha, tuy ko học và vẫn chịu ngồi xem hihi rất là quý nha 😉
làm series react-hooks đi sư huynh ơi !
Tân Nguyễn hihi mình đang làm nè bạn ơi, dự là tuần sau mình sẽ release 2 videos đầu tiên nhen 😉
Easy Frontend mong lắm anh ạ :( Cảm ơn anh trước ạ
Hay lắm a!
hi Thiện, cảm ơn bạn nhiều nhé! :) Bạn có đang học hay làm với reactjs hk?
@@EasyFrontend dạ đang làm đồ án React a ạ
Thiện Nguyễn à okie Thiện, vậy có gì trong quá trình làm mà gặp gì khó khăn thì có thể trao đổi vs mình hen 🙂Mình hk tl liền được, nhưng xong việc mình sẽ tl cho hen 🙂
@@EasyFrontend dạ, e cám ơn a!
anh ơi video hay lắm ạ. em muốn theo a học được không ạ
Yeahhh cảm ơn em nhiều nhé Hải 😍
Về việc theo anh học, ý là sao em hen? 🙂
Hay vãi nồi a ơi :v
yeahhh cảm ơn em nhiều Tú ơi 😉
2/7/2021 hiện tại link tài liệu a share đã die
:(
hi Thành, ý em là link nào vậy e hen?
@@EasyFrontend dạ Medium.com đó ạ
@@thanhnguyvan820 à haha, chắc ở VN bị chặn á em =)))
Thanks
Phạm Ngọc Tưởng Cảm ơn bạn nhé!
like
ồ cuối cùng cũng tìm được a
em muốn học react , khi em search youtube học react thì nó toàn cái cũ đã bị thay đổi. Giờ không tương thích nữa. Bây giờ a có học liệu react đầy đỷ ko cho em xin với (mail : cuphong2003hk@gmail.com). EM rất thích video của a. Giờ a cố gắng ra đầy đủ nhất về react nhé.
hi em, cảm ơn em rất nhiều nhé 😉 Hiện thì anh hk có trọn bộ về reactjs nè, chỉ có mấy videos trên TH-cam thôi nè 🙂 Hiện anh đang làm mấy cái project thực tế vs mn, để mn có thể học được nhiều thứ hơn 😉
@@EasyFrontend dạ. em xin nhạc intro với ạ
thanks
viet truong cảm ơn bạn nhiều nhé! Nếu có thắc mắc gì bạn cứ thoải mái bình luận hỏi nhé!