Q&A lập trình viên

Chủ đề

#react

Tốc độ⚡Supporters

BETA

Với những câu hỏi về React, 20 người supporters sẽ nhanh chóng trả lời giúp bạn

Công nghệ

Làm hybrid app bằng webview

Mọi người cho mình hỏi chút. Team mình đã làm app bằng Flutter, nhưng mỗi lần bên mkt muốn chạy event gì trên app team mình lại phải đổi UI cho phù hợp rồi update app liên tục, nên team mình muốn chuyển đổi nó thành hybrid app với webview. Team mình đang cân nhắc nối Next.js hoặc React webview vào Flutter hoặc native app. Nhưng không biết khi đó các thông tin như thông tin đăng nhập, vị trí,... sẽ được trao đổi như thế nào giữa hai bên, và cần xử lý vấn đề bảo mật như thế nào nhỉ? Mình có search google mà không ra kết quả như ý lắm nên mới lên đây hỏi. Ai biết giải đáp giúp mình với. Nếu mọi người có thể share giúp mình bài viết hay video nào hữu ích để có thể tham khảo về vấn đề này thì càng tốt ạ. Cảm ơn đã mọi người quan tâm!

Trả lời 0

19 giờ trước • Lượt xem 11

Nghề nghiệp

Có nên học thêm ngôn ngữ khác

Hi mọi người mình có học xong một khoá Fullstack web với Reactjs(Nextjs) và Nodejs. Mình cũng đã tự hoàn thiện vài ba dự án: https://github.com/hungban1995 Nhưng thời điểm hiện tại không có nơi nào tuyển dụng cả. Mình đang hướng đến học thêm .Net hoặc Java để tăng thêm cơ hội. Mọi người cho mình lời khuyên có nên học thêm không ạ. Mình xin cảm ơn!

Trả lời 1

một ngày trước • Lượt xem 27

Công nghệ

Về Preact trên NextJS 13

Anh em nào cấu hình thành công được Preact trên NextJS 13 chưa? Mình cấu hình xong k chạy dc yarn dev

Trả lời 0

một ngày trước • Lượt xem 11

Công nghệ

Cách gửi % tiến độ từ server lên client khi làm progress bar

Dự án em đang dùng react cho frontend, java cho backend. Em định làm progress bar khi upload file excel, vậy phải gửi % tiến độ từ server lên client thế nào vậy ạ? Việc upload file thì được thực hiện ở backend, vậy có cách nào để trên frontend bắt được % tiến độ không ạ? Em cũng không chắc phải gg thế nào, mọi người giúp em với.

Trả lời 2 • Up 4

7 ngày trước • Lượt xem 47

Công nghệ

Cách chặn nhập bằng bàn phím trong MUI TextField

Mọi người cho em hỏi tí. Em đang xài React Material UI TextField API. Để nhận dữ liệu ngày tháng ở dạng type =""date"", em muốn làm theo kiểu user phải click icon date picker để chọn ngày tháng, thì trong trường hợp này có cách nào để làm chặn nhập bằng bàn phím không nhỉ?

Trả lời 1

10 ngày trước • Lượt xem 61

Công nghệ

làm sao để xóa fulleventlog

cho em hỏi làm sao để xóa một số hàng thông tin của FullEventLog ạ

Trả lời 0

10 ngày trước • Lượt xem 13

Công nghệ

làm thế nào xem và xóa trình ghi lại?

máy em có chạy trình ghi lại này nhưng em không biết cách mở xem và xóa các mục được ghi lại? em muốn thực hiện thì phải làm thế nào ạ

Trả lời 0

12 ngày trước • Lượt xem 19

Công nghệ

react,javascript Image Url to File

Em chào mng, em là junior dev còn ít kinh nghiệm nên mong được mọi người chỉ giáo. Em đang code bằng React. Em đang cần làm để sao cho khi user chỉnh sửa thông tin sản phẩm mà không sửa được ảnh thì phải gửi request nguyên object file ảnh không sửa được đó về cho server. Ảnh sản phẩm đang nhận CDN URL ở API, vậy làm thế nào để từ CDN URL đó mà ra được object File vậy ạ? Em cũng thử gu gồ và làm theo cách gọi url get rồi dùng blob() để tạo object File, nhưng size lại ra là 0 nên theo em hiểu thì cách này là để dùng cho trường hợp access local file, nhưng em không biết em hiểu vậy có đúng không.. Hay có cách nào khác tốt hơn không ạ?

Trả lời 1

14 ngày trước • Lượt xem 39

