{"id":2225,"date":"2021-03-04T16:28:41","date_gmt":"2021-03-04T09:28:41","guid":{"rendered":"https:\/\/5mtech.vn\/?p=2225"},"modified":"2021-03-04T16:28:41","modified_gmt":"2021-03-04T09:28:41","slug":"react-la-gi-va-no-hoat-dong-nhu-the-nao","status":"publish","type":"post","link":"https:\/\/5mtech.vn\/tin-tuc\/lap-trinh\/react-la-gi-va-no-hoat-dong-nhu-the-nao.html","title":{"rendered":"React l\u00e0 g\u00ec? V\u00e0 n\u00f3 ho\u1ea1t \u0111\u1ed9ng nh\u01b0 th\u1ebf n\u00e0o?"},"content":{"rendered":"<h1>React l\u00e0 g\u00ec? V\u00e0 n\u00f3 ho\u1ea1t \u0111\u1ed9ng nh\u01b0 th\u1ebf n\u00e0o?<\/h1>\n<div id=\"toc_container\" class=\"toc_wrap_left toc_white no_bullets\">\n<ul class=\"toc_list\">\n<li><a href=\"https:\/\/www.hostinger.vn\/huong-dan\/react-la-gi-va-no-hoat-dong-nhu-the-nao#React-la-gi\">React l\u00e0 g\u00ec?<\/a><\/li>\n<li><a href=\"https:\/\/www.hostinger.vn\/huong-dan\/react-la-gi-va-no-hoat-dong-nhu-the-nao#Tai-sao-su-dung-React\">T\u1ea1i sao s\u1eed d\u1ee5ng React?<\/a><\/li>\n<li><a href=\"https:\/\/www.hostinger.vn\/huong-dan\/react-la-gi-va-no-hoat-dong-nhu-the-nao#React-hoat-dong-nhu-the-nao\">React ho\u1ea1t \u0111\u1ed9ng nh\u01b0 th\u1ebf n\u00e0o?<\/a><\/li>\n<li><a href=\"https:\/\/www.hostinger.vn\/huong-dan\/react-la-gi-va-no-hoat-dong-nhu-the-nao#Loi-ket\">L\u1eddi k\u1ebft<\/a><\/li>\n<\/ul>\n<\/div>\n<h2><span id=\"React-la-gi\">React l\u00e0 g\u00ec?<\/span><\/h2>\n<p><a href=\"https:\/\/reactjs.org\/\" target=\"_blank\" rel=\"nofollow external noopener noreferrer\" data-wpel-link=\"external\"><b>React<\/b><\/a>\u00a0l\u00e0 th\u01b0 vi\u1ec7n\u00a0<a href=\"https:\/\/www.hostinger.vn\/huong-dan\/javascript-la-gi\/\" data-wpel-link=\"internal\"><b>JavaScript<\/b><\/a>\u00a0ph\u1ed5 bi\u1ebfn nh\u1ea5t \u0111\u1ec3 x\u00e2y d\u1ef1ng giao di\u1ec7n ng\u01b0\u1eddi d\u00f9ng (UI). N\u00f3 cho t\u1ed1c \u0111\u1ed9 ph\u1ea3n h\u1ed3i tuy\u1ec7t v\u1eddi khi user nh\u1eadp li\u1ec7u b\u1eb1ng c\u00e1ch s\u1eed d\u1ee5ng ph\u01b0\u01a1ng ph\u00e1p m\u1edbi \u0111\u1ec3 render trang web.<\/p>\n<p>Components c\u1ee7a c\u00f4ng c\u1ee5 n\u00e0y \u0111\u01b0\u1ee3c ph\u00e1t tri\u1ec3n b\u1edfi\u00a0<a href=\"http:\/\/facebook.com\/\" target=\"_blank\" rel=\"nofollow external noopener noreferrer\" data-wpel-link=\"external\"><b>Facebook<\/b><\/a>. N\u00f3 \u0111\u01b0\u1ee3c ra m\u1eaft nh\u01b0 m\u1ed9t c\u00f4ng c\u1ee5 JavaScript m\u00e3 ngu\u1ed3n m\u1edf v\u00e0o n\u0103m 2013. Hi\u1ec7n t\u1ea1i, n\u00f3 \u0111\u00e3 \u0111i tr\u01b0\u1edbc c\u00e1c \u0111\u1ed1i th\u1ee7 ch\u00ednh nh\u01b0\u00a0<a href=\"https:\/\/angular.io\/docs\" target=\"_blank\" rel=\"nofollow external noopener noreferrer\" data-wpel-link=\"external\"><b>Angular<\/b><\/a>\u00a0v\u00e0\u00a0<a href=\"https:\/\/getbootstrap.com\/\" target=\"_blank\" rel=\"nofollow external noopener noreferrer\" data-wpel-link=\"external\"><b>Bootstrap<\/b><\/a>, hai th\u01b0 vi\u1ec7n JavaScript b\u00e1n ch\u1ea1y nh\u1ea5t th\u1eddi b\u1ea5y gi\u1edd.<\/p>\n<p>Trong b\u00e0i vi\u1ebft n\u00e0y, ch\u00fang t\u00f4i s\u1ebd gi\u00fap b\u1ea1n hi\u1ec3u React l\u00e0 g\u00ec v\u00e0 l\u1ee3i \u00edch n\u00f3 mang l\u1ea1i cho c\u00f4ng vi\u1ec7c nh\u01b0 m\u1ed9t nh\u00e0 ph\u00e1t tri\u1ec3n front-end.<\/p>\n<h2><span id=\"Tai-sao-su-dung-React\"><b>T\u1ea1i sao s\u1eed d\u1ee5ng React?<\/b><\/span><\/h2>\n<p>Gi\u1edd b\u1ea1n \u0111\u00e3 bi\u1ebft react l\u00e0 g\u00ec, nh\u01b0ng b\u1ea1n c\u00f3 bi\u1ebft React \u0111\u01b0\u1ee3c s\u1eed d\u1ee5ng b\u1edfi h\u00e0ng tr\u0103m c\u00f4ng ty l\u1edbn tr\u00ean th\u1ebf gi\u1edbi, bao g\u1ed3m\u00a0<a href=\"http:\/\/netflix.com\/\" target=\"_blank\" rel=\"nofollow external noopener noreferrer\" data-wpel-link=\"external\"><b>Netflix<\/b><\/a>,\u00a0<a href=\"http:\/\/airbnb.com\/\" target=\"_blank\" rel=\"nofollow external noopener noreferrer\" data-wpel-link=\"external\"><b>Airbnb<\/b><\/a>,\u00a0<a href=\"https:\/\/www.americanexpress.com\/\" target=\"_blank\" rel=\"nofollow external noopener noreferrer\" data-wpel-link=\"external\"><b>American Express<\/b><\/a>,\u00a0<a href=\"http:\/\/facebook.com\/\" target=\"_blank\" rel=\"nofollow external noopener noreferrer\" data-wpel-link=\"external\"><b>Facebook<\/b><\/a>,\u00a0<a href=\"https:\/\/www.whatsapp.com\/\" target=\"_blank\" rel=\"nofollow external noopener noreferrer\" data-wpel-link=\"external\"><b>WhatsApp<\/b><\/a>,\u00a0<a href=\"http:\/\/ebay.com\/\" target=\"_blank\" rel=\"nofollow external noopener noreferrer\" data-wpel-link=\"external\"><b>eBay<\/b><\/a>, v\u00e0\u00a0<a href=\"http:\/\/instagram.com\/\" target=\"_blank\" rel=\"nofollow external noopener noreferrer\" data-wpel-link=\"external\"><b>Instagram<\/b><\/a>. \u0110\u00e2y l\u00e0 b\u1eb1ng ch\u1ee9ng cho th\u1ea5y c\u00f4ng c\u1ee5 n\u00e0y c\u00f3 m\u1ed9t s\u1ed1 l\u1ee3i th\u1ebf kh\u00f4ng th\u1ec3 c\u1ea1nh tranh\u00a0 v\u1edbi c\u00e1c \u0111\u1ed1i th\u1ee7 kh\u00e1c.<\/p>\n<p>D\u01b0\u1edbi \u0111\u00e2y l\u00e0 m\u1ed9t s\u1ed1 l\u00fd do \u0111\u1ec3 s\u1eed d\u1ee5ng n\u00f3:<\/p>\n<h3><b>1. D\u1ec5 s\u1eed d\u1ee5ng<\/b><\/h3>\n<p>React l\u00e0 m\u1ed9t th\u01b0 vi\u1ec7n\u00a0<a href=\"https:\/\/www.computerhope.com\/jargon\/g\/gui.htm\" target=\"_blank\" rel=\"nofollow external noopener noreferrer\" data-wpel-link=\"external\"><b>GUI<\/b><\/a>\u00a0ngu\u1ed3n m\u1edf JavaScript t\u1eadp trung v\u00e0o m\u1ed9t \u0111i\u1ec1u c\u1ee5 th\u1ec3; ho\u00e0n th\u00e0nh nhi\u1ec7m v\u1ee5 UI hi\u1ec7u qu\u1ea3. N\u00f3 \u0111\u01b0\u1ee3c ph\u00e2n lo\u1ea1i th\u00e0nh ki\u1ec3u \u201cV\u201d trong m\u00f4 h\u00ecnh\u00a0<a href=\"https:\/\/www.youtube.com\/watch?v=pCvZtjoRq1I\" target=\"_blank\" rel=\"nofollow external noopener noreferrer\" data-wpel-link=\"external\"><b>MVC<\/b><\/a>\u00a0(Model-View-Controller).<\/p>\n<p>L\u00e0 l\u1eadp tr\u00ecnh vi\u00ean JavaScript, b\u1ea1n s\u1ebd d\u1ec5 d\u00e0ng hi\u1ec3u \u0111\u01b0\u1ee3c nh\u1eefng \u0111i\u1ec1u c\u01a1 b\u1ea3n v\u1ec1 React. B\u1ea1n th\u1eadm ch\u00ed c\u00f3 th\u1ec3 b\u1eaft \u0111\u1ea7u ph\u00e1t tri\u1ec3n c\u00e1c \u1ee9ng d\u1ee5ng d\u1ef1a tr\u00ean web b\u1eb1ng c\u00e1ch s\u1eed d\u1ee5ng react ch\u1ec9 trong v\u00e0i ng\u00e0y.<\/p>\n<p>\u0110\u1ec3 c\u1ee7ng c\u1ed1 hi\u1ec3u bi\u1ebft c\u1ee7a m\u00ecnh, b\u1ea1n h\u00e3y th\u1eed kh\u00e1m ph\u00e1 th\u00eam nhi\u1ec1u\u00a0<a href=\"https:\/\/reactjs.org\/tutorial\/tutorial.html\" target=\"_blank\" rel=\"nofollow external noopener noreferrer\" data-wpel-link=\"external\"><b>h\u01b0\u1edbng d\u1eabn<\/b><\/a>\u00a0v\u1ec1 React. Ch\u00fang mang \u0111\u1ebfn nhi\u1ec1u th\u00f4ng tin v\u1ec1 c\u00e1ch s\u1eed d\u1ee5ng c\u00f4ng c\u1ee5: videos, h\u01b0\u1edbng d\u1eabn v\u00e0 d\u1eef li\u1ec7u l\u00e0m phong ph\u00fa g\u00f3c nh\u00ecn c\u1ee7a b\u1ea1n.<\/p>\n<h3><b>2. N\u00f3 h\u1ed7 tr\u1ee3 Reusable Component trong Java<\/b><\/h3>\n<p>React cho ph\u00e9p b\u1ea1n s\u1eed d\u1ee5ng l\u1ea1i components \u0111\u00e3 \u0111\u01b0\u1ee3c ph\u00e1t tri\u1ec3n th\u00e0nh c\u00e1c \u1ee9ng d\u1ee5ng kh\u00e1c c\u00f3 c\u00f9ng ch\u1ee9c n\u0103ng. T\u00ednh n\u0103ng t\u00e1i s\u1eed d\u1ee5ng component l\u00e0 m\u1ed9t l\u1ee3i th\u1ebf kh\u00e1c bi\u1ec7t cho c\u00e1c l\u1eadp tr\u00ecnh vi\u00ean.<\/p>\n<h3><b>3. Vi\u1ebft component d\u1ec5 d\u00e0ng h\u01a1n<\/b><\/h3>\n<p>React component d\u1ec5 vi\u1ebft h\u01a1n v\u00ec n\u00f3 s\u1eed d\u1ee5ng\u00a0<a href=\"https:\/\/www.fullstackreact.com\/30-days-of-react\/day-2\/\" target=\"_blank\" rel=\"nofollow external noopener noreferrer\" data-wpel-link=\"external\"><b>JSX<\/b><\/a>, m\u1edf r\u1ed9ng c\u00fa ph\u00e1p t\u00f9y ch\u1ecdn cho JavaScript cho ph\u00e9p b\u1ea1n k\u1ebft h\u1ee3p HTML v\u1edbi JavaScript.<\/p>\n<p>JSX l\u00e0 m\u1ed9t s\u1ef1 pha tr\u1ed9n tuy\u1ec7t v\u1eddi c\u1ee7a JavaScript v\u00e0\u00a0<a href=\"https:\/\/www.hostinger.vn\/huong-dan\/html-cheat-sheet-co-html5-tags-moi\/\" data-wpel-link=\"internal\"><b>HTML<\/b><\/a>. N\u00f3 l\u00e0m r\u00f5 to\u00e0n b\u1ed9 qu\u00e1 tr\u00ecnh vi\u1ebft c\u1ea5u tr\u00fac trang web. Ngo\u00e0i ra, ph\u1ea7n m\u1edf r\u1ed9ng c\u0169ng gi\u00fap render nhi\u1ec1u l\u1ef1a ch\u1ecdn d\u1ec5 d\u00e0ng h\u01a1n.<\/p>\n<p>JSX c\u00f3 th\u1ec3 kh\u00f4ng l\u00e0 ph\u1ea7n m\u1edf r\u1ed9ng c\u00fa ph\u00e1p ph\u1ed5 bi\u1ebfn nh\u1ea5t, nh\u01b0ng n\u00f3 \u0111\u01b0\u1ee3c ch\u1ee9ng minh l\u00e0 hi\u1ec7u qu\u1ea3 trong vi\u1ec7c ph\u00e1t tri\u1ec3n components \u0111\u1eb7c bi\u1ec7t ho\u1eb7c c\u00e1c \u1ee9ng d\u1ee5ng c\u00f3 kh\u1ed1i l\u01b0\u1ee3ng l\u1edbn.<\/p>\n<h3><b>4. Hi\u1ec7u su\u1ea5t t\u1ed1t h\u01a1n v\u1edbi Virtual DOM<\/b><\/h3>\n<p>React s\u1ebd c\u1eadp nh\u1eadt hi\u1ec7u qu\u1ea3 qu\u00e1 tr\u00ecnh\u00a0<a href=\"https:\/\/css-tricks.com\/dom\/\" target=\"_blank\" rel=\"nofollow external noopener noreferrer\" data-wpel-link=\"external\"><b>DOM<\/b><\/a>\u00a0(Document Object Model \u2013 M\u00f4 h\u00ecnh \u0111\u1ed1i t\u01b0\u1ee3ng t\u00e0i li\u1ec7u). Nh\u01b0 b\u1ea1n c\u00f3 th\u1ec3 bi\u1ebft, qu\u00e1 tr\u00ecnh n\u00e0y c\u00f3 th\u1ec3 g\u00e2y ra nhi\u1ec1u th\u1ea5t v\u1ecdng trong c\u00e1c d\u1ef1 \u00e1n \u1ee9ng d\u1ee5ng d\u1ef1a tr\u00ean web. May m\u1eafn l\u00e0 React s\u1eed d\u1ee5ng virtual DOMs, v\u00ec v\u1eady b\u1ea1n c\u00f3 th\u1ec3 tr\u00e1nh \u0111\u01b0\u1ee3c v\u1ea5n \u0111\u1ec1 n\u00e0y.<\/p>\n<p>C\u00f4ng c\u1ee5 cho ph\u00e9p b\u1ea1n x\u00e2y d\u1ef1ng c\u00e1c virtual DOMs v\u00e0 host ch\u00fang trong b\u1ed9 nh\u1edb. Nh\u1edd v\u1eady, m\u1ed7i khi c\u00f3 s\u1ef1 thay \u0111\u1ed5i trong DOM th\u1ef1c t\u1ebf, th\u00ec virtual s\u1ebd thay \u0111\u1ed5i ngay l\u1eadp t\u1ee9c.<\/p>\n<p>H\u1ec7 th\u1ed1ng n\u00e0y s\u1ebd ng\u0103n DOM th\u1ef1c t\u1ebf \u0111\u1ec3 bu\u1ed9c c\u00e1c b\u1ea3n c\u1eadp nh\u1eadt \u0111\u01b0\u1ee3c li\u00ean t\u1ee5c. Do \u0111\u00f3, t\u1ed1c \u0111\u1ed9 c\u1ee7a \u1ee9ng d\u1ee5ng s\u1ebd kh\u00f4ng b\u1ecb gi\u00e1n \u0111o\u1ea1n.<\/p>\n<h3><b>5. Th\u00e2n thi\u1ec7n v\u1edbi SEO<\/b><\/h3>\n<p>React cho ph\u00e9p b\u1ea1n t\u1ea1o giao di\u1ec7n ng\u01b0\u1eddi d\u00f9ng c\u00f3 th\u1ec3 \u0111\u01b0\u1ee3c truy c\u1eadp tr\u00ean c\u00e1c c\u00f4ng c\u1ee5 t\u00ecm ki\u1ebfm kh\u00e1c nhau. T\u00ednh n\u0103ng n\u00e0y l\u00e0 m\u1ed9t l\u1ee3i th\u1ebf r\u1ea5t l\u1edbn v\u00ec kh\u00f4ng ph\u1ea3i t\u1ea5t c\u1ea3 c\u00e1c khung JavaScript \u0111\u1ec1u th\u00e2n thi\u1ec7n v\u1edbi\u00a0<a href=\"https:\/\/www.hostinger.com\/tutorials\/what-is-seo\/\" target=\"_blank\" rel=\"noopener noreferrer\" data-wpel-link=\"exclude\"><b>SEO<\/b><\/a>.<\/p>\n<p>Ngo\u00e0i ra, v\u00ec React c\u00f3 th\u1ec3 t\u0103ng t\u1ed1c qu\u00e1 tr\u00ecnh c\u1ee7a \u1ee9ng d\u1ee5ng n\u00ean c\u00f3 th\u1ec3 c\u1ea3i thi\u1ec7n k\u1ebft qu\u1ea3 SEO. Cu\u1ed1i c\u00f9ng\u00a0<a href=\"https:\/\/www.hostinger.com\/blog\/improve-seo-by-speeding-up-wordpress-site\" target=\"_blank\" rel=\"noopener noreferrer\" data-wpel-link=\"exclude\"><b>t\u1ed1c \u0111\u1ed9 web \u0111\u00f3ng m\u1ed9t vai tr\u00f2 quan tr\u1ecdng trong t\u1ed1i \u01b0u h\u00f3a SEO<\/b><\/a>.<\/p>\n<p>Tuy nhi\u00ean, b\u1ea1n c\u1ea7n l\u01b0u \u00fd r\u1eb1ng React ch\u1ec9 l\u00e0 m\u1ed9t th\u01b0 vi\u1ec7n JavaScript. Ngh\u0129a l\u00e0 n\u00f3 kh\u00f4ng th\u1ec3 t\u1ef1 l\u00e0m m\u1ecdi th\u1ee9. S\u1eed d\u1ee5ng c\u00e1c th\u01b0 vi\u1ec7n b\u1ed5 sung c\u00f3 th\u1ec3 c\u1ea7n thi\u1ebft cho c\u00e1c m\u1ee5c ti\u00eau qu\u1ea3n l\u00fd, \u0111\u1ecbnh tuy\u1ebfn v\u00e0 t\u01b0\u01a1ng t\u00e1c.<\/p>\n<h2><span id=\"React-hoat-dong-nhu-the-nao\"><b>React ho\u1ea1t \u0111\u1ed9ng nh\u01b0 th\u1ebf n\u00e0o?<\/b><\/span><\/h2>\n<p>B\u1ea1n c\u00f3 th\u1ec3 ng\u1ea1c nhi\u00ean khi bi\u1ebft b\u1ea1n c\u00f3 th\u1ec3 vi\u1ebft\u00a0<a href=\"https:\/\/www.hostinger.vn\/huong-dan\/lam-the-nao-de-them-javascript-trong-html\/\" data-wpel-link=\"internal\"><b>codes HTML b\u1eb1ng JavaScript<\/b><\/a>. \u0110\u00e2y ch\u00ednh x\u00e1c l\u00e0 c\u00e1ch React ho\u1ea1t \u0111\u1ed9ng.<\/p>\n<p>T\u1ea1o \u0111\u1ea1i di\u1ec7n c\u1ee7a n\u00fat DOM th\u00f4ng qua t\u1ea1o h\u00e0m\u00a0<b>Element<\/b>\u00a0trong React. \u0110\u00e2y l\u00e0 m\u1ed9t v\u00ed d\u1ee5:<\/p>\n<div class=\"EnlighterJSWrapper classicEnlighterJSWrapper\">\n<ol class=\"hoverEnabled classicEnlighterJS EnlighterJS\">\n<li class=\" odd\"><span class=\"\">React.<\/span><span class=\"kw1\">createElement<\/span><span class=\"br0\">(<\/span><span class=\"st0\">&#8220;div&#8221;<\/span><span class=\"\">, <\/span><span class=\"br0\">{<\/span><span class=\"\"> className: <\/span><span class=\"st0\">&#8220;red&#8221;<\/span> <span class=\"br0\">}<\/span><span class=\"\">, <\/span><span class=\"st0\">&#8220;Children Text&#8221;<\/span><span class=\"br0\">)<\/span><span class=\"\">;<\/span><\/li>\n<li class=\" even\"><span class=\"\">React.<\/span><span class=\"kw1\">createElement<\/span><span class=\"br0\">(<\/span><span class=\"\">MyCounter, <\/span><span class=\"br0\">{<\/span><span class=\"\"> count: <\/span><span class=\"nu0\">3<\/span><span class=\"\"> + <\/span><span class=\"nu0\">5<\/span> <span class=\"br0\">}<\/span><span class=\"br0\">)<\/span><span class=\"\">;<\/span><\/li>\n<\/ol>\n<\/div>\n<p>Nh\u01b0 b\u1ea1n th\u1ea5y, c\u00fa ph\u00e1p trong HTML code \u1edf tr\u00ean r\u1ea5t gi\u1ed1ng v\u1edbi XML components. Tuy nhi\u00ean, thay v\u00ec s\u1eed d\u1ee5ng DOM class truy\u1ec1n th\u1ed1ng, React s\u1eed d\u1ee5ng\u00a0<b>className<\/b>.<\/p>\n<p>Th\u1ebb JSX c\u00f3 t\u00ean th\u1ebb, con v\u00e0 thu\u1ed9c t\u00ednh. D\u1ea5u ngo\u1eb7c k\u00e9p trong c\u00e1c thu\u1ed9c t\u00ednh JSX \u0111\u1ea1i di\u1ec7n cho chu\u1ed7i. Y\u1ebfu t\u1ed1 n\u00e0y t\u01b0\u01a1ng t\u1ef1 nh\u01b0 JavaScript.<\/p>\n<p>Ngo\u00e0i ra, c\u00e1c gi\u00e1 tr\u1ecb s\u1ed1 v\u00e0 bi\u1ec3u th\u1ee9c ph\u1ea3i \u0111\u01b0\u1ee3c vi\u1ebft b\u00ean trong d\u1ea5u ngo\u1eb7c nh\u1ecdn.<\/p>\n<p>V\u00ed d\u1ee5 tr\u00ean minh h\u1ecda r\u1ea5t r\u00f5 c\u00fa ph\u00e1p trong React do c\u00f4ng c\u1ee5 s\u1eed d\u1ee5ng ph\u1ea7n m\u1edf r\u1ed9ng JSX. V\u1ec1 c\u01a1 b\u1ea3n, n\u00f3 l\u00e0 s\u1ef1 k\u1ebft h\u1ee3p gi\u1eefa HTML v\u00e0 JavaScript.<\/p>\n<p>D\u01b0\u1edbi \u0111\u00e2y l\u00e0 m\u1ed9t v\u00ed d\u1ee5 v\u1ec1 React \u0111\u01b0\u1ee3c vi\u1ebft b\u1eb1ng JSX:<\/p>\n<div class=\"EnlighterJSWrapper classicEnlighterJSWrapper\">\n<ol class=\"hoverEnabled classicEnlighterJS EnlighterJS\">\n<li class=\" odd\"><span class=\"\">&lt;div className=<\/span><span class=\"st0\">&#8220;red&#8221;<\/span><span class=\"\">&gt;Children Text&lt;\/div&gt;;<\/span><\/li>\n<li class=\" even\"><span class=\"\">&lt;MyCounter count=<\/span><span class=\"br0\">{<\/span><span class=\"nu0\">3<\/span><span class=\"\"> + <\/span><span class=\"nu0\">5<\/span><span class=\"br0\">}<\/span><span class=\"\"> \/&gt;;<\/span><\/li>\n<li class=\" odd\"><span class=\"\">var GameScores = <\/span><span class=\"br0\">{<\/span><span class=\"\">player1: <\/span><span class=\"nu0\">2<\/span><span class=\"\">,player2: <\/span><span class=\"nu0\">5<\/span><span class=\"br0\">}<\/span><span class=\"\">;<\/span><\/li>\n<li class=\" even\"><span class=\"\">&lt;DashboardUnit data-index=<\/span><span class=\"st0\">&#8220;2&#8221;<\/span><span class=\"\">&gt;<\/span><\/li>\n<li class=\" odd\"><span class=\"\">&lt;h1&gt;Scores&lt;\/h1&gt;&lt;Scoreboard className=<\/span><span class=\"st0\">&#8220;results&#8221;<\/span><span class=\"\"> scores=<\/span><span class=\"br0\">{<\/span><span class=\"\">GameScores<\/span><span class=\"br0\">}<\/span><span class=\"\"> \/&gt;<\/span><\/li>\n<li class=\" even\"><span class=\"\">&lt;\/DashboardUnit&gt;;<\/span><\/li>\n<\/ol>\n<\/div>\n<p>\u0110\u1ec3 chia nh\u1ecf, \u0111\u00e2y l\u00e0 m\u1ed9t s\u1ed1 l\u01b0u \u00fd li\u00ean quan \u0111\u1ebfn th\u1ebb HTML \u1edf tr\u00ean:<\/p>\n<ul>\n<li>&lt;<b>MyCounter<\/b>&gt; \u0111\u01b0\u1ee3c g\u1ecdi l\u00e0 S\u1ed1 \u0111\u1ebfm, hi\u1ec3n th\u1ecb bi\u1ec3u th\u1ee9c s\u1ed1 l\u00e0 gi\u00e1 tr\u1ecb c\u1ee7a n\u00f3.<\/li>\n<li><b>GameScores<\/b>\u00a0l\u00e0 m\u1ed9t \u0111\u1ed1i t\u01b0\u1ee3ng theo ngh\u0129a \u0111en c\u00f3 hai c\u1eb7p gi\u00e1 tr\u1ecb prop.<\/li>\n<li>&lt;<b>DashboardUnit<\/b>&gt; l\u00e0 kh\u1ed1i\u00a0<b>XML<\/b>\u00a0\u0111\u01b0\u1ee3c render tr\u00ean trang.<\/li>\n<li><b>scores={GameScores}<\/b>}: thu\u1ed9c t\u00ednh \u0111i\u1ec3m nh\u1eadn \u0111\u01b0\u1ee3c gi\u00e1 tr\u1ecb t\u1eeb GameScores, \u0111\u00e3 \u0111\u01b0\u1ee3c x\u00e1c \u0111\u1ecbnh tr\u01b0\u1edbc \u0111\u00f3.<\/li>\n<\/ul>\n<p>H\u1ea7u h\u1ebft c\u00e1c ph\u1ea7n c\u1ee7a React \u0111\u01b0\u1ee3c vi\u1ebft b\u1eb1ng c\u00e1ch s\u1eed d\u1ee5ng JSX (JavaScript XML) ch\u1ee9 kh\u00f4ng ph\u1ea3i JavaScript ti\u00eau chu\u1ea9n (JS). Tuy nhi\u00ean, b\u1ea1n c\u1ea7n l\u01b0u \u00fd r\u1eb1ng m\u1ee5c \u0111\u00edch duy nh\u1ea5t c\u1ee7a vi\u1ec7c n\u00e0y l\u00e0 l\u00e0m cho React components d\u1ec5 t\u1ea1o h\u01a1n.<\/p>\n<p>B\u1ea1n c\u00f3 th\u1ec3 t\u1ea1o React components v\u1edbi JavaScript ti\u00eau chu\u1ea9n, nh\u01b0ng ch\u00fang t\u00f4i \u0111\u1ea3m b\u1ea3o n\u00f3 s\u1ebd c\u1ef1c k\u00ec l\u1ed9n x\u1ed9n.<\/p>\n<p>H\u01a1n n\u1eefa, \u00fd t\u01b0\u1edfng \u0111\u1eb1ng sau vi\u1ec7c s\u1eed d\u1ee5ng JSX trong React l\u00e0 Facebook (v\u1edbi t\u01b0 c\u00e1ch l\u00e0 nh\u00e0 ph\u00e1t tri\u1ec3n ban \u0111\u1ea7u) mu\u1ed1n cung c\u1ea5p m\u1ed9t lo\u1ea1i ti\u1ec7n \u00edch m\u1edf r\u1ed9ng c\u00f3 c\u00fa ph\u00e1p c\u1ee5 th\u1ec3 v\u1edbi c\u1ea5u h\u00ecnh r\u00f5 r\u00e0ng cho c\u00e1c nh\u00e0 ph\u00e1t tri\u1ec3n.<\/p>\n<h2><span id=\"Loi-ket\"><b>L\u1eddi k\u1ebft<br \/>\n<\/b><\/span><\/h2>\n<p>Cu\u1ed1i c\u00f9ng, ch\u00fang t\u00f4i hy v\u1ecdng r\u1eb1ng b\u00e0i vi\u1ebft n\u00e0y c\u00f3 th\u1ec3 cung c\u1ea5p m\u1ed9t s\u1ed1 g\u00f3c nh\u00ecn v\u1ec1 react l\u00e0 g\u00ec v\u00e0 c\u00e1ch ho\u1ea1t \u0111\u1ed9ng th\u1ef1c s\u1ef1 c\u1ee7a n\u00f3. \u0110\u1ec3 k\u1ebft lu\u1eadn t\u1ea5t c\u1ea3, \u0111\u00e2y l\u00e0 m\u1ed9t s\u1ed1 l\u01b0u \u00fd quan tr\u1ecdng li\u00ean quan \u0111\u1ebfn ch\u1ee7 \u0111\u1ec1:<\/p>\n<ol>\n<li>React ban \u0111\u1ea7u \u0111\u01b0\u1ee3c gi\u1edbi thi\u1ec7u b\u1edfi Facebook.<\/li>\n<li>N\u00f3 \u0111\u01b0\u1ee3c s\u1eed d\u1ee5ng b\u1edfi r\u1ea5t nhi\u1ec1u nh\u00e3n hi\u1ec7u v\u00e0 c\u00f4ng ty l\u1edbn tr\u00ean th\u1ebf gi\u1edbi.<\/li>\n<li>React ph\u1ee5c v\u1ee5 nh\u01b0 m\u1ed9t th\u01b0 vi\u1ec7n JavaScript. Tuy nhi\u00ean, n\u00f3 c\u0169ng c\u00f3 th\u1ec3 \u0111\u01b0\u1ee3c ph\u00e2n lo\u1ea1i th\u00e0nh m\u1ed9t khung.<\/li>\n<li>Khung n\u00e0y kh\u00f4ng th\u1ec3 ho\u1ea1t \u0111\u1ed9ng m\u1ed9t m\u00ecnh, b\u1ea1n s\u1ebd c\u1ea7n c\u00e1c y\u1ebfu t\u1ed1 b\u1ed5 sung cho c\u00e1c m\u1ee5c \u0111\u00edch kh\u00e1c nhau nh\u01b0 \u0111\u1ecbnh tuy\u1ebfn, qu\u1ea3n l\u00fd, v.v.<\/li>\n<li>React s\u1eed d\u1ee5ng virtual DOM \u0111\u1ec3 t\u1ed1i \u01b0u h\u00f3a trang t\u1ed1t h\u01a1n<\/li>\n<li>Khung n\u00e0y d\u1ec5 s\u1eed d\u1ee5ng v\u00e0 th\u00e2n thi\u1ec7n v\u1edbi SEO.<\/li>\n<li>H\u1ed7 tr\u1ee3 t\u00e1i s\u1eed d\u1ee5ng components.<\/li>\n<li>S\u1eed d\u1ee5ng ti\u1ec7n \u00edch m\u1edf r\u1ed9ng JSX, v\u1ec1 c\u01a1 b\u1ea3n l\u00e0 s\u1ef1 k\u1ebft h\u1ee3p tuy\u1ec7t v\u1eddi gi\u1eefa HTML v\u00e0 JavaScript.<\/li>\n<li>React s\u1eed d\u1ee5ng JSX ch\u1ec9 \u0111\u1ec3 vi\u1ebft d\u1ec5 d\u00e0ng h\u01a1n, kh\u00f4ng ph\u1ea3i v\u00ec n\u00f3 ho\u1ea1t \u0111\u1ed9ng t\u1ed1t h\u01a1n.<\/li>\n<\/ol>\n<p>Gi\u1edd b\u1ea1n \u0111\u00e3 bi\u1ebft react l\u00e0 g\u00ec, n\u00f3 ho\u1ea1t \u0111\u1ed9ng nh\u01b0 th\u1ebf n\u00e0o. N\u1ebfu b\u1ea1n mu\u1ed1n c\u00f9ng th\u1ea3o lu\u1eadn v\u1ec1 React, \u0111\u1eebng ng\u1ea1i h\u00e3y \u0111\u1ec3 l\u1ea1i b\u00ecnh lu\u1eadn b\u00ean d\u01b0\u1edbi nh\u00e9.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>React l\u00e0 g\u00ec? V\u00e0 n\u00f3 ho\u1ea1t \u0111\u1ed9ng nh\u01b0 th\u1ebf n\u00e0o? React l\u00e0 g\u00ec? T\u1ea1i sao s\u1eed d\u1ee5ng React? React ho\u1ea1t \u0111\u1ed9ng nh\u01b0 th\u1ebf n\u00e0o? L\u1eddi k\u1ebft React l\u00e0 g\u00ec? React\u00a0l\u00e0 th\u01b0 vi\u1ec7n\u00a0JavaScript\u00a0ph\u1ed5 bi\u1ebfn nh\u1ea5t \u0111\u1ec3 x\u00e2y d\u1ef1ng giao di\u1ec7n ng\u01b0\u1eddi d\u00f9ng (UI). N\u00f3 cho t\u1ed1c \u0111\u1ed9 ph\u1ea3n h\u1ed3i tuy\u1ec7t v\u1eddi khi user nh\u1eadp li\u1ec7u b\u1eb1ng [&#8230;]\n","protected":false},"author":1,"featured_media":2226,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[462,24],"tags":[464],"class_list":["post-2225","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-lap-trinh","category-tin-tuc","tag-react-js"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.4 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>React l\u00e0 g\u00ec? V\u00e0 n\u00f3 ho\u1ea1t \u0111\u1ed9ng nh\u01b0 th\u1ebf n\u00e0o? - 5M Technologies<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/5mtech.vn\/tin-tuc\/lap-trinh\/react-la-gi-va-no-hoat-dong-nhu-the-nao.html\" \/>\n<meta property=\"og:locale\" content=\"vi_VN\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"React l\u00e0 g\u00ec? V\u00e0 n\u00f3 ho\u1ea1t \u0111\u1ed9ng nh\u01b0 th\u1ebf n\u00e0o? - 5M Technologies\" \/>\n<meta property=\"og:description\" content=\"React l\u00e0 g\u00ec? V\u00e0 n\u00f3 ho\u1ea1t \u0111\u1ed9ng nh\u01b0 th\u1ebf n\u00e0o? React l\u00e0 g\u00ec? T\u1ea1i sao s\u1eed d\u1ee5ng React? React ho\u1ea1t \u0111\u1ed9ng nh\u01b0 th\u1ebf n\u00e0o? L\u1eddi k\u1ebft React l\u00e0 g\u00ec? React\u00a0l\u00e0 th\u01b0 vi\u1ec7n\u00a0JavaScript\u00a0ph\u1ed5 bi\u1ebfn nh\u1ea5t \u0111\u1ec3 x\u00e2y d\u1ef1ng giao di\u1ec7n ng\u01b0\u1eddi d\u00f9ng (UI). N\u00f3 cho t\u1ed1c \u0111\u1ed9 ph\u1ea3n h\u1ed3i tuy\u1ec7t v\u1eddi khi user nh\u1eadp li\u1ec7u b\u1eb1ng [...]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/5mtech.vn\/tin-tuc\/lap-trinh\/react-la-gi-va-no-hoat-dong-nhu-the-nao.html\" \/>\n<meta property=\"og:site_name\" content=\"5M Technologies\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/5mtech.vn\" \/>\n<meta property=\"article:author\" content=\"https:\/\/www.facebook.com\/5mtech.vn\" \/>\n<meta property=\"article:published_time\" content=\"2021-03-04T09:28:41+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/5mtech.vn\/5mtech-core-frontend\/uploads\/2021\/03\/0_lzQ80MSKJYLcUV0f.png\" \/>\n\t<meta property=\"og:image:width\" content=\"696\" \/>\n\t<meta property=\"og:image:height\" content=\"387\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"admin\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"\u0110\u01b0\u1ee3c vi\u1ebft b\u1edfi\" \/>\n\t<meta name=\"twitter:data1\" content=\"admin\" \/>\n\t<meta name=\"twitter:label2\" content=\"\u01af\u1edbc t\u00ednh th\u1eddi gian \u0111\u1ecdc\" \/>\n\t<meta name=\"twitter:data2\" content=\"7 ph\u00fat\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/5mtech.vn\\\/tin-tuc\\\/lap-trinh\\\/react-la-gi-va-no-hoat-dong-nhu-the-nao.html#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/5mtech.vn\\\/tin-tuc\\\/lap-trinh\\\/react-la-gi-va-no-hoat-dong-nhu-the-nao.html\"},\"author\":{\"name\":\"admin\",\"@id\":\"https:\\\/\\\/5mtech.vn\\\/#\\\/schema\\\/person\\\/461255659c993d6b75b9fee0e2965c57\"},\"headline\":\"React l\u00e0 g\u00ec? V\u00e0 n\u00f3 ho\u1ea1t \u0111\u1ed9ng nh\u01b0 th\u1ebf n\u00e0o?\",\"datePublished\":\"2021-03-04T09:28:41+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/5mtech.vn\\\/tin-tuc\\\/lap-trinh\\\/react-la-gi-va-no-hoat-dong-nhu-the-nao.html\"},\"wordCount\":1996,\"commentCount\":2,\"publisher\":{\"@id\":\"https:\\\/\\\/5mtech.vn\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/5mtech.vn\\\/tin-tuc\\\/lap-trinh\\\/react-la-gi-va-no-hoat-dong-nhu-the-nao.html#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/5mtech.vn\\\/5mtech-core-frontend\\\/uploads\\\/2021\\\/03\\\/0_lzQ80MSKJYLcUV0f.png\",\"keywords\":[\"react js\"],\"articleSection\":[\"L\u1eadp tr\u00ecnh\",\"Tin t\u1ee9c\"],\"inLanguage\":\"vi\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/5mtech.vn\\\/tin-tuc\\\/lap-trinh\\\/react-la-gi-va-no-hoat-dong-nhu-the-nao.html#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/5mtech.vn\\\/tin-tuc\\\/lap-trinh\\\/react-la-gi-va-no-hoat-dong-nhu-the-nao.html\",\"url\":\"https:\\\/\\\/5mtech.vn\\\/tin-tuc\\\/lap-trinh\\\/react-la-gi-va-no-hoat-dong-nhu-the-nao.html\",\"name\":\"React l\u00e0 g\u00ec? V\u00e0 n\u00f3 ho\u1ea1t \u0111\u1ed9ng nh\u01b0 th\u1ebf n\u00e0o? - 5M Technologies\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/5mtech.vn\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/5mtech.vn\\\/tin-tuc\\\/lap-trinh\\\/react-la-gi-va-no-hoat-dong-nhu-the-nao.html#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/5mtech.vn\\\/tin-tuc\\\/lap-trinh\\\/react-la-gi-va-no-hoat-dong-nhu-the-nao.html#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/5mtech.vn\\\/5mtech-core-frontend\\\/uploads\\\/2021\\\/03\\\/0_lzQ80MSKJYLcUV0f.png\",\"datePublished\":\"2021-03-04T09:28:41+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/5mtech.vn\\\/tin-tuc\\\/lap-trinh\\\/react-la-gi-va-no-hoat-dong-nhu-the-nao.html#breadcrumb\"},\"inLanguage\":\"vi\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/5mtech.vn\\\/tin-tuc\\\/lap-trinh\\\/react-la-gi-va-no-hoat-dong-nhu-the-nao.html\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"vi\",\"@id\":\"https:\\\/\\\/5mtech.vn\\\/tin-tuc\\\/lap-trinh\\\/react-la-gi-va-no-hoat-dong-nhu-the-nao.html#primaryimage\",\"url\":\"https:\\\/\\\/5mtech.vn\\\/5mtech-core-frontend\\\/uploads\\\/2021\\\/03\\\/0_lzQ80MSKJYLcUV0f.png\",\"contentUrl\":\"https:\\\/\\\/5mtech.vn\\\/5mtech-core-frontend\\\/uploads\\\/2021\\\/03\\\/0_lzQ80MSKJYLcUV0f.png\",\"width\":696,\"height\":387},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/5mtech.vn\\\/tin-tuc\\\/lap-trinh\\\/react-la-gi-va-no-hoat-dong-nhu-the-nao.html#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Trang ch\u1ee7\",\"item\":\"https:\\\/\\\/5mtech.vn\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"React l\u00e0 g\u00ec? V\u00e0 n\u00f3 ho\u1ea1t \u0111\u1ed9ng nh\u01b0 th\u1ebf n\u00e0o?\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/5mtech.vn\\\/#website\",\"url\":\"https:\\\/\\\/5mtech.vn\\\/\",\"name\":\"5M Technologies\",\"description\":\"Cung c\u1ea5p gi\u1ea3i ph\u00e1p c\u00f4ng ngh\u1ec7 th\u00f4ng tin v\u00e0 truy\u1ec1n th\u00f4ng\",\"publisher\":{\"@id\":\"https:\\\/\\\/5mtech.vn\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/5mtech.vn\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"vi\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/5mtech.vn\\\/#organization\",\"name\":\"5M Technologies\",\"url\":\"https:\\\/\\\/5mtech.vn\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"vi\",\"@id\":\"https:\\\/\\\/5mtech.vn\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/5mtech.vn\\\/5mtech-core-frontend\\\/uploads\\\/2021\\\/02\\\/logo.png\",\"contentUrl\":\"https:\\\/\\\/5mtech.vn\\\/5mtech-core-frontend\\\/uploads\\\/2021\\\/02\\\/logo.png\",\"width\":819,\"height\":969,\"caption\":\"5M Technologies\"},\"image\":{\"@id\":\"https:\\\/\\\/5mtech.vn\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/5mtech.vn\",\"https:\\\/\\\/www.youtube.com\\\/channel\\\/UC--7vNJHf_iGGodO1yLgKKg\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/5mtech.vn\\\/#\\\/schema\\\/person\\\/461255659c993d6b75b9fee0e2965c57\",\"name\":\"admin\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"vi\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/bd8af4d58e4f5b24d627ddb4eb86cb966d75f265e634ff7928a7ccb3557bf20e?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/bd8af4d58e4f5b24d627ddb4eb86cb966d75f265e634ff7928a7ccb3557bf20e?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/bd8af4d58e4f5b24d627ddb4eb86cb966d75f265e634ff7928a7ccb3557bf20e?s=96&d=mm&r=g\",\"caption\":\"admin\"},\"description\":\"5M Technologies - Cung c\u1ea5p gi\u1ea3i ph\u00e1p c\u00f4ng ngh\u1ec7 th\u00f4ng tin v\u00e0 truy\u1ec1n th\u00f4ng\",\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/5mtech.vn\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"React l\u00e0 g\u00ec? V\u00e0 n\u00f3 ho\u1ea1t \u0111\u1ed9ng nh\u01b0 th\u1ebf n\u00e0o? - 5M Technologies","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/5mtech.vn\/tin-tuc\/lap-trinh\/react-la-gi-va-no-hoat-dong-nhu-the-nao.html","og_locale":"vi_VN","og_type":"article","og_title":"React l\u00e0 g\u00ec? V\u00e0 n\u00f3 ho\u1ea1t \u0111\u1ed9ng nh\u01b0 th\u1ebf n\u00e0o? - 5M Technologies","og_description":"React l\u00e0 g\u00ec? V\u00e0 n\u00f3 ho\u1ea1t \u0111\u1ed9ng nh\u01b0 th\u1ebf n\u00e0o? React l\u00e0 g\u00ec? T\u1ea1i sao s\u1eed d\u1ee5ng React? React ho\u1ea1t \u0111\u1ed9ng nh\u01b0 th\u1ebf n\u00e0o? L\u1eddi k\u1ebft React l\u00e0 g\u00ec? React\u00a0l\u00e0 th\u01b0 vi\u1ec7n\u00a0JavaScript\u00a0ph\u1ed5 bi\u1ebfn nh\u1ea5t \u0111\u1ec3 x\u00e2y d\u1ef1ng giao di\u1ec7n ng\u01b0\u1eddi d\u00f9ng (UI). N\u00f3 cho t\u1ed1c \u0111\u1ed9 ph\u1ea3n h\u1ed3i tuy\u1ec7t v\u1eddi khi user nh\u1eadp li\u1ec7u b\u1eb1ng [...]","og_url":"https:\/\/5mtech.vn\/tin-tuc\/lap-trinh\/react-la-gi-va-no-hoat-dong-nhu-the-nao.html","og_site_name":"5M Technologies","article_publisher":"https:\/\/www.facebook.com\/5mtech.vn","article_author":"https:\/\/www.facebook.com\/5mtech.vn","article_published_time":"2021-03-04T09:28:41+00:00","og_image":[{"width":696,"height":387,"url":"https:\/\/5mtech.vn\/5mtech-core-frontend\/uploads\/2021\/03\/0_lzQ80MSKJYLcUV0f.png","type":"image\/png"}],"author":"admin","twitter_card":"summary_large_image","twitter_misc":{"\u0110\u01b0\u1ee3c vi\u1ebft b\u1edfi":"admin","\u01af\u1edbc t\u00ednh th\u1eddi gian \u0111\u1ecdc":"7 ph\u00fat"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/5mtech.vn\/tin-tuc\/lap-trinh\/react-la-gi-va-no-hoat-dong-nhu-the-nao.html#article","isPartOf":{"@id":"https:\/\/5mtech.vn\/tin-tuc\/lap-trinh\/react-la-gi-va-no-hoat-dong-nhu-the-nao.html"},"author":{"name":"admin","@id":"https:\/\/5mtech.vn\/#\/schema\/person\/461255659c993d6b75b9fee0e2965c57"},"headline":"React l\u00e0 g\u00ec? V\u00e0 n\u00f3 ho\u1ea1t \u0111\u1ed9ng nh\u01b0 th\u1ebf n\u00e0o?","datePublished":"2021-03-04T09:28:41+00:00","mainEntityOfPage":{"@id":"https:\/\/5mtech.vn\/tin-tuc\/lap-trinh\/react-la-gi-va-no-hoat-dong-nhu-the-nao.html"},"wordCount":1996,"commentCount":2,"publisher":{"@id":"https:\/\/5mtech.vn\/#organization"},"image":{"@id":"https:\/\/5mtech.vn\/tin-tuc\/lap-trinh\/react-la-gi-va-no-hoat-dong-nhu-the-nao.html#primaryimage"},"thumbnailUrl":"https:\/\/5mtech.vn\/5mtech-core-frontend\/uploads\/2021\/03\/0_lzQ80MSKJYLcUV0f.png","keywords":["react js"],"articleSection":["L\u1eadp tr\u00ecnh","Tin t\u1ee9c"],"inLanguage":"vi","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/5mtech.vn\/tin-tuc\/lap-trinh\/react-la-gi-va-no-hoat-dong-nhu-the-nao.html#respond"]}]},{"@type":"WebPage","@id":"https:\/\/5mtech.vn\/tin-tuc\/lap-trinh\/react-la-gi-va-no-hoat-dong-nhu-the-nao.html","url":"https:\/\/5mtech.vn\/tin-tuc\/lap-trinh\/react-la-gi-va-no-hoat-dong-nhu-the-nao.html","name":"React l\u00e0 g\u00ec? V\u00e0 n\u00f3 ho\u1ea1t \u0111\u1ed9ng nh\u01b0 th\u1ebf n\u00e0o? - 5M Technologies","isPartOf":{"@id":"https:\/\/5mtech.vn\/#website"},"primaryImageOfPage":{"@id":"https:\/\/5mtech.vn\/tin-tuc\/lap-trinh\/react-la-gi-va-no-hoat-dong-nhu-the-nao.html#primaryimage"},"image":{"@id":"https:\/\/5mtech.vn\/tin-tuc\/lap-trinh\/react-la-gi-va-no-hoat-dong-nhu-the-nao.html#primaryimage"},"thumbnailUrl":"https:\/\/5mtech.vn\/5mtech-core-frontend\/uploads\/2021\/03\/0_lzQ80MSKJYLcUV0f.png","datePublished":"2021-03-04T09:28:41+00:00","breadcrumb":{"@id":"https:\/\/5mtech.vn\/tin-tuc\/lap-trinh\/react-la-gi-va-no-hoat-dong-nhu-the-nao.html#breadcrumb"},"inLanguage":"vi","potentialAction":[{"@type":"ReadAction","target":["https:\/\/5mtech.vn\/tin-tuc\/lap-trinh\/react-la-gi-va-no-hoat-dong-nhu-the-nao.html"]}]},{"@type":"ImageObject","inLanguage":"vi","@id":"https:\/\/5mtech.vn\/tin-tuc\/lap-trinh\/react-la-gi-va-no-hoat-dong-nhu-the-nao.html#primaryimage","url":"https:\/\/5mtech.vn\/5mtech-core-frontend\/uploads\/2021\/03\/0_lzQ80MSKJYLcUV0f.png","contentUrl":"https:\/\/5mtech.vn\/5mtech-core-frontend\/uploads\/2021\/03\/0_lzQ80MSKJYLcUV0f.png","width":696,"height":387},{"@type":"BreadcrumbList","@id":"https:\/\/5mtech.vn\/tin-tuc\/lap-trinh\/react-la-gi-va-no-hoat-dong-nhu-the-nao.html#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Trang ch\u1ee7","item":"https:\/\/5mtech.vn\/"},{"@type":"ListItem","position":2,"name":"React l\u00e0 g\u00ec? V\u00e0 n\u00f3 ho\u1ea1t \u0111\u1ed9ng nh\u01b0 th\u1ebf n\u00e0o?"}]},{"@type":"WebSite","@id":"https:\/\/5mtech.vn\/#website","url":"https:\/\/5mtech.vn\/","name":"5M Technologies","description":"Cung c\u1ea5p gi\u1ea3i ph\u00e1p c\u00f4ng ngh\u1ec7 th\u00f4ng tin v\u00e0 truy\u1ec1n th\u00f4ng","publisher":{"@id":"https:\/\/5mtech.vn\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/5mtech.vn\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"vi"},{"@type":"Organization","@id":"https:\/\/5mtech.vn\/#organization","name":"5M Technologies","url":"https:\/\/5mtech.vn\/","logo":{"@type":"ImageObject","inLanguage":"vi","@id":"https:\/\/5mtech.vn\/#\/schema\/logo\/image\/","url":"https:\/\/5mtech.vn\/5mtech-core-frontend\/uploads\/2021\/02\/logo.png","contentUrl":"https:\/\/5mtech.vn\/5mtech-core-frontend\/uploads\/2021\/02\/logo.png","width":819,"height":969,"caption":"5M Technologies"},"image":{"@id":"https:\/\/5mtech.vn\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/5mtech.vn","https:\/\/www.youtube.com\/channel\/UC--7vNJHf_iGGodO1yLgKKg"]},{"@type":"Person","@id":"https:\/\/5mtech.vn\/#\/schema\/person\/461255659c993d6b75b9fee0e2965c57","name":"admin","image":{"@type":"ImageObject","inLanguage":"vi","@id":"https:\/\/secure.gravatar.com\/avatar\/bd8af4d58e4f5b24d627ddb4eb86cb966d75f265e634ff7928a7ccb3557bf20e?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/bd8af4d58e4f5b24d627ddb4eb86cb966d75f265e634ff7928a7ccb3557bf20e?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/bd8af4d58e4f5b24d627ddb4eb86cb966d75f265e634ff7928a7ccb3557bf20e?s=96&d=mm&r=g","caption":"admin"},"description":"5M Technologies - Cung c\u1ea5p gi\u1ea3i ph\u00e1p c\u00f4ng ngh\u1ec7 th\u00f4ng tin v\u00e0 truy\u1ec1n th\u00f4ng","sameAs":["https:\/\/www.facebook.com\/5mtech.vn"]}]}},"_links":{"self":[{"href":"https:\/\/5mtech.vn\/api\/wp\/v2\/posts\/2225","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/5mtech.vn\/api\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/5mtech.vn\/api\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/5mtech.vn\/api\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/5mtech.vn\/api\/wp\/v2\/comments?post=2225"}],"version-history":[{"count":1,"href":"https:\/\/5mtech.vn\/api\/wp\/v2\/posts\/2225\/revisions"}],"predecessor-version":[{"id":2227,"href":"https:\/\/5mtech.vn\/api\/wp\/v2\/posts\/2225\/revisions\/2227"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/5mtech.vn\/api\/wp\/v2\/media\/2226"}],"wp:attachment":[{"href":"https:\/\/5mtech.vn\/api\/wp\/v2\/media?parent=2225"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/5mtech.vn\/api\/wp\/v2\/categories?post=2225"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/5mtech.vn\/api\/wp\/v2\/tags?post=2225"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}