Tối ưu kích thước file build cho production
Hi ae, bài viết này xem tìm xem thử cái nào chiếm dung lượng nhiều trong project của mình và optimized nó nhé. Nếu mình chỉ build thông thường thì khó mà phát hiện ra cái gì chiếm nhiều dung lượng, mình dùng vite nên ở đây mình giới thiệu công cụ Rollup Plugin Visualizer, […]
Lazyload component với react lazy
Nghĩ lễ 2/9 sâu quá ghé blog chém gió xíu xíu chớ ae quên mình mất 😆 Đôi lúc ae code nhiều nhưng quên mất lúc build để deploy lên production thì không biết ra sao hè. Ae mở package.json và xem thử lệnh build như thế nào nhé dev: để ae dev quen quá […]
Tạo Modal với React Portal
Say hi những ngừi ae của toiiiii. Bài viết này là khai bút con Mạc Bục đã mua cách đây 2 tuần của toiiii kaka. Máy chạy nhanh quá làm mình cũng quên luôn viết bài trên blog của mình hehe. À blog được tài trợ bởi server của ngừi anh thân thương Thành Trung. […]
useCallback trong react
Hi 500 ae. Bài này mình giới thiệu về 1 hook là useCallback cũng như sử dụng nó ra sao nhé. Lướt thuiiiii Chúng ta thường dùng useCallback khi mình không muốn function của chúng ta được khởi tạo lại mỗi lần component chúng ta re-render [crayon-650d19494bfb0453290013/] Cách dùng thì tham số đầu tiên là […]
React.memo và useMemo trong React
Say hi 5 chăm ae, bài này sẽ là bài đầu tiên trong chuỗi React Hook nâng chình xíu nhé. Bỏ qua các hook basic như useState, useEffect, useContext…Hơi nhiều lời rồi, lướt thoiiiii Chắc ae đã biết thì component sẽ re-render state hoặc props được cập nhật, compoent cha re-render khiến component con cũng […]
Custom hook trong react
Hello 5 chăm ae, lại là Tú Pê Vê đây 😁. Bài viết này mình sẽ giới thiệu với các bạn về custom là gì và dùng như thế nào nhé. Custom hook là những hook riêng do chúng ta tạo, để chúng ta chia sẻ state, logic giữa các component với nhau. Mình để […]
Convert JSON loằn tà loằn ngoằn thành Typescript interface
Nhớ lúc trước ngồi xóa mớ value của key rồi chuyển thành type cho đúng value vừa xóa, vài dòng thì…i’m fine chứ 50 dòng thì uể thiệt 🤦♂️ Làm sao để biến cái đống JSON kia thành Typescript interface nhỉ, chẳng lẽ ngồi thay từng cái 🤔 Mình chia sẻ cho các bạn 1 […]
Phân biệt Web Storage và Cookie
Trong bài này cùng mình phân biệt web storage và cookie nhé. Gét gô Web Storage & Cookie Web storage có 2 loại đó là Local Storage và Session Storage Web storage lưu trữ được nhiều dữ liệu và dễ dùng hơn Cookie. Nhưng không có nghĩa họ bỏ không dùng Cookie nhé. Mỗi thằng […]
Các loại function hay dùng trong React
Trong bài viết này mình sẽ ôn lại concept function hay dùng trong React nhé I/ Đầu tiên hay dùng nhất là Callback function. Nó chỉ là function truyền vào function khác như là 1 tham số thôi nên họ gọi là Callback function [crayon-650d19494c783406583107/] Như mình demo ở trên thì biến callBack đóng vai […]
Async Await trong Javascript
Nếu như phiên bản có Promise giải quyết được được phần nào callback hell, nhưng vẫn chưa max ping thì đến ES7 chúng ta có thể xử lý bất động bộ 1 cách dễ nhìn và dễ đọc hơn với async/await Á à: Async/Await không thay thế promise nha mà nó kết hợp với promise […]
Mutation trong React Query
Lại là TúPêVê cùng sê ri React Query đây. Bài này giúp ae hiểu Mutation trong React Query là gì, dùng nó ra sao nhé. Lướt xuống thôi 😆 mutate là 1 async function nha ae, nó xử lý bất động bộ nhưng nó không return promise đâu nghen
Tìm hiểu cơ chế caching của React Query như thế nào nghen
Lại là TúPêVê đây 😜. Bài này mình cùng tìm hiểu một số khái niệm quan trọng cũng như cơ thế caching của React Query như thế nào nhé 💋 Một số khái niệm ae cần lưu ý nhé staleTime (default 0 ms): Thời gian data được cho là đã cũ. Khi get data xong […]
Cùng tìm hiểu React Query là gì nghen
Hello mấy ae bài viết là bài đầu tiên trong chuỗi React Query cùng TúPêVê nghen. Gét Gô thuiiii TanStack Query là cái tên gọi mới hay có thể gọi React Query là thư viện giúp quản lý các state bất đồng bộ như data từ api Nó có ưu điểm gì Quản lý cache […]
Phòng chống tấn công XSS cho website
Hello mí ae bài viết này mình sẽ share kỹ thuật phòng chống XSS nghen. Ví dụ ở những field mà server trả về cho mình về dạng HTML thì ae không thể render như kiểu JSX product.description được nó sẽ gặp tình trạng kiểu như bên dưới, đấy là cách mà JSX chống lại […]
Trick xử lý loại bỏ được undefined của từng key trong Object
Hello ae nay mình share tip giúp ae loại bỏ giá trị undefined của key nhé. Ví dụ mình test demo 1 Object có 2 key optional của mình kiểu như bên dưới, thì khi hover vào chắc chắn sẽ nhận 2 type là string và undefined rồi Ở đây mình sẽ tạo 1 […]
Cùng mình tìm hiểu cấu trúc thư mục theme trong wordpress nhé
Hello anh em lâu ngày quá. Hôm nay là 29 tết rồi, vừa dọn nhà xong tiện thể khai bút sê ri wordpress cho rộn ràng xíu hehe 😂 Mình mặc định là ae đã biết cài đặt wordpress à nếu chưa thì lên đây để tải về rồi tạo database rồi vô file config.php […]
Setup dự án React Typescript
Hello 5 chăm ae 🤣. Bài viết này mình viết ra để lâu lâu tạo dự án thì vào copy cho nhanh á mà hehe. Một phần có gì ae tham khảo cách setup 1 dự án React Typescript như thế nào nhé 1️⃣ Đầu tiên đương nhiên mình phải create react app rồi yarn […]
Bắt trend tạo trái tim đang hot rần rần hiện nay nào 😝
Vào việc luôn, bài này mình share đoạn code tạo trái tim đập thả thính siêu hot ae tham khảo nhé. Chỉ cần tạo 1 file có đuôi là .html và paste đoạn code phía dưới save và chạy lên là oke rồi. À ae có thể đổi tên ở dòng 338 bằng tên mình […]
Thêm thay đổi vào commit cuối cùng với amend
Đôi lúc ae đang code gì đó nghĩ là xong rồi và commit push lên chuẩn bị tạo Pr cho mọi người review thì chợt nhận ra thiếu gì đấy cmnr. Thay vì vô viết rồi commit lại thì đã có git amend Sau khi ae thay đổi những gì đã thiếu rồi thì ae […]
Gộp commit với squash
Đôi khi trong 1 feature có nhiều commit quá cũng không clearn lắm. Vd mình làm feature A thì code html có 1 commit, implement có 1 commit, update abc có 1 commit nữa không tiện quản lí sau này lắm, làm commit history không clean lắm git rebase -i HEAD~3 (Head là con trỏ, […]
Undo trong git
Hello ae lại là mình với những bài về git đây 😜. Trong bài viết này mình sẽ undo lại những thay đổi về trạng thái ban đầu ae cùng tham khảo nhé Hoàn tác những file ở local changes về trạng thái ban đầu: git checkout name_file_change.ext Hoặc git restore name_file_change.ext Hoặc khi change […]
Branch trong git
Branch nó giúp mình tạo ra những nhánh làm việc riêng biệt mà không ảnh hưởng lẫn nhau, dễ dàng quản lí code hơn. Tạo 1 nhánh mới Nó sẽ tạo 1 nhánh mới dựa trên nhánh hiện tại git branch new_branch_name Hoặc tạo 1 nhánh mới và chuyển sang nhánh mới luôn git checkout […]
README là gì và viết README như nào?
Trong bài viết này mình cùng tìm hiểu về file readme là gì nhé. Nó là 1 file dùng để giới thiếu dự án, cấu trúc cũng tài liệu cho dự án. Tạo file README.md (tên này là tiêu chuẩn để cho github, gitlab.. nhận diện được đó là file mô tả cho dự chúng […]
Bỏ qua file với .gitignore
Đôi lúc ae không muốn git theo dõi file thay đổi của chúng ta chỉ cần tạo file .gitignore Khi ae làm việc với nodejs thì sinh ra thư mục node_modules khá nặng, không cần thiết phải lên git làm gì vì khá tốn thời gian pull push code và cả tài nguyên lưu trữ […]
Git pull và giải quyết conflict code
Trường hợp code trên remote repo có những thay đổi và cập nhật, anh em có thể cập nhật những thay đổi này trên local repo của bạn cho giống như trên remote repo bằng câu lệnh vd như git pull orgin name_branch Đôi lúc trong team ai đó sửa code trên remote rồi nhưng […]
Trick dùng nhiều tài khoản github trên cùng một máy
Hello ae có bài này chắc sẽ ngắn thôi nhưng có thể giúp ae control được nhiều tài khoản github trong cùng một máy dễ dàng hơn qua bài viết này nhé. Đi thoi… Tại thư mục (~/.ssh/) nơi sinh ra id_rsa của các bạn ấy, mình tạo thêm 1 file config (Không có đuôi […]
Git log là gì?
Câu lệnh git log dùng để xem các commit gần đây của mình như thế nào. Mỗi commit sẽ có mã riêng biệt cho từng commit. Thường nó sẽ dài khiến mình khó đọc thì lệnh git log --oneline hiển thị ngắn gọn dễ đọc hơn. Nó sẽ lấy 7 ký tự đầu tiên và […]
Git push là gì?
Để đẩy code từ local lên trên remote thì thường dùng lệnh git push origin name_branch Ví dụ mình muốn đẩy code lên nhánh main: git push origin main Đừng trên trước khi push code phải add để thêm file thay đổi vào Staging, và commit nó nữa nhé Có thể ae thấy bạn bè […]
Xin chào mọi người, đây là blog của mình. Nơi mình chia sẻ kiến thức, kinh nghiệm của 1 coder thiết kế web và những điều thú vị trong cuộc sống này
Bài viết nỗi bật
Danh mục
Huynh đệ