Công nghệ

Hỏi về next js getStaticProps rehydration

Hiện tại thì lý thuyết SSG, ISR, SSR mình đều nắm. Nhưng trong quá trình code với next js thì mình luôn gặp lỗi cảnh báo client, server xung đột. Mình đã thử vẽ page trước rồi nhưng vẫn bị lỗi này, ko biết tại sao sao. 1. Ví dụ nếu page được tạo bằng SSG và HTML thì do page được tạo từ HTML nên sẽ pre rendering screen. Như vậy sau khi rendering (quyền điều khiển chuyển qua react) thì khi load màn hình, CSR có loading phần HTML đã được tạo trước đó ko? Hay sẽ tạo mới trên page có sẵn? 2. Nếu tạo page mới thì nội dung file HTML có sẵn đã được pre render trước đó và data do CSR vẽ khác nhau thì next js sẽ xuất cảnh báo match? 2.1 Tại next js, nếu nội dung server, client khác nhau thì lý do xuất cảnh báo match là gì? 3. Tại sao CSR sử dụng html đã tạo sẵn để vẽ page mới?

Trả lời 1

15 ngày trước • Lượt xem 37

Công nghệ

ordering trong react

em để kèm code bên dưới. Em muốn sắp xếp theo thứ tự key yêu cầu data. Khi nhấn button thì e sẽ xem đc giá trị data mong muốn, nhưng vấn đề là data lại ko thay đổi. Hay là do em dùng method sort bị sai ạ? Khi debug tên console.log(data) thì data có thay đổi nhưng trên màn hình thì data lại ko đổi. Ko biết là e mắc lỗi ở đâu nữa.

Trả lời 1 • Up 1

21 ngày trước • Lượt xem 94

Công nghệ

Migrate từ Javascript qua Typescript

Chào mọi người, mình là junior dev hiện đang làm cho startup mà frontend thì có một mình mình làm thôi à. Hiện tại mình đang được giao làm task migrate website được code bằng Vue sang React. Mà mình đang băn khoăn không biết có nên migrate website đó của bên mình đã được code bằng Javscript sang Typescript luôn hay không. Task thì cũng có deadline phải hoàn thành mà mình làm một mình nên mình cũng nghĩ cứ làm bằng JS thì sẽ tiết kiệm thời gian hơn, thay vào đó với code giao tiếp với api thì để đề phòng tránh xảy ra lỗi định dạng dữ liệu thì mình viết file riêng bằng TS. Nhưng mình cũng sợ không biết nếu giờ migrate hết sang React rồi sau lại muốn migrate sang Typescript thì có bị phức tạp hơn nhiều không. Nên giờ mình đang không biết nên: 1. bỏ cuộc với TS và code bằng JS thôi, 2. hay code xong bằng JS rồi migrate dần sang TS, 3. hay là giờ nên migrate hết sang TS luôn. => Nên mình có 2 câu hỏi dưới đây muốn tham khảo ý kiến của mọi người ạ: - Q1. Migrate dần dần từ JS sang TS có phức tạp lắm không nhỉ? - Q2. Với team chỉ có 1 frontend như bên mình thì có nên migrate sang TS không hay cứ code bằng JS cũng được ta?

Trả lời 2

21 ngày trước • Lượt xem 70

Công nghệ

Cách đổi giá trị query ở router next.js

e định làm chức năng sort một số danh mục trong list. E muốn làm sao để khi refresh page hoặc nhấn quay lại trong page thì vẫn duy trì sorting trong list. trong giá trị url query thì e muốn để ?fitler="được xem nhiều nhất" nhưng ko biết là trong next.js có cách nào để thay đổi mỗi query của url ko ạ?

Trả lời 2 • Up 1

22 ngày trước • Lượt xem 58

Công nghệ

Lỗi khi fetch skeleton trên react query

Mình đang định làm sao cho khi dùng isFetching của react-query thì skeleton sẽ hiện lên, nhưng skeleton lại hiện lên vào lúc mình không muốn. Sau khi dữ liệu đã được load một lần rồi thì skeleton vẫn hiện lên và dữ liệu lại được load lần nữa. Có ai biết chỉ giúp mình tại sao lại vậy không ạ?

Trả lời 1

22 ngày trước • Lượt xem 20

Công nghệ

Cách nén video ở phía client?

Chào mọi người, em đang làm dự án bằng react có phần upload video, mà để giảm tải cho server thì em đang tìm cách để nén video (giảm chất lượng video xuống) trên web. Thường mọi người hay nén video hay nói chung là quản lý file video như thế nào vậy ạ? Em có thử dùng thư viện @ffmpeg/ffmpeg mà thấy tốc độ chậm quá.

