{"id":534,"date":"2021-03-30T14:45:20","date_gmt":"2021-03-30T14:45:20","guid":{"rendered":"https:\/\/egany.com\/blogs\/?p=534"},"modified":"2023-04-25T09:35:44","modified_gmt":"2023-04-25T09:35:44","slug":"svelte-van-cuoc-thanh-cong","status":"publish","type":"post","link":"https:\/\/egany.com\/blogs\/svelte-van-cuoc-thanh-cong\/","title":{"rendered":"Svelte &#8211; V\u00e1n c\u01b0\u1ee3c th\u00e0nh c\u00f4ng"},"content":{"rendered":"<p>Svelte l\u00e0 m\u1ed9t v\u00e1n c\u01b0\u1ee3c l\u1edbn t\u1ea1i EGANY v\u00e0 \u0111\u00fang nh\u01b0 idol Hu\u1ea5n Hoa H\u1ed3ng \u0111\u00e3 n\u00f3i:<\/p>\n<blockquote>\n<p>C\u1edd b\u1ea1c ng\u01b0\u1eddi kh\u00f4ng ch\u01a1i m\u1edbi l\u00e0 ng\u01b0\u1eddi th\u1eafng. Ng\u01b0\u1eddi ch\u01a1i kh\u00f4ng bao gi\u1edd th\u1eafng<\/p>\n<\/blockquote>\n<h2>\u2728 V\u1ea5n \u0111\u1ec1<\/h2>\n<p>V\u00e0o m\u1ed9t ng\u00e0y \u0111\u1eb9p tr\u1eddi, nh\u1eadn ra nh\u1eefng s\u1ea3n ph\u1ea9m hi\u1ec7n t\u1ea1i c\u1ee7a EGANY ph\u1ee5 thu\u1ed9c qu\u00e1 nhi\u1ec1u v\u00e0o n\u1ec1n t\u1ea3ng c\u1ee7a \u0111\u1ed1i t\u00e1c, s\u1ebfp quy\u1ebft \u0111\u1ecbnh t\u1ea1o ra m\u1ed9t n\u1ec1n t\u1ea3ng mini v\u1edbi t\u00ean g\u1ecdi <a href=\"https:\/\/egany.app\/\" rel=\"nofollow noopener\" target=\"_blank\"><em>Cross-platform Apps<\/em><\/a> <em>(CPA)<\/em>.<\/p>\n<p>C\u00e1c app c\u1ee7a <em>CPA<\/em> d\u1ef1 \u0111\u1ecbnh s\u1ebd t\u01b0\u01a1ng \u0111\u1ed1i nh\u1ecf, ch\u1ee7 y\u1ebfu l\u00e0 d\u1ea1ng addon\/plugins \u0111\u01b0\u1ee3c s\u1eed d\u1ee5ng \u0111\u1ec3 th\u00eam t\u00ednh n\u0103ng. \u0110\u01a1n c\u1eed nh\u1ea5t l\u00e0 <a href=\"https:\/\/docs.egany.com\/cross-platform\/ega-shop\/\">egaShop<\/a> v\u1edbi t\u00ednh n\u0103ng nh\u00fang s\u1ea3n ph\u1ea9m, gi\u1ecf h\u00e0ng v\u00e0o c\u00e1c trang b\u00e1n h\u00e0ng theo chi\u1ebfn d\u1ecbch c\u1ee7a ng\u01b0\u1eddi d\u00f9ng.<\/p>\n<p>Y\u00eau c\u1ea7u ban \u0111\u1ea7u c\u1ee7a <em>CPA<\/em> nh\u01b0 sau:<\/p>\n<ol>\n<li>Kh\u00f4ng ph\u1ee5 thu\u1ed9c n\u1ec1n t\u1ea3ng th\u1ee9 3 (third-party)<\/li>\n<li>D\u1ec5 d\u00e0ng t\u00edch h\u1ee3p v\u00e0o website c\u1ee7a ng\u01b0\u1eddi d\u00f9ng<\/li>\n<li>Nhanh\/G\u1ecdn\/\u0110\u1eb9p<\/li>\n<\/ol>\n<p>Sau nhi\u1ec1u ng\u00e0y li\u1ec1n th\u1ee9c khuya d\u1eady tr\u1ec5 th\u00ec team c\u00f3 \u0111\u01b0\u1ee3c m\u00f4 h\u00ecnh sau:<\/p>\n<p align=\"center\">\n<img decoding=\"async\" src=\"https:\/\/egany.cdn.vccloud.vn\/blogs\/wp-content\/uploads\/2021\/03\/bundle-strategy-700x272.png\" alt=\"M\u00f4 h\u00ecnh cross-platform\">\n<\/p>\n<blockquote>\n<p>M\u00f4 h\u00ecnh \u0111\u00e3 \u0111\u01b0\u1ee3c t\u1ed1i gi\u1ea3n h\u1ebft m\u1ee9c \u0111\u1ec3 ph\u1ee5c v\u1ee5 cho b\u00e0i vi\u1ebft.<\/p>\n<\/blockquote>\n<ul>\n<li><strong>Bundle Builder<\/strong>: \u0111\u1ea3m nh\u1eadn nhi\u1ec7m v\u1ee5 build bundle (duh)<\/li>\n<li><strong>Bundle Server<\/strong>: serve bundle content t\u1eeb ph\u00eda <em>Storage<\/em>, c\u00f3 authentication d\u01b0\u1edbi d\u1ea1ng unique URL (m\u1ed7i url s\u1ebd \u1ee9ng v\u1edbi m\u1ed9t user)<\/li>\n<li><strong>Storage<\/strong>: ch\u1ee9a file bundle<\/li>\n<\/ul>\n<p>Nhi\u1ec7m v\u1ee5 b\u00e2y gi\u1edd c\u1ee7a m\u00ecnh l\u00e0 t\u00ecm ki\u1ebfm c\u00f4ng ngh\u1ec7 \u0111\u1ec3 x\u00e2y d\u1ef1ng app trong <em>bundle.js<\/em>.<\/p>\n<h2>V\u00ec sao ch\u1ecdn Svelte?<\/h2>\n<p align=\"center\">\n<img decoding=\"async\" src=\"https:\/\/media.giphy.com\/media\/3o7btSt2Et1GgIaDAY\/giphy.gif\" alt=\"Package flexing gif\">\n<\/p>\n<h3>1. Bundle<\/h3>\n<p><strong>\u2705 \u01afu \u0111i\u1ec3m<\/strong><\/p>\n<p>M\u1ed1i lo ng\u1ea1i l\u1edbn nh\u1ea5t c\u1ee7a m\u00ecnh v\u1eabn l\u00e0 bundle size c\u1ee7a app. Do m\u00f4 h\u00ecnh ph\u00e1t tri\u1ec3n d\u1ef1a tr\u00ean vi\u1ec7c gh\u00e9p nhi\u1ec1u app nh\u1ecf l\u1ea1i v\u1edbi nhau n\u00ean n\u1ebfu b\u1ea3n th\u00e2n app l\u1edbn s\u1ebd l\u00e0m cho bundle l\u1edbn, t\u1eeb \u0111\u00f3 l\u00e0m gi\u1ea3m t\u1ed1c \u0111\u1ed9 t\u1ea3i trang c\u1ee7a kh\u00e1ch h\u00e0ng.<\/p>\n<p><a href=\"https:\/\/reactjs.org\/\" rel=\"nofollow noopener\" target=\"_blank\">React<\/a> v\u00e0 <a href=\"https:\/\/vuejs.org\/\" rel=\"nofollow noopener\" target=\"_blank\">Vue<\/a> c\u00f3 chung v\u1ea5n \u0111\u1ec1 l\u00e0 runtime code (code c\u1ee7a th\u01b0 vi\u1ec7n\/framework) b\u1eaft bu\u1ed9c ph\u1ea3i \u0111\u01b0\u1ee3c \u0111\u00ednh k\u00e8m v\u00e0o bundle. Vi\u1ec7c n\u00e0y l\u00e0m cho file size l\u1edbn h\u01a1n so v\u1edbi t\u00ednh n\u0103ng (n\u1ebfu t\u00ednh n\u0103ng \u00edt) v\u00e0 tr\u00f9ng l\u1eb7p code gi\u1eefa c\u00e1c app v\u1edbi nhau.<\/p>\n<p><a href=\"https:\/\/svelte.dev\/\" rel=\"nofollow noopener\" target=\"_blank\">Svelte<\/a> do \u0111\u01b0\u1ee3c x\u00e2y d\u1ef1ng d\u01b0\u1edbi d\u1ea1ng compiler n\u00ean s\u1ebd kh\u00f4ng xu\u1ea5t hi\u1ec7n runtime code trong bundle. B\u00ean c\u1ea1nh \u0111\u00f3, do s\u1eed d\u1ee5ng <a href=\"https:\/\/rollupjs.org\/guide\/en\/\" rel=\"nofollow noopener\" target=\"_blank\">Rollup<\/a>, Svelte t\u1eadn d\u1ee5ng \u0111\u01b0\u1ee3c t\u00ednh n\u0103ng <a href=\"https:\/\/rollupjs.org\/guide\/en\/#tree-shaking\" rel=\"nofollow noopener\" target=\"_blank\"><code>tree-shaking<\/code><\/a> gi\u00fap lo\u1ea1i b\u1ecf code d\u01b0 th\u1eeba. T\u00ednh n\u0103ng n\u00e0y \u0111\u1eb7c bi\u1ec7t ph\u00f9 h\u1ee3p n\u1ebfu app c\u00f3 nhi\u1ec1u phi\u00ean b\u1ea3n kh\u00e1c nhau. B\u1ea1n c\u00f3 th\u1ec3 t\u1eadn d\u1ee5ng <a href=\"https:\/\/en.wikipedia.org\/wiki\/Environment_variable\" rel=\"nofollow noopener\" target=\"_blank\">environment variable<\/a> (bi\u1ebfn m\u00f4i tr\u01b0\u1eddng) \u0111\u1ec3 lo\u1ea1i b\u1ecf code d\u01b0 th\u1eeba gi\u1eefa c\u00e1c phi\u00ean b\u1ea3n khi build. V\u00ed d\u1ee5: phi\u00ean b\u1ea3n <em>trial<\/em> s\u1ebd kh\u00f4ng c\u00f3 code c\u1ee7a phi\u00ean b\u1ea3n <em>pro<\/em> v\u00e0 ng\u01b0\u1ee3c l\u1ea1i.<\/p>\n<p>M\u1ed9t \u0111i\u1ec3m l\u1ee3i th\u1ebf n\u1eefa c\u1ee7a Svelte l\u00e0 option cho ph\u00e9p include CSS v\u00e0o trong file JS. \u0110i\u1ec1u n\u00e0y gi\u00fap cho vi\u1ec7c gh\u00e9p app tr\u1edf n\u00ean d\u1ec5 d\u00e0ng h\u01a1n do b\u00e2y gi\u1edd m\u1ecdi th\u1ee9 ch\u1ec9 n\u1eb1m trong 1 file duy nh\u1ea5t. React v\u00e0 Vue m\u00ecnh tin l\u00e0 v\u1eabn l\u00e0m \u0111\u01b0\u1ee3c \u0111i\u1ec1u n\u00e0y nh\u01b0ng s\u1ebd ph\u1ea3i setup nhi\u1ec1u h\u01a1n so v\u1edbi Svelte.<\/p>\n<p><strong>\u274c Nh\u01b0\u1ee3c \u0111i\u1ec3m<\/strong><\/p>\n<p>M\u1ed9t \u0111i\u1ec3m m\u00ecnh ch\u01b0a h\u00e0i l\u00f2ng v\u1edbi compiler c\u1ee7a Svelte l\u00e0 CSS <code>class<\/code> \u0111\u1eb7t trong component v\u1eabn b\u1ecb gi\u1eef l\u1ea1i sau khi compile thay v\u00ec \u0111\u01b0\u1ee3c x\u00f3a \u0111i ho\u1eb7c \u0111\u1ed5i t\u00ean th\u00e0nh d\u1ea1ng <code>class_&lt;hash&gt;<\/code>. V\u00ed d\u1ee5 <code>card<\/code> s\u1ebd \u0111\u01b0\u1ee3c \u0111\u1ed5i th\u00e0nh <code>card svelte_abc123<\/code> khi compile. \u0110i\u1ec1u n\u00e0y \u0111\u00f4i khi \u1ea3nh h\u01b0\u1edfng t\u1edbi UI khi app ch\u1ea1y tr\u00ean website c\u1ee7a kh\u00e1ch h\u00e0ng.<\/p>\n<p>Tuy ch\u01b0a test k\u1ef9 nh\u01b0ng m\u1ed9t s\u1ed1 code \u0111\u01b0\u1ee3c compiled b\u1edfi Svelte s\u1ebd kh\u00f4ng ch\u1ea1y tr\u00ean c\u00e1c tr\u00ecnh duy\u1ec7t &quot;h\u01a1i&quot; c\u0169 nh\u01b0 IE11 ho\u1eb7c Safari. \u0110\u00e2y c\u0169ng c\u00f3 th\u1ec3 l\u00e0 m\u1ed9t trong nh\u1eefng v\u1ea5n \u0111\u1ec1 c\u00e1c b\u1ea1n c\u1ea7n c\u00e2n nh\u1eafc n\u1ebfu c\u00f3 \u00fd \u0111\u1ecbnh s\u1eed d\u1ee5ng Svelte.<\/p>\n<h3>2. Performance<\/h3>\n<p align=\"center\">\n<img decoding=\"async\" src=\"https:\/\/media.giphy.com\/media\/3oriNYQX2lC6dfW2Ji\/giphy.gif\" alt=\"Package flexing gif\">\n<\/p>\n<p><strong>\u2705 \u01afu \u0111i\u1ec3m<\/strong><\/p>\n<p>Bundle size nh\u1ecf gi\u00fap t\u0103ng t\u1ed1c \u0111\u1ed9 t\u1ea3i trang nh\u01b0ng kh\u00f4ng v\u00ec v\u1eady m\u00e0 ch\u00fang ta b\u1ecf qua t\u1ed1c \u0111\u1ed9 c\u1ee7a app. Nh\u1edd vi\u1ec7c lo\u1ea1i b\u1ecf virtual dom, Svelte c\u00f3 \u0111\u01b0\u1ee3c performance kh\u00e1 \u1ea5n t\u01b0\u1ee3ng so v\u1edbi c\u00e1c th\u01b0 vi\u1ec7n\/framework l\u00fac b\u1ea5y gi\u1edd.<\/p>\n<p>Svelte chi\u1ebfn th\u1eafng \u1edf m\u1ea3ng n\u00e0y, kh\u00f4ng c\u00f2n g\u00ec b\u00e0n c\u00e3i.<\/p>\n<p><strong>\u274c Nh\u01b0\u1ee3c \u0111i\u1ec3m<\/strong><\/p>\n<p>Ch\u01b0a c\u00f3 ho\u1eb7c ch\u01b0a nh\u1eadn ra do app ch\u01b0a \u0111\u1ee7 l\u1edbn ????<\/p>\n<h3>3. Developer Experience<\/h3>\n<p align=\"center\">\n<img decoding=\"async\" src=\"https:\/\/media.giphy.com\/media\/XIqCQx02E1U9W\/giphy.gif\" alt=\"Package flexing gif\">\n<\/p>\n<p><strong>\u2705 \u01afu \u0111i\u1ec3m<\/strong><\/p>\n<p><em>Developer Experience (DX)<\/em> khi s\u1eed d\u1ee5ng Svelte kh\u00e1 th\u00edch. Ngo\u00e0i vi\u1ec7c h\u1ed7 tr\u1ee3 2-way-binding gi\u1ed1ng Vue th\u00ec Svelte c\u00f2n c\u00f3 nhi\u1ec1u syntax h\u1eefu d\u1ee5ng nh\u01b0 <code>{#await}<\/code> block, <code>&lt;slot&gt;<\/code>, group binding (khi l\u00e0m vi\u1ec7c v\u1edbi form inputs) hay c\u00e1c animation th\u00f4ng d\u1ee5ng nh\u01b0 <code>fade<\/code>, <code>flip<\/code>, &#8230; T\u1ea5t c\u1ea3 \u0111i\u1ec1u tr\u00ean gi\u00fap vi\u1ec7c ph\u00e1t tri\u1ec3n UI tr\u1edf n\u00ean \u0111\u01a1n gi\u1ea3n h\u01a1n r\u1ea5t nhi\u1ec1u v\u00e0 t\u1ed1c \u0111\u1ed9 release s\u1ea3n ph\u1ea9m t\u0103ng \u0111\u00e1ng k\u1ec3.<\/p>\n<p>T\u00e0i li\u1ec7u c\u1ee7a Svelte theo m\u00ecnh \u0111\u00e1nh gi\u00e1 l\u00e0 \u1ed5n. V\u00ed d\u1ee5 tr\u1ef1c quan d\u01b0\u1edbi d\u1ea1ng b\u00e0i t\u1eadp, r\u1ea5t d\u1ec5 ti\u1ebfp thu. B\u1ea1n ho\u00e0n to\u00e0n c\u00f3 th\u1ec3 h\u1ecdc Svelte trong v\u00f2ng n\u1eeda bu\u1ed5i (4 ti\u1ebfng) n\u1ebfu b\u1ea1n \u0111\u00e3 quen v\u1edbi HTML, CSS v\u00e0 JS.<\/p>\n<p><strong>\u274c Nh\u01b0\u1ee3c \u0111i\u1ec3m<\/strong><\/p>\n<p>Template m\u1eb7c \u0111\u1ecbnh c\u1ee7a Svelte v\u1eabn ch\u01b0a h\u1ed7 tr\u1ee3 <em>Fast Refresh<\/em> (m\u1ed9t d\u1ea1ng auto refresh nh\u01b0ng gi\u1eef l\u1ea1i tr\u1ea1ng th\u00e1i (state) khi refresh) n\u00ean khi style Modal ho\u1eb7c Toast (c\u00e1c d\u1ea1ng feedback UI cho ng\u01b0\u1eddi d\u00f9ng) \u0111\u1ec1u ph\u1ea3i t\u1ef1 tay click l\u1ea1i \u0111\u1ec3 trigger UI component. Th\u1eadt s\u1ef1 h\u01a1i phi\u1ec1n n\u1ebfu c\u00e1c b\u1ea1n ph\u1ea3i \u0111i\u1ec1u ch\u1ec9nh nhi\u1ec1u.<\/p>\n<p>Vi\u1ec7c re-render ch\u1ec9 di\u1ec5n ra khi c\u00f3 &quot;assignment&quot; c\u0169ng g\u00e2y kh\u00f3 kh\u0103n trong vi\u1ec7c debug n\u1ebfu b\u1ea1n kh\u00f4ng c\u1ea9n th\u1eadn. \u0110\u01a1n c\u1eed nh\u01b0:<\/p>\n<pre><code class=\"language-js\">\/\/ kh\u00f4ng trigger re-render\narr.push({ id: 1 })\n\n\/\/ s\u1ebd trigger re-render\narr = arr.concat({ id: 1 })<\/code><\/pre>\n<p>Ngo\u00e0i ra, do c\u0169ng ch\u1ec9 m\u1edbi xu\u1ea5t hi\u1ec7n n\u00ean Svelte v\u1eabn ch\u01b0a c\u00f3 nhi\u1ec1u th\u01b0 vi\u1ec7n\/framework c\u0169ng nh\u01b0 tool h\u1ed7 tr\u1ee3 qu\u00e1 tr\u00ecnh ph\u00e1t tri\u1ec3n. T\u1ea1i th\u1eddi \u0111i\u1ec3m ra m\u1eaft Svelte 3, VSCode extension c\u1ee7a Svelte t\u1ea1m ng\u01b0ng ho\u1ea1t \u0111\u1ed9ng khi\u1ebfn cho syntax highlight c\u0169ng nh\u01b0 formatting g\u1ea7n nh\u01b0 bi\u1ebfn m\u1ea5t. Th\u1eadm ch\u00ed m\u1ed9t s\u1ed1 m\u00e1y macOS kh\u00f4ng s\u1eed d\u1ee5ng \u0111\u01b0\u1ee3c t\u00ednh n\u0103ng format c\u1ee7a Svelte khi\u1ebfn cho vi\u1ec7c review code r\u1ea5t kh\u00f3 kh\u0103n.<\/p>\n<h2>EGANY \u2665 Svelte<\/h2>\n<p align=\"center\">\n<img decoding=\"async\" src=\"https:\/\/egany.cdn.vccloud.vn\/blogs\/wp-content\/uploads\/2021\/02\/svelte-thumb.jpg\" alt=\"Package flexing gif\">\n<\/p>\n<p>Svelte l\u00e0 m\u1ed9t c\u00f4ng ngh\u1ec7 tr\u1ebb, ch\u01b0a c\u00f3 nhi\u1ec1u sponsors. Vi\u1ec7c l\u1ef1a ch\u1ecdn Svelte \u0111\u1ec3 ph\u00e1t tri\u1ec3n app t\u1ea1i th\u1eddi \u0111i\u1ec3m m\u1edbi ra m\u1eaft version 3 qu\u1ea3 th\u1eadt m\u00e0 n\u00f3i l\u00e0 m\u1ed9t quy\u1ebft \u0111\u1ecbnh li\u1ec1u l\u0129nh. R\u1ea5t may m\u1eafn l\u00e0 Svelte \u0111ang \u0111\u00f3n nh\u1eadn \u0111\u01b0\u1ee3c nhi\u1ec1u s\u1ef1 ch\u00fa \u00fd h\u01a1n t\u1eeb c\u1ed9ng \u0111\u1ed3ng. Vi\u1ec7c h\u1ed7 tr\u1ee3 TypeScript v\u00e0 s\u1ef1 ra \u0111\u1eddi c\u1ee7a <a href=\"https:\/\/svelte.dev\/blog\/sveltekit-beta\/\" rel=\"nofollow noopener\" target=\"_blank\">SvelteKit (Beta)<\/a> l\u00e0 nh\u1eefng t\u00edn hi\u1ec7u \u0111\u00e1ng m\u1eebng cho Svelte.<\/p>\n<p>C\u00e1m \u01a1n c\u00e1c b\u1ea1n \u0111\u00e3 \u0111\u1ecdc b\u00e0i vi\u1ebft c\u1ee7a m\u00ecnh. C\u00e1c b\u1ea1n c\u00f3 \u0111ang s\u1eed d\u1ee5ng Svelte trong d\u1ef1 \u00e1n c\u1ee7a m\u00ecnh kh\u00f4ng? Comment tr\u1ea3i nghi\u1ec7m c\u1ee7a c\u00e1c b\u1ea1n cho m\u00ecnh bi\u1ebft nh\u00e9! Happy Hacking!<\/p>\n<blockquote>\n<p>P.s: C\u00e1c b\u1ea1n c\u00f3 th\u1ec3 xem th\u00eam b\u00e0i tr\u01b0\u1edbc n\u00f3i v\u1ec1 <a href=\"https:\/\/egany.com\/blogs\/egany-front-end-tech-stack\/\">Front-end Tech Stack<\/a> c\u1ee7a EGANY \u0111\u1ec3 bi\u1ebft th\u00eam c\u00e1c c\u00f4ng ngh\u1ec7 m\u00e0 team Front-end \u0111ang d\u00f9ng nh\u00e9.<\/p>\n<\/blockquote>\n","protected":false},"excerpt":{"rendered":"<p>Svelte l\u00e0 m\u1ed9t v\u00e1n c\u01b0\u1ee3c l\u1edbn t\u1ea1i EGANY v\u00e0 \u0111\u00fang nh\u01b0 idol Hu\u1ea5n Hoa H\u1ed3ng \u0111\u00e3 n\u00f3i: C\u1edd b\u1ea1c ng\u01b0\u1eddi kh\u00f4ng ch\u01a1i m\u1edbi l\u00e0 ng\u01b0\u1eddi th\u1eafng. Ng\u01b0\u1eddi ch\u01a1i kh\u00f4ng bao gi\u1edd th\u1eafng \u2728 V\u1ea5n \u0111\u1ec1 V\u00e0o m\u1ed9t ng\u00e0y \u0111\u1eb9p tr\u1eddi, nh\u1eadn ra nh\u1eefng s\u1ea3n ph\u1ea9m hi\u1ec7n t\u1ea1i c\u1ee7a EGANY ph\u1ee5 thu\u1ed9c qu\u00e1 nhi\u1ec1u v\u00e0o n\u1ec1n t\u1ea3ng c\u1ee7a \u0111\u1ed1i t\u00e1c, s\u1ebfp quy\u1ebft \u0111\u1ecbnh t\u1ea1o ra m\u1ed9t n\u1ec1n t\u1ea3ng mini v\u1edbi t\u00ean g\u1ecdi Cross-platform Apps (CPA). C\u00e1c app c\u1ee7a CPA d\u1ef1 \u0111\u1ecbnh s\u1ebd t\u01b0\u01a1ng \u0111\u1ed1i nh\u1ecf, ch\u1ee7 y\u1ebfu l\u00e0 d\u1ea1ng addon\/plugins \u0111\u01b0\u1ee3c s\u1eed d\u1ee5ng \u0111\u1ec3 th\u00eam t\u00ednh n\u0103ng. \u0110\u01a1n c\u1eed nh\u1ea5t l\u00e0<\/p>\n","protected":false},"author":2,"featured_media":563,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[27],"tags":[60,34,59,37],"_links":{"self":[{"href":"https:\/\/egany.com\/blogs\/wp-json\/wp\/v2\/posts\/534"}],"collection":[{"href":"https:\/\/egany.com\/blogs\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/egany.com\/blogs\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/egany.com\/blogs\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/egany.com\/blogs\/wp-json\/wp\/v2\/comments?post=534"}],"version-history":[{"count":0,"href":"https:\/\/egany.com\/blogs\/wp-json\/wp\/v2\/posts\/534\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/egany.com\/blogs\/wp-json\/wp\/v2\/media\/563"}],"wp:attachment":[{"href":"https:\/\/egany.com\/blogs\/wp-json\/wp\/v2\/media?parent=534"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/egany.com\/blogs\/wp-json\/wp\/v2\/categories?post=534"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/egany.com\/blogs\/wp-json\/wp\/v2\/tags?post=534"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}