⚠️ If you are running Next.js, you need to see this.
The "React2Shell" vulnerability (CVE-2025-55182) is currently making waves, and for good reason. Unauthenticated RCE on default configurations is about as critical as it gets for modern web frameworks.
If you haven't audited your versions yet, do it now.
See the full technical breakdown: 👉 https://www.cvedatabase.com/cve/CVE-2025-55182
🔥 React Day 2: Khám phá JSX, Components & Props! 🔍
- JSX: Viết HTML trong JS, dễ đọc & bảo trì hơn DOM thuần
- Component hàm: Khối xây dựng ứng dụng nhận props
- Props: Dữ liệu truyền từ cha sang con (chỉ đọc)
- Kết hợp component: Tạo UI phức tạp từ thành phần đơn giản
🌟 Pro tip: Tái sử dụng component qua props = code sạch & hiệu quả!
#ReactJS #Frontend #JSX #LapTrinhFrontend #WebDevelopment #PhatTrienWeb #Programming #LapTrinh #HocReact
🚀 Đã nâng cấp thành công monorepo lớn từ Next.js 14 lên 16 chỉ trong ~2 tuần!
✨ Quy trình:
- Chuẩn bị codebase kỹ lưỡng
- Nâng cấp dependency từng phần (React Query 5, react-intl)
- Sử dụng codemods và AI tự động hoá 85% công việc
- Chuyển 240+ file sang named imports
- Xử lý tham số định tuyến bất đồng bộ (URL → string)
📊 Kết quả:
- Thời gian build giảm 50-60%
- Bundle nhỏ hơn 3%
- An toàn sản phẩm, rủi ro tối thiểu
🔖 #NextJS #WebDev #MigrationTech #ReactJS #CodeOptimization
#LậpTrình #
Khám phá sâu hơn JavaScript để chinh phục React! Ngày 2 chúng ta học Execution Context, Call Stack, Closures, Hoisting, Async, Event Loop, Immutability, Array methods và Modules – nền tảng giúp viết React sạch, hiệu quả và tránh lỗi. Bắt đầu nâng cấp kỹ năng ngay! #JavaScript #React #LậpTrình #WebDev #Coding #JS #ReactJS
📢 React Summit 2026 - Hội nghị React lớn nhất thế giới trở lại!
📍 Amsterdam & Trực tuyến | 12 & 16/06
Tập hợp hơn 60 diễn giả, 1500+ người tham dự trực tiếp và 10K+ lập trình viên online. Phiên bản năm nay tập trung vào kiến trúc phức tạp, React Server Components (RSC), tối ưu hiệu suất với React Compiler và tích hợp AI vào frontend.
🎟️ Vé Early Bird đang mở bán!
#ReactSummit #ReactSummit2026 #ReactJS #WebDevelopment #JavaScript #Frontend #TechConference #LapTrinhVien #CongNgheWeb #V
VistaView: Thư viện lightbox hình ảnh nhẹ & hiện đại cho web!
✅ Không phụ thuộc thư viện (~10KB)
✅ 17+ theme đẹp sẵn có
✅ Tương thích: React, Vue, Svelte hay JS thuần
✅ Nhúng được video (YouTube/Vimeo), bản đồ (Google Maps/OSM)
✅ Điều hướng bàn phím & hỗ trợ mobile
🆓 Tải qua npm: npm install vistaview
#VistaView #Lightbox #WebDevelopment #ThuVienWeb #ReactJS #JavaScript #FrontEnd
https://dev.to/juji/vistaview-a-modern-lightweight-image-lightbox-for-the-web-34gm
Một CLI mã nguồn mở mới giúp biến codebase React/TypeScript thành các cấu trúc context bundle. Công cụ hữu ích cho developer muốn quản lý state hiệu quả! 👨💻🔥
#OpenSource #ReactJS #TypeScript #DeveloperTools #Frontend #CôngNghệ #PhầnMềmMãNguồnMở
https://www.reddit.com/r/opensource/comments/1q6mo79/opensource_cli_that_turns_reacttypescript/
Mẫu Thiết Kế ReactJS: Children Pattern 🧩
Truyền component con qua `children` thay vì render trực tiếp giúp:
🔹 Tránh re-render không cần thiết (vì cha không nắm state của con)
🔹 Linh hoạt khi để component bất kỳ vào "slot"
Ví dụ: Wrapper điều kiện hiển thị nội dung con mà không can thiệp state con.
#ReactJS #DesignPattern #Frontend #ChildrenPattern #MauThietKe #LapTrinh
https://dev.to/kkr0423/reactjs-design-pattern-children-pattern-2p4d
BarbersBuddies, nền tảng đặt lịch cho tiệm cắt tóc, vừa được mở nguồn mã! Xây dựng bằng React/Firebase, có đầy đủ tính năng quản lý, thanh toán, phân tích. Tác giả đang tìm cộng tác viên để cải thiện giao diện di động, thêm ngôn ngữ và sửa lỗi.
#mãnguồn mở #React #Firebase #opensource #reactjs
https://www.reddit.com/r/opensource/comments/1q68rhj/open_sourced_my_barbershop_booking_platform/
Bài viết nhấn mạnh: Khó nhất khi dùng React không phải cú pháp mà là THIẾT KẾ hệ thống dễ bảo trì. Gợi ý chính:
1️⃣ Coi component như hợp đồng - rõ phạm vi và chống lạm dụng
2️⃣ State là gánh nặng: Ưu tiên dữ liệu suy dẫn, tránh useEffect thừa
3️⃣ Custom hook tạo ngữ nghĩa: useUserSession() > useEffect()
4️⃣ Tổ chức folder theo tính năng (features/auth/) thay vì nhóm kỹ thuật
💡 Mục tiêu: Code tự giải thích, dễ mở rộng và ít phá vỡ khi thay đổi
Khám phá "Land Hunter" – ứng dụng web cho bạn đào xuyên Trái Đất! Di chuyển chéo qua bản đồ để xem điểm đối diện, chủ yếu là đại dương 😄 Thử nghiệm vui với hiệu ứng đèn pin, tính năng tự động dẫn đường và hệ thống huy hiệu khi tìm được cặp đất-đất như Tây Ban Nha ↔ New Zealand. Tựa như một trò chơi học địa lý cực thú vị! #LandHunter #WebApp #Geography #FunProject #ReactJS #Leaflet #SideProject #ThúVị #CôngNghệ #ĐịaLý #ReactJS #ỨngDụngWeb
Unlock the Best of React and Rails Together!
Wondering how frontend React integrates with Rails backend? Our latest blog breaks down React on Rails, why it matters for modern web apps, and how it supercharges UX with the power of Rails APIs.
🔗 Read now: https://www.railscarma.com/blog/react-on-rails-explained-frontend-development-with-rails/
#ReactJS #RubyOnRails #WebDevelopment #FullStack #JavaScript #RailsCarma
🚀 Hướng dẫn triển khai ứng dụng TanStack Start + PostgreSQL trên server riêng chỉ trong vài phút với Haloy!
✅ Không Kubernetes, không vendor lock-in, chỉ cần Docker & Haloy - công cụ mã nguồn mở tự xử lý SSL, routing và container
📦 Build ứng dụng todo full-stack gồm:
- TanStack Start (framework React)
- PostgreSQL + Drizzle ORM
- Tự động chuyển môi trường dev/prod
🔧 Triển khai với Haloy CLI, quản lý DB qua tunnel an toàn
💡 Lý tưởng cho indie dev/team nhỏ/self-hosted SaaS!
Tags: #ReactJS #
"🎉 Vừa ra mắt ebook "ReactJS Beginners Guide" hoàn toàn MIỄN PHÍ cho người mới bắt đầu!
📚 Hướng dẫn từng bước với:
- Kiến thức nền tảng (JSX, Components)
- Khái niệm cốt lõi (State, Event Handling)
- Hook nâng cao (useEffect, useContext)
- Best practices thực tế
✨ Hơn 100 ví dụ mã nguồn
👉 Tác giả: Full-stack dev 12+ năm kinh nghiệm
#ReactJS #EbookFree #HocReact #LapTrinhVien #Frontend #React #LearnReact #FreeEbook #VietDev"
https://dev.to/myogeshchavan97/reactjs-beginners-guide-an-ultima
"React v19: Khám phá hook useTransition kết hợp component <Activity/> để duy trì dữ liệu khi chuyển tab. Bao bọc nội dung trong <Activity mode="visible"> giúp dữ liệu không bị mất/tính lại khi người dùng quay lại component. Hiện tại vẫn tồn tại khoảng trống: useTransition kích hoạt lại (isPending) dù dữ liệu đã cache. Giải pháp này cần tối ưu thêm!
#ReactJS #React19 #Hooks #useTransition #ActivityComponent #WebDevelopment #LậpTrình #Frontend #Vietnam #LậpTrìnhViệt"
NEW: reminty
Express UI ideas in JSX. Ship them in Go.
reminty converts React/JSX components to Go + minty, letting web developers be productive immediately while learning Go naturally through the code they ship. Think of it as less than a transpiler, more like an accelerator and little wheels, with compilable Go code on day one
https://github.com/ha1tch/reminty/tree/main
Most trivial to medium-high complexity cases are most often straightforward to translate. For the most complex cases, you still get 80% of the work done, with TODOs and code comments explaining what needs to be manually added or corrected.
The reminty output is meant to be used together with minty
https://github.com/ha1tch/minty
#golang #foss #webdev #indiedev #webdevelopment #reactjs #react
Mình vừa phát hành một Dashboard mã nguồn mở với React + Shadcn, tích hợp Tailwind CSS – hoàn toàn miễn phí và dễ tùy chỉnh. Giao diện hiện đại, tối ưu cho các dự án admin. Xem bản demo, truy cập website hoặc đóng góp trên GitHub! #OpenSource #React #Shadcn #TailwindCSS #Dashboard #MãNguồnMở #ReactJS #GiaoDiệnAdmin
https://www.reddit.com/r/SideProject/comments/1q4lagv/built_open_source_react_shadcn_dashboard/
"Học React cả ngày nghỉ bộn bề: Lưu dữ liệu vào localStorage bằng useEffect 😄
Tác giả chia sẻ cách đồng bộ React state với localStorage qua useState callback chức năng và useEffect:
- useState đọc dữ liệu từ localStorage khi khởi tạo
- useEffect tự động ghi data mới khi state thay đổi
✓ Dữ liệu tồn tại sau refresh
✓ Quản lý state chuyên nghiệp
✓ Sử dụng JSON.stringify/parse cho object/array
Bài học quý: Tích lũy kiến thức từng bước, ngay cả khi không hoàn hảo!
#ReactJS #JavaScri
Một nhà phát triển đã tạo ứng dụng quản lý ngân sách theo phong cách RPG độc đáo! Ứng dụng dùng React, TypeScript, Tailwind CSS, Supabase và AI Gemini làm "Dungeon Master". Điểm đặc biệt: không dùng asset ngoài (hình ảnh SVG, âm thanh từ Web Audio API), có "Theme Engine" đổi giao diện retro (80s, 90s, 00s). Đang tìm feedback về logic gamification.
#RPGbudget #SideProject #ReactJS #Supabase #AI #WebDev #MadeWithCode #ỨngDụngRPG #QuảnLýNgânSách #PhátTriểnWeb #CôngNghệ
⚛️ Các thành phần trong React: Functional vs Class Components
React có 2 loại component:
1️⃣ Functional Components (Khuyên dùng):
- Cú pháp đơn giản, dễ đọc
- Sử dụng hooks (useState, useEffect)
- Không cần dùng `this`
2️⃣ Class Components (Cũ):
- Cú pháp phức tạp hơn
- Bắt buộc dùng `this`
- Không hỗ trợ hooks trực tiếp
React khuyến nghị sử dụng Functional Components vì hiệu suất tốt hơn và tính rõ ràng trong mã nguồn. Class Components chỉ nên dùng khi làm việc với mã kế thừa.