Trả lời 2 • Up 3

23 ngày trước • Lượt xem 83

Công nghệ

Cách làm scroll về cuối page sau khi rendering?

Chào các bác, Em đang làm web bằng react nhưng có vấn đề thế này. Hiện tại em đang muốn làm chức năng là khi click vào button thì state sẽ thay đổi và nếu state = true thì ở dưới page sẽ hiện nhiều ảnh và cùng lúc đó scroll về cuối page luôn. Nên ở trong code của em thì ở phần onClick thì đổi thành setIsOpen(true) để có thể show ảnh, rồi dùng window.scrollTo({ top: document.body.scrollHeight }), nhưng lúc này chỉ nhìn thấy ảnh thôi còn scroll thì không đi xuống dưới page. Ko biết em nên sửa phần nào ạ? Ở dưới là code ví dụ của em

Trả lời 1

23 ngày trước • Lượt xem 31

Công nghệ

Dùng react-query để tải dữ liệu có chọn lọc

Hiện tại mình muốn dùng react-query để tải thông tin của người dùng đã là thành viên, và loại trừ thông tin được thêm bởi người dùng không là thành viên. Vậy thì em có thể dùng react-query thế nào ạ?

Trả lời 1

25 ngày trước • Lượt xem 28

Công nghệ

[React] Nên dùng chat lib nào?

Chào mọi người em đang định làm tính năng chat đơn giản bằng React cho dự án cá nhân. Không biết mọi người có thể gợi ý, review cho em chat lib mọi người thường dùng không ạ? Em đang tìm hiểu mấy thằng react-chat-elements, chat-ui-react, react-native-gifted-chat rồi, mọi người có thể review giúp em mấy thằng này hoặc gợi ý option nào khác thì càng tốt ạ! Em cảm ơn!!

Trả lời 1

một tháng trước • Lượt xem 34

Công nghệ

media query không chạy ở môi trường deploy mobile

Em đang chạy dự án với nextjs Khi code thì khi e đổi version mobile trên chrome devtools thì vẫn project vẫn chạy bth cho đến khi deploy xong e test iphone thì lại không được ạ. Code của e có dạng này: // size.ts const MOBILE_PX = '768px' export const MOBILE_MODE = `(max-width: ${MOBILE_PX}) as const` // index.ts import {MOBILE_MODE} from '~~~' @media (${MOBILE_MODE}) { display:flex; flex-direction: column; } Em có tra gg thì thấy ngta hay bảo cho thêm tag <meta name="viewport" ~~~ /> thì e cũng đã cho vào rồi, nhưng vẫn chưa tìm ra nguyên nhân, cứu em với mn ơi hic

Trả lời 1

một tháng trước • Lượt xem 35

Công nghệ

Cho em hỏi về cách chặn chuyển trang trong React

Hi ac, Em đang làm SPA trong đó có chế độ soạn thảo nội dung. Khi user đang viết mà thoát trang thì em định làm pop up hỏi xác nhận lại, đồng thời giữ nguyên ở page đó chưa di chuyển. Em đã làm cái này cho cả trường hợp ấn quay lại và refresh trang, nhưng khi gọi các menu (component) khác thì việc di chuyển ra khỏi trang không bị chặn. Mọi người có thể chỉ cho em nên làm thế nào không ạ?

Trả lời 3

một tháng trước • Lượt xem 42

Công nghệ

Cách lưu data của redux và recoil có gì khác nhau?

Hôm nay e có đi phỏng vấn và nhận được câu hỏi như sau: Q) Redux thì có một store quản lý tất cả các state còn recoil thì có nhiều atom riêng lẻ để quản lý, vậy thì việc tập trung quản lý ở một store và việc quản lý ở nhiều store khác nhau thì có ưu nhược điểm gì? Ko biết thì theo mọi người nên trả lời thế nào nhỉ?

Trả lời 1 • Up 1

một tháng trước • Lượt xem 53

Công nghệ

Webpack bundle có ảnh hưởng đến react client server hay không?

Hiện tại mình đang muốn trải nghiệm cảm giác tối ưu hóa =)) nên có đang tìm hiểu thử làm splitting và webpack 5 cho project React, Ở đây thì mình có 1 câu hỏi là nếu mình ko bật server bằng webpack dev server mà bật bằng react-scripts start thông thường thì có thể dùng webpack để tối ưu hệ thống không ạ? Khi mình kiểm tra trong lighthouse thì dung lượng bundle giảm nên có thể lên được khoảng tầm 10 điểm Ngoài ra thì mình cũng đã dùng được react.lazy

Trả lời 1 • Up 1

một tháng trước • Lượt xem 36

Công nghệ

Mn nghĩ gì về onChange?

Có ai không thích dùng onChange vì re-rendering không? Mình có nói chuyện với đồng nghiệp thì có bạn bảo vì dùng onChange thì bị re-rendering nên bạn ấy không thích, bạn thường dùng form hơn. Trong 2 cái này thì cái nào tốt hơn?

Trả lời 1

một tháng trước • Lượt xem 65

Công nghệ

Cài đặt môi trường develop ban đầu khi kết hợp next.js, express.js hoặc nest.js

Hiện tại thì em đang bắt đầu cài đặt môi trường làm việc bằng create-next-app em không biết là thường ở công ty khi bắt đầu thì mọi người cũng dùng công cụ như create-next-app hay sao? Hay ở công ty thì mọi người thường tải repo next boilerplate ở github về nhỉ?

Trả lời 1 • Up 2

2 tháng trước • Lượt xem 133

Công nghệ

React sever component và tính năng SEO?

Theo mình được biết thì ở react 18 thì server component có thể render component ở server bằng html. Nếu vậy thì khi nhìn ở góc độ SEO thì khi crawling bot crawling ở page ở server component thì trc khi nhận về data của server component thì nó sẽ hiện trạng thái loading hay sao? Nếu muốn làm SEO thì thay vì build SSR ở next như thường lệ thì dùng server component sẽ ok hơn hay sao?

Trả lời 2

2 tháng trước • Lượt xem 66

Công nghệ

React - dù dùng closest thì liệu có không lệch với convention?

Như code dưới đây, thì mình định bubbling event để tìm parent node. Những phương pháp như closests hoặc querySelector thì sẽ khiến code trở thành code bị phụ thuộc vào cấu trúc nên mình có đọc ở đâu đó là nên tìm phương pháp nào để đừng bị phụ thuộc vào cấu trúc. Nếu không dùng closest và dùng ngữ pháp lặp lại để thêm hàm onClick vào mỗi component được generate thì có khả thi hơn không? Xin mọi người hãy cho mình ý kiến.

Trả lời 1

2 tháng trước • Lượt xem 25

Công nghệ

Khi sử dụng invalidateQueries UI không re-render

Hiện tại mình đang dùng useQuery để tải data user, mình muốn tạo code để thay đổi nickname trong số data của user. Mình muốn code hoạt động theo kiểu này: khi thay đổi nickname thì sẽ re-render nickname mới đổi và show trên màn hình. Vấn đề là khi dùng invalidateQueries để vô hiệu hóa cache đi chăng nữa thì trên màn hình vẫn ko hiện Nickname mới. Kiểm tra thì mình thấy trong react-query Devtools cache data đã được thay đổi, mình thử dùng useMutation hool nhưng kết quả vẫn như vậy. Lạ hơn nữa là profile UI trên navigation bar của trang thì nickname đã được đổi rồi, nhưng ngoài vị trí đó ra thì những vị trí khác không thấy được re-render. Không biết có ai biết câu trả lời không nhỉ?

Trả lời 1

2 tháng trước • Lượt xem 51

Công nghệ

Backend .NET thì Frontend nên là...

Chào mọi người, em là 1 intern backend .net/ asp.net còn khá ít kinh nghiệm, cụ thể là em đang gặp một vấn đề là em muốn thực hiện thêm 1 số dự án nhỏ để có thể vững vàng hơn, nhưng khó là em làm về backend, các api em viết ra muốn demo thì phải có frontend, trước đây thì em có sử dụng html/ css/ js thuần để demo, dần dần thấy cũng khá dở nên đang muốn tìm hiểu 1 chút về FE để có thể làm 1 số sản phẩm nho nhỏ, em thấy giờ đa phần đều dùng react js, mà react js lại hay đi chung node js vậy thì liệu là sự kết hợp .net + react js sẽ thế nào ạ, có hơi hỗn hợp không ạ, em cũng đang phân vân nên tiếp tục .net hay là học thêm node js mong mọi người cho em vài góp ý, và hi vọng mọi người có thể recommended giúp em 1 vài framework để build FE sử dụng các api.net, em rất mong nghe được góp ý của mn, em xin cảm ơn mọi người nhiều.

Trả lời 3 • Up 6

2 tháng trước • Lượt xem 74