[{"data":1,"prerenderedAt":20},["ShallowReactive",2],{"$f553Uuxikds5IHszVW4cHK4Vk65BuIFy0K34snUehw3A":3},{"issue":4},{"analytics":5,"html":10,"issueId":11,"issueNumber":12,"ogImage":13,"publishedAt":16,"title":17,"url":18,"version":19},{"clickRate":6,"clicks":6,"openRate":7,"sent":8,"views":9},0,41,900,372,"\u003C!doctype html>\n\u003Chtml xmlns=\"http://www.w3.org/1999/xhtml\" xmlns:v=\"urn:schemas-microsoft-com:vml\" xmlns:o=\"urn:schemas-microsoft-com:office:office\">\n  \u003Chead>\n    \u003Ctitle>\n      \n    \u003C/title>\n    \u003C!--[if !mso]>\u003C!-->\n    \u003Cmeta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n    \u003C!--\u003C![endif]-->\n    \u003Cmeta http-equiv=\"Content-Type\" content=\"text/html; charset=UTF-8\">\n    \u003Cmeta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\n    \u003Cstyle type=\"text/css\">\n      #outlook a { padding:0; }\n      body { margin:0;padding:0;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%; }\n      table, td { border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt; }\n      img { border:0;height:auto;line-height:100%; outline:none;text-decoration:none;-ms-interpolation-mode:bicubic; }\n      p { display:block;margin:13px 0; }\n    \u003C/style>\n    \u003C!--[if mso]>\n    \u003Cnoscript>\n    \u003Cxml>\n    \u003Co:OfficeDocumentSettings>\n      \u003Co:AllowPNG/>\n      \u003Co:PixelsPerInch>96\u003C/o:PixelsPerInch>\n    \u003C/o:OfficeDocumentSettings>\n    \u003C/xml>\n    \u003C/noscript>\n    \u003C![endif]-->\n    \u003C!--[if lte mso 11]>\n    \u003Cstyle type=\"text/css\">\n      .mj-outlook-group-fix { width:100% !important; }\n    \u003C/style>\n    \u003C![endif]-->\n    \n      \u003C!--[if !mso]>\u003C!-->\n        \u003Clink href=\"https://fonts.googleapis.com/css2?family=Noto+Sans:wght@400;700&display=swap\" rel=\"stylesheet\" type=\"text/css\">\n        \u003Cstyle type=\"text/css\">\n          @import url(https://fonts.googleapis.com/css2?family=Noto+Sans:wght@400;700&display=swap);\n        \u003C/style>\n      \u003C!--\u003C![endif]-->\n\n    \n    \n    \u003Cstyle type=\"text/css\">\n      @media only screen and (min-width:480px) {\n        .mj-column-per-100 { width:100% !important; max-width: 100%; }\n.mj-column-px-200 { width:200px !important; max-width: 200px; }\n.mj-column-per-15 { width:15% !important; max-width: 15%; }\n.mj-column-per-85 { width:85% !important; max-width: 85%; }\n.mj-column-per-50 { width:50% !important; max-width: 50%; }\n.mj-column-per-20 { width:20% !important; max-width: 20%; }\n.mj-column-per-80 { width:80% !important; max-width: 80%; }\n      }\n    \u003C/style>\n    \u003Cstyle media=\"screen and (min-width:480px)\">\n      .moz-text-html .mj-column-per-100 { width:100% !important; max-width: 100%; }\n.moz-text-html .mj-column-px-200 { width:200px !important; max-width: 200px; }\n.moz-text-html .mj-column-per-15 { width:15% !important; max-width: 15%; }\n.moz-text-html .mj-column-per-85 { width:85% !important; max-width: 85%; }\n.moz-text-html .mj-column-per-50 { width:50% !important; max-width: 50%; }\n.moz-text-html .mj-column-per-20 { width:20% !important; max-width: 20%; }\n.moz-text-html .mj-column-per-80 { width:80% !important; max-width: 80%; }\n    \u003C/style>\n    \n  \n    \u003Cstyle type=\"text/css\">\n    \n    \n\n    @media only screen and (max-width:480px) {\n      table.mj-full-width-mobile { width: 100% !important; }\n      td.mj-full-width-mobile { width: auto !important; }\n    }\n  \n    \u003C/style>\n    \u003Cstyle type=\"text/css\">\n    \n    \u003C/style>\n    \n  \u003C/head>\n  \u003Cbody style=\"word-spacing:normal;background-color:#FFFFFF;\">\n    \n    \n      \u003Cdiv style=\"background-color:#FFFFFF;\">\n        \n      \n      \u003C!--[if mso | IE]>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n                  \n      \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">FOLLOW_UP_PLACEHOLDER\u003C/div>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"center\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n                  \n      \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:12px;font-weight:300;line-height:24px;text-align:center;color:#616161;\">\u003Cspan style=\"color:#bdbdbd;line-height:9px;\" data-v-inspector=\"components/content/EmailHeader.vue:11:9\">\u003Ca href=\"https://weekly-vue.news/issues/81\" target=\"_blank\" style=\"text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px; color: black;\" data-v-inspector=\"components/content/EmailHeader.vue:12:11\">View and discuss online\u003C/a>, \u003C/span>\u003C/div>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:200px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-px-200 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"center\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n                  \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"border-collapse:collapse;border-spacing:0px;\">\n        \u003Ctbody>\n          \u003Ctr>\n            \u003Ctd style=\"width:150px;\">\n              \n        \u003Ca href=\"https://weekly-vue.news?ref=newsletter\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">\n          \n      \u003Cimg height=\"auto\" src=\"https://mokkapps.twic.pics/weekly-vue.news/logo-with-text.png?twic=v1/cover=200\" style=\"border:0;display:block;outline:none;text-decoration:none;height:auto;width:100%;font-size:13px;\" width=\"150\">\n    \n        \u003C/a>\n      \n            \u003C/td>\n          \u003C/tr>\n        \u003C/tbody>\n      \u003C/table>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"\" >\u003C![endif]-->\n            \n      \u003Cdiv style=\"height:25px;line-height:25px;\"> \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;padding-top:0px;padding-bottom:0px;word-break:break-word;\">\n                  \n      \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:18px;font-weight:700;line-height:24px;text-align:left;color:#616161;\">Weekly Vue News #81\u003C/div>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n              \u003Ctr>\n                \u003Ctd align=\"left\" style=\"font-size:0px;padding:5px 25px;word-break:break-word;\">\n                  \n      \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:22px;font-weight:700;line-height:24px;text-align:left;color:#616161;\">\u003Cp data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseP.vue:2:3\">Re-Rendering Vue Routes When Path Parameters Change\u003C/p>\u003C/div>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"center\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n                  \n      \u003Cp style=\"border-top:solid 1px #E0E0E0;font-size:1px;margin:0px auto;width:100%;\">\n      \u003C/p>\n      \n      \u003C!--[if mso | IE]>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" style=\"border-top:solid 1px #E0E0E0;font-size:1px;margin:0px auto;width:550px;\" role=\"presentation\" width=\"550px\" >\u003Ctr>\u003Ctd style=\"height:0;line-height:0;\">  \n\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n    \n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n                  \n      \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Cp data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseP.vue:2:3\">Hi 👋\u003C/p>\u003Cp data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseP.vue:2:3\">I had to switch from \u003Cmj-text rel=\"nofollow\">\u003Ca href=\"https://cloudinary.com/\" target=\"_blank\" data-v-inspector=\"components/content/ProseA.vue:7:6\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">Cloudinary\u003C/a>\u003C/mj-text> to \u003Cmj-text rel=\"nofollow\">\u003Ca href=\"https://www.twicpics.com/\" target=\"_blank\" data-v-inspector=\"components/content/ProseA.vue:7:6\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">TwicPics\u003C/a>\u003C/mj-text> as I reached the free limit of Cloudinary.\u003C/p>\u003Cp data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseP.vue:2:3\">The paid plan for Cloudinary would be 99€/month 🤯 Therefore, I moved all images to an AWS S3 bucket and let them process them via \u003Cmj-text rel=\"nofollow\">\u003Ca href=\"https://www.twicpics.com/\" target=\"_blank\" data-v-inspector=\"components/content/ProseA.vue:7:6\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">TwicPics\u003C/a>\u003C/mj-text>. It costs me only 20€/month for 40GB of CDN bandwidth!\u003C/p>\u003Cp data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseP.vue:2:3\">I'm busy producing Vue & Nuxt tips for upcoming newsletter issues.\u003C/p>\u003Cp data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseP.vue:2:3\">Unfortunately, I also have a full backlog of blog post articles I would like to write...\u003C/p>\u003Cp data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseP.vue:2:3\">Too many ideas, too little time 😥\u003C/p>\u003Cp data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseP.vue:2:3\">Have a lovely week ☀️\u003C/p>\u003Chr data-v-inspector=\"components/content/EmailSupportMe.vue:4:3\">\u003Cp data-v-inspector=\"components/content/EmailSupportMe.vue:5:3\">To support me:\u003C/p>\u003Cul data-v-inspector=\"components/content/EmailSupportMe.vue:6:3\">\u003Cli data-v-inspector=\"components/content/EmailSupportMe.vue:7:5\">😘 \u003Cstrong data-v-inspector=\"components/content/EmailSupportMe.vue:7:12\">Recommend the newsletter to your friends\u003C/strong>: it really helps!\u003C/li>\u003Cli data-v-inspector=\"components/content/EmailSupportMe.vue:9:5\">🧵 \u003Ca href=\"https://twitter.com/weekly_vue_news\" target=\"_blank\" data-v-inspector=\"components/content/EmailSupportMe.vue:9:12\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">Retweet the latest Twitter thread\u003C/a>\u003C/li>\u003Cli data-v-inspector=\"components/content/EmailSupportMe.vue:10:5\">📨 Reply to this \u003Ca href=\"mailto:info@weekly-vue.news\" target=\"_blank\" data-v-inspector=\"components/content/EmailSupportMe.vue:10:26\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">email\u003C/a>: feedback is welcome\u003C/li>\u003C/ul>\u003C/div>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"left\" style=\"font-size:0px;padding:20px 25px;word-break:break-word;\">\n                  \n      \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:22px;font-weight:700;line-height:24px;text-align:left;color:#3fb983;\">Vue Tip: Re-Rendering Vue Routes When Path Parameters Change\u003C/div>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n                  \n      \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Cp data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseP.vue:2:3\">In Vue applications, we use \u003Cmj-text rel=\"nofollow\">\u003Ca href=\"https://router.vuejs.org/\" target=\"_blank\" data-v-inspector=\"components/content/ProseA.vue:7:6\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">Vue Router\u003C/a>\u003C/mj-text> to define routes and map URLs to components. These components are rendered and updated whenever the URL changes.\u003C/p>\u003Cp data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseP.vue:2:3\">A typical use case is a dynamic route pattern with params: \u003Ccode style=\"background-color:#f1f1f1;color:#466581;padding:0.25rem 0.5rem;margin:0;font-size:0.85em;border-radius:3px;\" data-v-inspector=\"components/content/ProseCodeInline.vue:2:3\">/users/:id\u003C/code>. It allows you to specify a parameter in the URL. The \u003Ccode style=\"background-color:#f1f1f1;color:#466581;padding:0.25rem 0.5rem;margin:0;font-size:0.85em;border-radius:3px;\" data-v-inspector=\"components/content/ProseCodeInline.vue:2:3\">:id\u003C/code> in this route pattern is a placeholder for a dynamic value, which can change based on the user's actions. Typically you will trigger a backend endpoint with the given \u003Ccode style=\"background-color:#f1f1f1;color:#466581;padding:0.25rem 0.5rem;margin:0;font-size:0.85em;border-radius:3px;\" data-v-inspector=\"components/content/ProseCodeInline.vue:2:3\">id\u003C/code> to fetch user details.\u003C/p>\u003Cp data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseP.vue:2:3\">Let's take a look at an example:\u003C/p>\u003C/div>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"\" >\u003C![endif]-->\n            \n      \u003Cdiv style=\"height:10px;line-height:10px;\"> \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" bgcolor=\"#007BFF19\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"background:#007BFF19;background-color:#007BFF19;margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"background:#007BFF19;background-color:#007BFF19;width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n                  \n      \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#007bff;\">\u003Cp data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseP.vue:2:3\">The demo code of this article is interactively available in the following StackBlitz project:\u003C/p>\u003Cmj-section>\u003Cmj-column>\u003Cmj-text color=\"#3fb983\" font-weight=\"700\">\u003Ca href=\"https://stackblitz.com/edit/re-rendering-vue-routes-when-path-parameters-change\" target=\"_blank\" data-v-inspector=\"components/content/EmailStackBlitz.vue:13:9\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">⚡ Open Demo\u003C/a>\u003C/mj-text>\u003C/mj-column>\u003C/mj-section>\u003C/div>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"\" >\u003C![endif]-->\n            \n      \u003Cdiv style=\"height:20px;line-height:20px;\"> \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n                  \n      \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Cdiv class=\"code\" data-v-inspector=\"components/content/ProseCode.vue:39:9\">\u003Cpre tabindex=\"1\" class=\"shiki \" style=\"background-color: #1E1E1E\">\u003Ccode class=\"undefined\" style=\"undefined\">\u003Cdiv style=\"padding: 10px\">\u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" bgcolor=\"#1e1e1e\" style=\"border-collapse:separate; border-spacing: 0 0.2em;\">\u003Ctbody>\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #808080\"><\u003C/span>\u003Cspan style=\"color: #569CD6\">script\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #9CDCFE\">setup\u003C/span>\u003Cspan style=\"color: #808080\">>\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #C586C0\">import\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> { \u003C/span>\u003Cspan style=\"color: #9CDCFE\">ref\u003C/span>\u003Cspan style=\"color: #D4D4D4\">, \u003C/span>\u003Cspan style=\"color: #9CDCFE\">onMounted\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> } \u003C/span>\u003Cspan style=\"color: #C586C0\">from\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #CE9178\">'vue'\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #C586C0\">import\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> { \u003C/span>\u003Cspan style=\"color: #9CDCFE\">useRoute\u003C/span>\u003Cspan style=\"color: #D4D4D4\">, \u003C/span>\u003Cspan style=\"color: #9CDCFE\">useRouter\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> } \u003C/span>\u003Cspan style=\"color: #C586C0\">from\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #CE9178\">'vue-router'\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #C586C0\">import\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #9CDCFE\">UserId\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #C586C0\">from\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #CE9178\">'@/components/UserId.vue'\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #C586C0\">import\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> { \u003C/span>\u003Cspan style=\"color: #9CDCFE\">getUserDetails\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> } \u003C/span>\u003Cspan style=\"color: #C586C0\">from\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #CE9178\">'../api/userApi.js'\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line highlighted-line\">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #569CD6\">const\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #4FC1FF\">route\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> = \u003C/span>\u003Cspan style=\"color: #DCDCAA\">useRoute\u003C/span>\u003Cspan style=\"color: #D4D4D4\">()\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line highlighted-line\">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #569CD6\">const\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #4FC1FF\">router\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> = \u003C/span>\u003Cspan style=\"color: #DCDCAA\">useRouter\u003C/span>\u003Cspan style=\"color: #D4D4D4\">()\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #569CD6\">const\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #4FC1FF\">loading\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> = \u003C/span>\u003Cspan style=\"color: #DCDCAA\">ref\u003C/span>\u003Cspan style=\"color: #D4D4D4\">(\u003C/span>\u003Cspan style=\"color: #569CD6\">false\u003C/span>\u003Cspan style=\"color: #D4D4D4\">)\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #569CD6\">const\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #4FC1FF\">details\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> = \u003C/span>\u003Cspan style=\"color: #DCDCAA\">ref\u003C/span>\u003Cspan style=\"color: #D4D4D4\">(\u003C/span>\u003Cspan style=\"color: #569CD6\">null\u003C/span>\u003Cspan style=\"color: #D4D4D4\">)\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #569CD6\">async\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #569CD6\">function\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #DCDCAA\">fetchDetails\u003C/span>\u003Cspan style=\"color: #D4D4D4\">(\u003C/span>\u003Cspan style=\"color: #9CDCFE\">id\u003C/span>\u003Cspan style=\"color: #D4D4D4\">) {\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\">  \u003C/span>\u003Cspan style=\"color: #9CDCFE\">loading\u003C/span>\u003Cspan style=\"color: #D4D4D4\">.\u003C/span>\u003Cspan style=\"color: #9CDCFE\">value\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> = \u003C/span>\u003Cspan style=\"color: #569CD6\">true\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\">  \u003C/span>\u003Cspan style=\"color: #C586C0\">try\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> {\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\">    \u003C/span>\u003Cspan style=\"color: #9CDCFE\">details\u003C/span>\u003Cspan style=\"color: #D4D4D4\">.\u003C/span>\u003Cspan style=\"color: #9CDCFE\">value\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> = \u003C/span>\u003Cspan style=\"color: #C586C0\">await\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #DCDCAA\">getUserDetails\u003C/span>\u003Cspan style=\"color: #D4D4D4\">(\u003C/span>\u003Cspan style=\"color: #9CDCFE\">id\u003C/span>\u003Cspan style=\"color: #D4D4D4\">)\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\">  } \u003C/span>\u003Cspan style=\"color: #C586C0\">catch\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> (\u003C/span>\u003Cspan style=\"color: #9CDCFE\">error\u003C/span>\u003Cspan style=\"color: #D4D4D4\">) {\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\">    \u003C/span>\u003Cspan style=\"color: #9CDCFE\">console\u003C/span>\u003Cspan style=\"color: #D4D4D4\">.\u003C/span>\u003Cspan style=\"color: #DCDCAA\">error\u003C/span>\u003Cspan style=\"color: #D4D4D4\">(\u003C/span>\u003Cspan style=\"color: #CE9178\">'Failed to fetch details'\u003C/span>\u003Cspan style=\"color: #D4D4D4\">, \u003C/span>\u003Cspan style=\"color: #9CDCFE\">error\u003C/span>\u003Cspan style=\"color: #D4D4D4\">)\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\">    \u003C/span>\u003Cspan style=\"color: #9CDCFE\">details\u003C/span>\u003Cspan style=\"color: #D4D4D4\">.\u003C/span>\u003Cspan style=\"color: #9CDCFE\">value\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> = \u003C/span>\u003Cspan style=\"color: #CE9178\">'Error'\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\">  } \u003C/span>\u003Cspan style=\"color: #C586C0\">finally\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> {\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\">    \u003C/span>\u003Cspan style=\"color: #9CDCFE\">loading\u003C/span>\u003Cspan style=\"color: #D4D4D4\">.\u003C/span>\u003Cspan style=\"color: #9CDCFE\">value\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> = \u003C/span>\u003Cspan style=\"color: #569CD6\">false\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\">  }\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\">}\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #569CD6\">function\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #DCDCAA\">navigateToNextUser\u003C/span>\u003Cspan style=\"color: #D4D4D4\">() {\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\">  \u003C/span>\u003Cspan style=\"color: #569CD6\">const\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #4FC1FF\">nextId\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> = \u003C/span>\u003Cspan style=\"color: #DCDCAA\">Number\u003C/span>\u003Cspan style=\"color: #D4D4D4\">(\u003C/span>\u003Cspan style=\"color: #9CDCFE\">route\u003C/span>\u003Cspan style=\"color: #D4D4D4\">.\u003C/span>\u003Cspan style=\"color: #9CDCFE\">params\u003C/span>\u003Cspan style=\"color: #D4D4D4\">.\u003C/span>\u003Cspan style=\"color: #9CDCFE\">id\u003C/span>\u003Cspan style=\"color: #D4D4D4\">) + \u003C/span>\u003Cspan style=\"color: #B5CEA8\">1\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line highlighted-line\">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\">  \u003C/span>\u003Cspan style=\"color: #9CDCFE\">router\u003C/span>\u003Cspan style=\"color: #D4D4D4\">.\u003C/span>\u003Cspan style=\"color: #DCDCAA\">push\u003C/span>\u003Cspan style=\"color: #D4D4D4\">({ \u003C/span>\u003Cspan style=\"color: #9CDCFE\">name:\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #CE9178\">'UserDetails'\u003C/span>\u003Cspan style=\"color: #D4D4D4\">, \u003C/span>\u003Cspan style=\"color: #9CDCFE\">params:\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> { \u003C/span>\u003Cspan style=\"color: #9CDCFE\">id:\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #9CDCFE\">nextId\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> } })\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\">}\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line highlighted-line\">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #DCDCAA\">onMounted\u003C/span>\u003Cspan style=\"color: #D4D4D4\">(\u003C/span>\u003Cspan style=\"color: #569CD6\">async\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> () \u003C/span>\u003Cspan style=\"color: #569CD6\">=>\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> {\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line highlighted-line\">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\">  \u003C/span>\u003Cspan style=\"color: #9CDCFE\">console\u003C/span>\u003Cspan style=\"color: #D4D4D4\">.\u003C/span>\u003Cspan style=\"color: #DCDCAA\">log\u003C/span>\u003Cspan style=\"color: #D4D4D4\">(\u003C/span>\u003Cspan style=\"color: #CE9178\">'UserDetails mounted'\u003C/span>\u003Cspan style=\"color: #D4D4D4\">)\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line highlighted-line\">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\">  \u003C/span>\u003Cspan style=\"color: #DCDCAA\">fetchDetails\u003C/span>\u003Cspan style=\"color: #D4D4D4\">(\u003C/span>\u003Cspan style=\"color: #9CDCFE\">route\u003C/span>\u003Cspan style=\"color: #D4D4D4\">.\u003C/span>\u003Cspan style=\"color: #9CDCFE\">params\u003C/span>\u003Cspan style=\"color: #D4D4D4\">.\u003C/span>\u003Cspan style=\"color: #9CDCFE\">id\u003C/span>\u003Cspan style=\"color: #D4D4D4\">)\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line highlighted-line\">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\">})\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #808080\"></\u003C/span>\u003Cspan style=\"color: #569CD6\">script\u003C/span>\u003Cspan style=\"color: #808080\">>\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #808080\"><\u003C/span>\u003Cspan style=\"color: #569CD6\">template\u003C/span>\u003Cspan style=\"color: #808080\">>\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\">  \u003C/span>\u003Cspan style=\"color: #808080\"><\u003C/span>\u003Cspan style=\"color: #569CD6\">h2\u003C/span>\u003Cspan style=\"color: #808080\">>\u003C/span>\u003Cspan style=\"color: #D4D4D4\">User Details\u003C/span>\u003Cspan style=\"color: #808080\"></\u003C/span>\u003Cspan style=\"color: #569CD6\">h2\u003C/span>\u003Cspan style=\"color: #808080\">>\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\">  \u003C/span>\u003Cspan style=\"color: #808080\"><\u003C/span>\u003Cspan style=\"color: #569CD6\">div\u003C/span>\u003Cspan style=\"color: #808080\">>\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\">    \u003C/span>\u003Cspan style=\"color: #808080\"><\u003C/span>\u003Cspan style=\"color: #569CD6\">span\u003C/span>\u003Cspan style=\"color: #808080\">>\u003C/span>\u003Cspan style=\"color: #D4D4D4\">ID: {{ route.params.id }}\u003C/span>\u003Cspan style=\"color: #808080\"></\u003C/span>\u003Cspan style=\"color: #569CD6\">span\u003C/span>\u003Cspan style=\"color: #808080\">>\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\">    \u003C/span>\u003Cspan style=\"color: #808080\"><\u003C/span>\u003Cspan style=\"color: #569CD6\">span\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #9CDCFE\">v-if\u003C/span>\u003Cspan style=\"color: #D4D4D4\">=\u003C/span>\u003Cspan style=\"color: #CE9178\">\"loading\"\u003C/span>\u003Cspan style=\"color: #808080\">>\u003C/span>\u003Cspan style=\"color: #D4D4D4\">Loading details ...\u003C/span>\u003Cspan style=\"color: #808080\"></\u003C/span>\u003Cspan style=\"color: #569CD6\">span\u003C/span>\u003Cspan style=\"color: #808080\">>\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\">    \u003C/span>\u003Cspan style=\"color: #808080\"><\u003C/span>\u003Cspan style=\"color: #569CD6\">span\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #9CDCFE\">v-else\u003C/span>\u003Cspan style=\"color: #808080\">>\u003C/span>\u003Cspan style=\"color: #D4D4D4\">Details: {{ details }}\u003C/span>\u003Cspan style=\"color: #808080\"></\u003C/span>\u003Cspan style=\"color: #569CD6\">span\u003C/span>\u003Cspan style=\"color: #808080\">>\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line highlighted-line\">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\">    \u003C/span>\u003Cspan style=\"color: #808080\"><\u003C/span>\u003Cspan style=\"color: #569CD6\">button\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #9CDCFE\">@click\u003C/span>\u003Cspan style=\"color: #D4D4D4\">=\u003C/span>\u003Cspan style=\"color: #CE9178\">\"navigateToNextUser\"\u003C/span>\u003Cspan style=\"color: #808080\">>\u003C/span>\u003Cspan style=\"color: #D4D4D4\">Next User\u003C/span>\u003Cspan style=\"color: #808080\"></\u003C/span>\u003Cspan style=\"color: #569CD6\">button\u003C/span>\u003Cspan style=\"color: #808080\">>\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\">  \u003C/span>\u003Cspan style=\"color: #808080\"></\u003C/span>\u003Cspan style=\"color: #569CD6\">div\u003C/span>\u003Cspan style=\"color: #808080\">>\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #808080\"></\u003C/span>\u003Cspan style=\"color: #569CD6\">template\u003C/span>\u003Cspan style=\"color: #808080\">>\u003C/span>\u003C/td>\n    \u003C/tr>\u003C/tbody>\u003C/table>\u003C/div>\u003C/code>\u003C/pre>\u003C/div>\u003C/div>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n                  \n      \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Cp data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseP.vue:2:3\">This component uses the \u003Ccode style=\"background-color:#f1f1f1;color:#466581;padding:0.25rem 0.5rem;margin:0;font-size:0.85em;border-radius:3px;\" data-v-inspector=\"components/content/ProseCodeInline.vue:2:3\">onMounted\u003C/code> lifecycle hook to fetch user details when the component is mounted. The user's ID is read via \u003Ccode style=\"background-color:#f1f1f1;color:#466581;padding:0.25rem 0.5rem;margin:0;font-size:0.85em;border-radius:3px;\" data-v-inspector=\"components/content/ProseCodeInline.vue:2:3\">route.params.id\u003C/code> from the \u003Ccode style=\"background-color:#f1f1f1;color:#466581;padding:0.25rem 0.5rem;margin:0;font-size:0.85em;border-radius:3px;\" data-v-inspector=\"components/content/ProseCodeInline.vue:2:3\">useRoute\u003C/code> composable.\u003C/p>\u003Cp data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseP.vue:2:3\">So far, everything works fine and the user details are visible and they get updated if we update the route path manually by changing \u003Ccode style=\"background-color:#f1f1f1;color:#466581;padding:0.25rem 0.5rem;margin:0;font-size:0.85em;border-radius:3px;\" data-v-inspector=\"components/content/ProseCodeInline.vue:2:3\">/users/1\u003C/code> to \u003Ccode style=\"background-color:#f1f1f1;color:#466581;padding:0.25rem 0.5rem;margin:0;font-size:0.85em;border-radius:3px;\" data-v-inspector=\"components/content/ProseCodeInline.vue:2:3\">/users/2\u003C/code>.\u003C/p>\u003Cp data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseP.vue:2:3\">But our component contains a button that triggers a programmatic route update using \u003Ccode style=\"background-color:#f1f1f1;color:#466581;padding:0.25rem 0.5rem;margin:0;font-size:0.85em;border-radius:3px;\" data-v-inspector=\"components/content/ProseCodeInline.vue:2:3\">router.push\u003C/code>.\u003C/p>\u003C/div>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"\" >\u003C![endif]-->\n            \n      \u003Cdiv style=\"height:10px;line-height:10px;\"> \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" bgcolor=\"#D1000E19\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"background:#D1000E19;background-color:#D1000E19;margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"background:#D1000E19;background-color:#D1000E19;width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n                  \n      \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#cf000f;\">\u003Cp data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseP.vue:2:3\">Programmatically altering the path \u003Cstrong data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseStrong.vue:2:3\">does not trigger\u003C/strong> the re-rendering of the view. As a result, the \u003Ccode style=\"background-color:#f1f1f1;color:#466581;padding:0.25rem 0.5rem;margin:0;font-size:0.85em;border-radius:3px;\" data-v-inspector=\"components/content/ProseCodeInline.vue:2:3\">mounted()\u003C/code> hooks do not fire, and the nested components do not reload, leading to \u003Cstrong data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseStrong.vue:2:3\">unexpected behavior\u003C/strong>.\u003C/p>\u003C/div>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"\" >\u003C![endif]-->\n            \n      \u003Cdiv style=\"height:20px;line-height:20px;\"> \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n                  \n      \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Ch3 id=\"solution-1-watcher\" data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseH3.vue:2:3\">Solution 1: Watcher\u003C/h3>\u003Cp data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseP.vue:2:3\">The simplest solution is to add a \u003Cmj-text rel=\"nofollow\">\u003Ca href=\"https://vuejs.org/guide/essentials/watchers.html#watchers\" target=\"_blank\" data-v-inspector=\"components/content/ProseA.vue:7:6\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">watcher\u003C/a>\u003C/mj-text> that fetches the details if the route params have changed:\u003C/p>\u003C/div>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n                  \n      \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Cdiv class=\"code\" data-v-inspector=\"components/content/ProseCode.vue:39:9\">\u003Cpre tabindex=\"1\" class=\"shiki \" style=\"background-color: #1E1E1E\">\u003Ccode class=\"undefined\" style=\"undefined\">\u003Cdiv style=\"padding: 10px\">\u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" bgcolor=\"#1e1e1e\" style=\"border-collapse:separate; border-spacing: 0 0.2em;\">\u003Ctbody>\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #808080\"><\u003C/span>\u003Cspan style=\"color: #569CD6\">script\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #9CDCFE\">setup\u003C/span>\u003Cspan style=\"color: #808080\">>\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #6A9955\">// ...\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line highlighted-line\">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #DCDCAA\">watch\u003C/span>\u003Cspan style=\"color: #D4D4D4\">(\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line highlighted-line\">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\">  () \u003C/span>\u003Cspan style=\"color: #569CD6\">=>\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #9CDCFE\">route\u003C/span>\u003Cspan style=\"color: #D4D4D4\">.\u003C/span>\u003Cspan style=\"color: #9CDCFE\">params\u003C/span>\u003Cspan style=\"color: #D4D4D4\">.\u003C/span>\u003Cspan style=\"color: #9CDCFE\">id\u003C/span>\u003Cspan style=\"color: #D4D4D4\">,\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line highlighted-line\">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\">  (\u003C/span>\u003Cspan style=\"color: #9CDCFE\">newId\u003C/span>\u003Cspan style=\"color: #D4D4D4\">, \u003C/span>\u003Cspan style=\"color: #9CDCFE\">oldId\u003C/span>\u003Cspan style=\"color: #D4D4D4\">) \u003C/span>\u003Cspan style=\"color: #569CD6\">=>\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> {\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line highlighted-line\">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\">    \u003C/span>\u003Cspan style=\"color: #DCDCAA\">fetchDetails\u003C/span>\u003Cspan style=\"color: #D4D4D4\">(\u003C/span>\u003Cspan style=\"color: #9CDCFE\">route\u003C/span>\u003Cspan style=\"color: #D4D4D4\">.\u003C/span>\u003Cspan style=\"color: #9CDCFE\">params\u003C/span>\u003Cspan style=\"color: #D4D4D4\">.\u003C/span>\u003Cspan style=\"color: #9CDCFE\">id\u003C/span>\u003Cspan style=\"color: #D4D4D4\">)\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line highlighted-line\">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\">  }\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line highlighted-line\">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\">)\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #808080\"></\u003C/span>\u003Cspan style=\"color: #569CD6\">script\u003C/span>\u003Cspan style=\"color: #808080\">>\u003C/span>\u003C/td>\n    \u003C/tr>\u003C/tbody>\u003C/table>\u003C/div>\u003C/code>\u003C/pre>\u003C/div>\u003C/div>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n                  \n      \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Ch3 id=\"solution-2-route-guard\" data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseH3.vue:2:3\">Solution 2: Route Guard\u003C/h3>\u003Cp data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseP.vue:2:3\">Another solution is the \u003Cmj-text rel=\"nofollow\">\u003Ca href=\"https://router.vuejs.org/guide/advanced/navigation-guards.html#using-the-options-api\" target=\"_blank\" data-v-inspector=\"components/content/ProseA.vue:7:6\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">beforeRouteUpdate\u003C/a>\u003C/mj-text> route guard:\u003C/p>\u003C/div>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n                  \n      \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Cdiv class=\"code\" data-v-inspector=\"components/content/ProseCode.vue:39:9\">\u003Cpre tabindex=\"1\" class=\"shiki \" style=\"background-color: #1E1E1E\">\u003Ccode class=\"undefined\" style=\"undefined\">\u003Cdiv style=\"padding: 10px\">\u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" bgcolor=\"#1e1e1e\" style=\"border-collapse:separate; border-spacing: 0 0.2em;\">\u003Ctbody>\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #808080\"><\u003C/span>\u003Cspan style=\"color: #569CD6\">script\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> \u003C/span>\u003Cspan style=\"color: #9CDCFE\">setup\u003C/span>\u003Cspan style=\"color: #808080\">>\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #6A9955\">// ...\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line highlighted-line\">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #DCDCAA\">onBeforeRouteUpdate\u003C/span>\u003Cspan style=\"color: #D4D4D4\">(\u003C/span>\u003Cspan style=\"color: #569CD6\">async\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> (\u003C/span>\u003Cspan style=\"color: #9CDCFE\">to\u003C/span>\u003Cspan style=\"color: #D4D4D4\">, \u003C/span>\u003Cspan style=\"color: #9CDCFE\">from\u003C/span>\u003Cspan style=\"color: #D4D4D4\">) \u003C/span>\u003Cspan style=\"color: #569CD6\">=>\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> {\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line highlighted-line\">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\">  \u003C/span>\u003Cspan style=\"color: #C586C0\">if\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> (\u003C/span>\u003Cspan style=\"color: #9CDCFE\">to\u003C/span>\u003Cspan style=\"color: #D4D4D4\">.\u003C/span>\u003Cspan style=\"color: #9CDCFE\">params\u003C/span>\u003Cspan style=\"color: #D4D4D4\">.\u003C/span>\u003Cspan style=\"color: #9CDCFE\">id\u003C/span>\u003Cspan style=\"color: #D4D4D4\"> !== \u003C/span>\u003Cspan style=\"color: #9CDCFE\">from\u003C/span>\u003Cspan style=\"color: #D4D4D4\">.\u003C/span>\u003Cspan style=\"color: #9CDCFE\">params\u003C/span>\u003Cspan style=\"color: #D4D4D4\">.\u003C/span>\u003Cspan style=\"color: #9CDCFE\">id\u003C/span>\u003Cspan style=\"color: #D4D4D4\">) {\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line highlighted-line\">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\">    \u003C/span>\u003Cspan style=\"color: #DCDCAA\">fetchDetails\u003C/span>\u003Cspan style=\"color: #D4D4D4\">(\u003C/span>\u003Cspan style=\"color: #9CDCFE\">route\u003C/span>\u003Cspan style=\"color: #D4D4D4\">.\u003C/span>\u003Cspan style=\"color: #9CDCFE\">params\u003C/span>\u003Cspan style=\"color: #D4D4D4\">.\u003C/span>\u003Cspan style=\"color: #9CDCFE\">id\u003C/span>\u003Cspan style=\"color: #D4D4D4\">)\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line highlighted-line\">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\">  }\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line highlighted-line\">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #D4D4D4\">})\u003C/span>\u003C/td>\n    \u003C/tr>\n\u003Ctr class=\"line \">\n    \u003Ctd bgcolor=\"#1e1e1e\">\u003Cspan style=\"color: #808080\"></\u003C/span>\u003Cspan style=\"color: #569CD6\">script\u003C/span>\u003Cspan style=\"color: #808080\">>\u003C/span>\u003C/td>\n    \u003C/tr>\u003C/tbody>\u003C/table>\u003C/div>\u003C/code>\u003C/pre>\u003C/div>\u003C/div>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"\" >\u003C![endif]-->\n            \n      \u003Cdiv style=\"height:10px;line-height:10px;\"> \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" bgcolor=\"#007BFF19\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"background:#007BFF19;background-color:#007BFF19;margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"background:#007BFF19;background-color:#007BFF19;width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n                  \n      \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#007bff;\">\u003Cp data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseP.vue:2:3\">Of course, you can also use the \u003Cmj-text rel=\"nofollow\">\u003Ca href=\"https://router.vuejs.org/guide/advanced/navigation-guards.html#using-the-options-api\" target=\"_blank\" data-v-inspector=\"components/content/ProseA.vue:7:6\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">route guard with Options API\u003C/a>\u003C/mj-text>.\u003C/p>\u003C/div>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"\" >\u003C![endif]-->\n            \n      \u003Cdiv style=\"height:20px;line-height:20px;\"> \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n                  \n      \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Cp data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseP.vue:2:3\">It adds a navigation guard that triggers whenever the current location is about to be updated. Similar to \u003Ccode style=\"background-color:#f1f1f1;color:#466581;padding:0.25rem 0.5rem;margin:0;font-size:0.85em;border-radius:3px;\" data-v-inspector=\"components/content/ProseCodeInline.vue:2:3\">beforeRouteUpdate\u003C/code> but can be used in any component. The guard is removed when the component is unmounted.\u003C/p>\u003Ch3 id=\"difference-between-solution-1-2\" data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseH3.vue:2:3\">Difference Between Solution 1 & 2\u003C/h3>\u003Cp data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseP.vue:2:3\">There is a big difference between using \u003Ccode style=\"background-color:#f1f1f1;color:#466581;padding:0.25rem 0.5rem;margin:0;font-size:0.85em;border-radius:3px;\" data-v-inspector=\"components/content/ProseCodeInline.vue:2:3\">watch\u003C/code> and \u003Ccode style=\"background-color:#f1f1f1;color:#466581;padding:0.25rem 0.5rem;margin:0;font-size:0.85em;border-radius:3px;\" data-v-inspector=\"components/content/ProseCodeInline.vue:2:3\">beforeRouteUpdate\u003C/code>:\u003C/p>\u003Cp data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseP.vue:2:3\">The route guard is called \u003Cstrong data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseStrong.vue:2:3\">before\u003C/strong> the value of the \u003Ccode style=\"background-color:#f1f1f1;color:#466581;padding:0.25rem 0.5rem;margin:0;font-size:0.85em;border-radius:3px;\" data-v-inspector=\"components/content/ProseCodeInline.vue:2:3\">route\u003C/code> object actually changes. The watcher is called \u003Cstrong data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseStrong.vue:2:3\">after\u003C/strong> the value of \u003Ccode style=\"background-color:#f1f1f1;color:#466581;padding:0.25rem 0.5rem;margin:0;font-size:0.85em;border-radius:3px;\" data-v-inspector=\"components/content/ProseCodeInline.vue:2:3\">route\u003C/code> has changed.\u003C/p>\u003Cp data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseP.vue:2:3\">Using the \u003Ccode style=\"background-color:#f1f1f1;color:#466581;padding:0.25rem 0.5rem;margin:0;font-size:0.85em;border-radius:3px;\" data-v-inspector=\"components/content/ProseCodeInline.vue:2:3\">beforeRouteUpdate\u003C/code> navigation guard, you can determine whether or not you want to prevent the route from changing or go to a different route entirely.\u003C/p>\u003C/div>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"left\" style=\"font-size:0px;padding:20px 25px;word-break:break-word;\">\n                  \n      \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:22px;font-weight:700;line-height:24px;text-align:left;color:#3fb983;\">Curated Vue Content\u003C/div>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n                  \n      \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Ca href=\"https://blog.vuejs.org/posts/volar-a-new-beginning.html\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\" data-v-inspector=\"components/content/EmailLink.vue:19:9\" data-v-a052533c>📕 Volar: A New Beginning\u003C/a>\u003Cspan style=\"font-size:14px;padding:0;margin:0;\" data-v-inspector=\"components/content/EmailLink.vue:22:9\" data-v-a052533c>  \u003Ctable data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseTable.vue:2:3\" data-v-a052533c-s>\n    \u003Ctbody data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseTbody.vue:2:3\">\u003Ctr data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseTr.vue:2:3\">\u003Ctd data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseTd.vue:2:3\">👉🏻 Volar, previously the official Vue VSCode extension, is now an embedded language tooling framework.\u003C/td>\u003C/tr>\n    \u003Ctr data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseTr.vue:2:3\">\u003Ctd data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseTd.vue:2:3\">👉🏻 It can process any file format that involves embedded languages.\u003C/td>\u003C/tr>\n  \u003C/tbody>\u003C/table>\u003C/span>\u003Ca href=\"https://blog.vuejs.org/posts/volar-a-new-beginning.html\" style=\"text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px; font-size: 10px; color: #4a5568; text-decoration: none;\" data-v-inspector=\"components/content/EmailLink.vue:25:9\" data-v-a052533c>blog.vuejs.org\u003C/a>\u003C/div>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n                  \n      \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Ca href=\"https://www.geeksforgeeks.org/how-to-create-a-reporting-app-with-vue-3-and-composition-api/\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\" data-v-inspector=\"components/content/EmailLink.vue:19:9\" data-v-a052533c>📕 How to create a reporting app with Vue 3 and Composition API\u003C/a>\u003Cspan style=\"font-size:14px;padding:0;margin:0;\" data-v-inspector=\"components/content/EmailLink.vue:22:9\" data-v-a052533c>  \u003Ctable data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseTable.vue:2:3\" data-v-a052533c-s>\n    \u003Ctbody data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseTbody.vue:2:3\">\u003Ctr data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseTr.vue:2:3\">\u003Ctd data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseTd.vue:2:3\">👉🏻 In this article, you'll learn how to create a reporting app with Vue 3 and Composition API.\u003C/td>\u003C/tr>\n    \u003Ctr data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseTr.vue:2:3\">\u003Ctd data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseTd.vue:2:3\">👉🏻 Flexmonster Pivot Table & Charts and Highcharts libraries are used.\u003C/td>\u003C/tr>\n  \u003C/tbody>\u003C/table>\u003C/span>\u003Ca href=\"https://www.geeksforgeeks.org/how-to-create-a-reporting-app-with-vue-3-and-composition-api/\" style=\"text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px; font-size: 10px; color: #4a5568; text-decoration: none;\" data-v-inspector=\"components/content/EmailLink.vue:25:9\" data-v-a052533c>www.geeksforgeeks.org\u003C/a>\u003C/div>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n                  \n      \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Ca href=\"https://fadamakis.com/vue-js-real-life-transitions-and-micro-interactions-e86bd51301b8\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\" data-v-inspector=\"components/content/EmailLink.vue:19:9\" data-v-a052533c>📕 Vue Real Life Transitions and Micro-Interactions\u003C/a>\u003Cspan style=\"font-size:14px;padding:0;margin:0;\" data-v-inspector=\"components/content/EmailLink.vue:22:9\" data-v-a052533c>\u003Cp data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseP.vue:2:3\" data-v-a052533c-s>👉🏻 In this article, Fotis investigates different options to create transitions and micro-interactions.\u003C/p>\u003C/span>\u003Ca href=\"https://fadamakis.com/vue-js-real-life-transitions-and-micro-interactions-e86bd51301b8\" style=\"text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px; font-size: 10px; color: #4a5568; text-decoration: none;\" data-v-inspector=\"components/content/EmailLink.vue:25:9\" data-v-a052533c>fadamakis.com\u003C/a>\u003C/div>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n                  \n      \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Ca href=\"https://www.youtube.com/watch?v=OrT0tHGXyqE\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\" data-v-inspector=\"components/content/EmailLink.vue:19:9\" data-v-a052533c>📹 Vue: What to Expect in 2023\u003C/a>\u003Cspan style=\"font-size:14px;padding:0;margin:0;\" data-v-inspector=\"components/content/EmailLink.vue:22:9\" data-v-a052533c>  \u003Ctable data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseTable.vue:2:3\" data-v-a052533c-s>\n    \u003Ctbody data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseTbody.vue:2:3\">\u003Ctr data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseTr.vue:2:3\">\u003Ctd data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseTd.vue:2:3\">👉🏻 Evan You tells us what to expect in 2023 from Vue.js.\u003C/td>\u003C/tr>\n    \u003Ctr data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseTr.vue:2:3\">\u003Ctd data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseTd.vue:2:3\">👉🏻 He is the creator of the JavaScript framework Vue.js and the frontend build tool Vite.\u003C/td>\u003C/tr>\n  \u003C/tbody>\u003C/table>\u003C/span>\u003Ca href=\"https://www.youtube.com/watch?v=OrT0tHGXyqE\" style=\"text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px; font-size: 10px; color: #4a5568; text-decoration: none;\" data-v-inspector=\"components/content/EmailLink.vue:25:9\" data-v-a052533c>www.youtube.com\u003C/a>\u003C/div>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n                  \n      \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Ca href=\"https://scrollyvideo.js.org/\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\" data-v-inspector=\"components/content/EmailLink.vue:19:9\" data-v-a052533c>🛠️ ScrollyVideo.js\u003C/a>\u003Cspan style=\"font-size:14px;padding:0;margin:0;\" data-v-inspector=\"components/content/EmailLink.vue:22:9\" data-v-a052533c>  \u003Ctable data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseTable.vue:2:3\" data-v-a052533c-s>\n    \u003Ctbody data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseTbody.vue:2:3\">\u003Ctr data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseTr.vue:2:3\">\u003Ctd data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseTd.vue:2:3\">👉🏻 Responsive scrollable videos without obscure video encoding requirements.\u003C/td>\u003C/tr>\n    \u003Ctr data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseTr.vue:2:3\">\u003Ctd data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseTd.vue:2:3\">👉🏻 Compatible with React, Svelte, Vue, or just plain HTML.\u003C/td>\u003C/tr>\n  \u003C/tbody>\u003C/table>\u003C/span>\u003Ca href=\"https://scrollyvideo.js.org/\" style=\"text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px; font-size: 10px; color: #4a5568; text-decoration: none;\" data-v-inspector=\"components/content/EmailLink.vue:25:9\" data-v-a052533c>scrollyvideo.js.org\u003C/a>\u003C/div>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n                  \n      \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Ca href=\"https://developer.chrome.com/blog/new-in-devtools-110/#syntax\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\" data-v-inspector=\"components/content/EmailLink.vue:19:9\" data-v-a052533c>📕 Devtools in Chrome 110\u003C/a>\u003Cspan style=\"font-size:14px;padding:0;margin:0;\" data-v-inspector=\"components/content/EmailLink.vue:22:9\" data-v-a052533c>\u003Cp data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseP.vue:2:3\" data-v-a052533c-s>👉🏻 Adds enhanced support when inspecting Vue source\u003C/p>\u003C/span>\u003Ca href=\"https://developer.chrome.com/blog/new-in-devtools-110/#syntax\" style=\"text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px; font-size: 10px; color: #4a5568; text-decoration: none;\" data-v-inspector=\"components/content/EmailLink.vue:25:9\" data-v-a052533c>developer.chrome.com\u003C/a>\u003C/div>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"left\" style=\"font-size:0px;padding:20px 25px;word-break:break-word;\">\n                  \n      \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:22px;font-weight:700;line-height:24px;text-align:left;color:#3fb983;\">Quote of the week\u003C/div>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n                  \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"border-collapse:collapse;border-spacing:0px;\" class=\"mj-full-width-mobile\">\n        \u003Ctbody>\n          \u003Ctr>\n            \u003Ctd style=\"width:400px;\" class=\"mj-full-width-mobile\">\n              \n      \u003Cimg height=\"auto\" src=\"https://mokkapps.twic.pics/weekly-vue.news/quotes/quote-not-written-down.png\" style=\"border:0;display:block;outline:none;text-decoration:none;height:auto;width:100%;font-size:13px;\" title=\"Quote of the week\" width=\"400\">\n    \n            \u003C/td>\n          \u003C/tr>\n        \u003C/tbody>\n      \u003C/table>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"left\" style=\"font-size:0px;padding:20px 25px;word-break:break-word;\">\n                  \n      \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:22px;font-weight:700;line-height:24px;text-align:left;color:#3fb983;\">Curated Web Development Content\u003C/div>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n                  \n      \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Ca href=\"https://nolanlawson.com/2022/10/26/a-beginners-guide-to-chrome-tracing/\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\" data-v-inspector=\"components/content/EmailLink.vue:19:9\" data-v-a052533c>📕 A beginner’s guide to Chrome tracing\u003C/a>\u003Cspan style=\"font-size:14px;padding:0;margin:0;\" data-v-inspector=\"components/content/EmailLink.vue:22:9\" data-v-a052533c>  \u003Ctable data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseTable.vue:2:3\" data-v-a052533c-s>\n    \u003Ctbody data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseTbody.vue:2:3\">\u003Ctr data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseTr.vue:2:3\">\u003Ctd data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseTd.vue:2:3\">👉🏻 Chrome tracing lets you record a performance trace that captures low-level details of what the browser is doing.\u003C/td>\u003C/tr>\n    \u003Ctr data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseTr.vue:2:3\">\u003Ctd data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseTd.vue:2:3\">👉🏻 This post is a short guide on how to use this tool, from a web developer’s point of view.\u003C/td>\u003C/tr>\n  \u003C/tbody>\u003C/table>\u003C/span>\u003Ca href=\"https://nolanlawson.com/2022/10/26/a-beginners-guide-to-chrome-tracing/\" style=\"text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px; font-size: 10px; color: #4a5568; text-decoration: none;\" data-v-inspector=\"components/content/EmailLink.vue:25:9\" data-v-a052533c>nolanlawson.com\u003C/a>\u003C/div>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n                  \n      \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Ca href=\"https://www.infoq.com/news/2023/02/veracode-software-security\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\" data-v-inspector=\"components/content/EmailLink.vue:19:9\" data-v-a052533c>📕 Software Security Report Finds JavaScript Applications Have Fewer Flaws Than Java and .NET\u003C/a>\u003Cspan style=\"font-size:14px;padding:0;margin:0;\" data-v-inspector=\"components/content/EmailLink.vue:22:9\" data-v-a052533c>\u003Cp data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseP.vue:2:3\" data-v-a052533c-s>👉🏻 Veracode’s State of Software Security report for 2023 found that JavaScript Applications Have Fewer Security Flaws Than Java and .NET Applications.\u003C/p>\u003C/span>\u003Ca href=\"https://www.infoq.com/news/2023/02/veracode-software-security\" style=\"text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px; font-size: 10px; color: #4a5568; text-decoration: none;\" data-v-inspector=\"components/content/EmailLink.vue:25:9\" data-v-a052533c>www.infoq.com\u003C/a>\u003C/div>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n                  \n      \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Ca href=\"https://regexp.dev/\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\" data-v-inspector=\"components/content/EmailLink.vue:19:9\" data-v-a052533c>🛠️ magic-regexp\u003C/a>\u003Cspan style=\"font-size:14px;padding:0;margin:0;\" data-v-inspector=\"components/content/EmailLink.vue:22:9\" data-v-a052533c>  \u003Ctable data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseTable.vue:2:3\" data-v-a052533c-s>\n    \u003Ctbody data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseTbody.vue:2:3\">\u003Ctr data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseTr.vue:2:3\">\u003Ctd data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseTd.vue:2:3\">👉🏻 A compiled-away, type-safe, readable RegExp alternative.\u003C/td>\u003C/tr>\n    \u003Ctr data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseTr.vue:2:3\">\u003Ctd data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseTd.vue:2:3\">👉🏻 \u003Cmj-text>\u003Ca href=\"https://www.youtube.com/watch?v=X_k198mrGL8\" target=\"_blank\" data-v-inspector=\"components/content/ProseA.vue:7:6\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">Watch it in action\u003C/a>\u003C/mj-text>\u003C/td>\u003C/tr>\n  \u003C/tbody>\u003C/table>\u003C/span>\u003Ca href=\"https://regexp.dev/\" style=\"text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px; font-size: 10px; color: #4a5568; text-decoration: none;\" data-v-inspector=\"components/content/EmailLink.vue:25:9\" data-v-a052533c>regexp.dev\u003C/a>\u003C/div>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n                  \n      \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Ca href=\"https://zero-to-nix.com/\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\" data-v-inspector=\"components/content/EmailLink.vue:19:9\" data-v-a052533c>🛠️ Zero to Nix\u003C/a>\u003Cspan style=\"font-size:14px;padding:0;margin:0;\" data-v-inspector=\"components/content/EmailLink.vue:22:9\" data-v-a052533c>\u003Cp data-v-inspector=\"node_modules/@nuxt/content/dist/runtime/components/Prose/ProseP.vue:2:3\" data-v-a052533c-s>👉🏻 Nix is a tool that builds packages in isolation from each other to ensure that they are reproducible and don't have undeclared dependencies.\u003C/p>\u003C/span>\u003Ca href=\"https://zero-to-nix.com/\" style=\"text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px; font-size: 10px; color: #4a5568; text-decoration: none;\" data-v-inspector=\"components/content/EmailLink.vue:25:9\" data-v-a052533c>zero-to-nix.com\u003C/a>\u003C/div>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"center\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n                  \n      \u003Cp style=\"border-top:solid 1px #E0E0E0;font-size:1px;margin:0px auto;width:100%;\">\n      \u003C/p>\n      \n      \u003C!--[if mso | IE]>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" style=\"border-top:solid 1px #E0E0E0;font-size:1px;margin:0px auto;width:550px;\" role=\"presentation\" width=\"550px\" >\u003Ctr>\u003Ctd style=\"height:0;line-height:0;\">  \n\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n    \n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n                  \n      \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-style:italic;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Cspan data-v-inspector=\"components/content/EmailWrapper.vue:46:13\">Comments? Join the discussion about this issue \u003C/span>\u003Ca href=\"https://weekly-vue.news/issues/81\" target=\"_blank\" data-v-inspector=\"components/content/EmailWrapper.vue:47:13\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">here\u003C/a>.\u003C/div>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n                  \n      \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Cp style=\"margin:5px 0;\" data-v-inspector=\"components/content/EmailWrapper.vue:54:13\">Until next week,\u003C/p>\u003C/div>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:90px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-15 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;padding-right:0px;padding-left:25px;word-break:break-word;\">\n                  \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"border-collapse:collapse;border-spacing:0px;\">\n        \u003Ctbody>\n          \u003Ctr>\n            \u003Ctd style=\"width:65px;\">\n              \n        \u003Ca href=\"https://mokkapps.de?ref=newsletter\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">\n          \n      \u003Cimg height=\"auto\" src=\"https://mokkapps.twic.pics/weekly-vue.news/profile-pic.png?twic=v1/cover=80\" style=\"border:0;display:block;outline:none;text-decoration:none;height:auto;width:100%;font-size:13px;\" width=\"65\">\n    \n        \u003C/a>\n      \n            \u003C/td>\n          \u003C/tr>\n        \u003C/tbody>\n      \u003C/table>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003Ctd class=\"\" style=\"vertical-align:top;width:510px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-85 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd vertical-align=\"top\" style=\"font-size:0px;word-break:break-word;\">\n                  \n      \u003Cdiv class=\"mj-column-per-50 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n                  \n      \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">\u003Ca href=\"https://mokkapps.de?ref=newsletter\" style=\"text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px; color: black;\" data-v-inspector=\"components/content/EmailWrapper.vue:72:15\">Michael Hoffmann\u003C/a> (Curator)\u003C/div>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n              \u003Ctr>\n                \u003Ctd vertical-align=\"top\" style=\"font-size:0px;word-break:break-word;\">\n                  \n      \u003Cdiv class=\"mj-column-per-50 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;padding-left:22px;word-break:break-word;\">\n                  \n      \n     \u003C!--[if mso | IE]>\u003Ctable align=\"left\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" >\u003Ctr>\u003Ctd>\u003C![endif]-->\n              \u003Ctable align=\"left\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"float:none;display:inline-table;\">\n                \u003Ctbody>\n                  \n      \u003Ctr>\n        \u003Ctd style=\"padding:4px;vertical-align:middle;\">\n          \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"background:#55acee;border-radius:3px;width:18px;\">\n            \u003Ctbody>\n              \u003Ctr>\n                \u003Ctd style=\"font-size:0;height:18px;vertical-align:middle;width:18px;\">\n                  \u003Ca href=\"https://twitter.com/mokkapps\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">\n                    \u003Cimg height=\"18\" src=\"https://www.mailjet.com/images/theme/v1/icons/ico-social/twitter.png\" style=\"border-radius:3px;display:block;\" width=\"18\">\n                  \u003C/a>\n                \u003C/td>\n              \u003C/tr>\n            \u003C/tbody>\n          \u003C/table>\n        \u003C/td>\n        \n      \u003C/tr>\n    \n                \u003C/tbody>\n              \u003C/table>\n            \u003C!--[if mso | IE]>\u003C/td>\u003Ctd>\u003C![endif]-->\n              \u003Ctable align=\"left\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"float:none;display:inline-table;\">\n                \u003Ctbody>\n                  \n      \u003Ctr>\n        \u003Ctd style=\"padding:4px;vertical-align:middle;\">\n          \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"background:#000000;border-radius:3px;width:18px;\">\n            \u003Ctbody>\n              \u003Ctr>\n                \u003Ctd style=\"font-size:0;height:18px;vertical-align:middle;width:18px;\">\n                  \u003Ca href=\"https://github.com/mokkapps\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">\n                    \u003Cimg height=\"18\" src=\"https://www.mailjet.com/images/theme/v1/icons/ico-social/github.png\" style=\"border-radius:3px;display:block;\" width=\"18\">\n                  \u003C/a>\n                \u003C/td>\n              \u003C/tr>\n            \u003C/tbody>\n          \u003C/table>\n        \u003C/td>\n        \n      \u003C/tr>\n    \n                \u003C/tbody>\n              \u003C/table>\n            \u003C!--[if mso | IE]>\u003C/td>\u003Ctd>\u003C![endif]-->\n              \u003Ctable align=\"left\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"float:none;display:inline-table;\">\n                \u003Ctbody>\n                  \n      \u003Ctr>\n        \u003Ctd style=\"padding:4px;vertical-align:middle;\">\n          \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"background:#3f729b;border-radius:3px;width:18px;\">\n            \u003Ctbody>\n              \u003Ctr>\n                \u003Ctd style=\"font-size:0;height:18px;vertical-align:middle;width:18px;\">\n                  \u003Ca href=\"https://instagram.com/mokkapps\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">\n                    \u003Cimg height=\"18\" src=\"https://www.mailjet.com/images/theme/v1/icons/ico-social/instagram.png\" style=\"border-radius:3px;display:block;\" width=\"18\">\n                  \u003C/a>\n                \u003C/td>\n              \u003C/tr>\n            \u003C/tbody>\n          \u003C/table>\n        \u003C/td>\n        \n      \u003C/tr>\n    \n                \u003C/tbody>\n              \u003C/table>\n            \u003C!--[if mso | IE]>\u003C/td>\u003Ctd>\u003C![endif]-->\n              \u003Ctable align=\"left\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"float:none;display:inline-table;\">\n                \u003Ctbody>\n                  \n      \u003Ctr>\n        \u003Ctd style=\"padding:4px;vertical-align:middle;\">\n          \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"background:#EB3323;border-radius:3px;width:18px;\">\n            \u003Ctbody>\n              \u003Ctr>\n                \u003Ctd style=\"font-size:0;height:18px;vertical-align:middle;width:18px;\">\n                  \u003Ca href=\"https://youtube.com/@mokkapps\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">\n                    \u003Cimg height=\"18\" src=\"https://www.mailjet.com/images/theme/v1/icons/ico-social/youtube.png\" style=\"border-radius:3px;display:block;\" width=\"18\">\n                  \u003C/a>\n                \u003C/td>\n              \u003C/tr>\n            \u003C/tbody>\n          \u003C/table>\n        \u003C/td>\n        \n      \u003C/tr>\n    \n                \u003C/tbody>\n              \u003C/table>\n            \u003C!--[if mso | IE]>\u003C/td>\u003Ctd>\u003C![endif]-->\n              \u003Ctable align=\"left\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"float:none;display:inline-table;\">\n                \u003Ctbody>\n                  \n      \u003Ctr>\n        \u003Ctd style=\"padding:4px;vertical-align:middle;\">\n          \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"background:#0077b5;border-radius:3px;width:18px;\">\n            \u003Ctbody>\n              \u003Ctr>\n                \u003Ctd style=\"font-size:0;height:18px;vertical-align:middle;width:18px;\">\n                  \u003Ca href=\"https://www.linkedin.com/shareArticle?mini=true&url=https://www.linkedin.com/in/mokkapps&title=&summary=&source=\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">\n                    \u003Cimg height=\"18\" src=\"https://www.mailjet.com/images/theme/v1/icons/ico-social/linkedin.png\" style=\"border-radius:3px;display:block;\" width=\"18\">\n                  \u003C/a>\n                \u003C/td>\n              \u003C/tr>\n            \u003C/tbody>\n          \u003C/table>\n        \u003C/td>\n        \n      \u003C/tr>\n    \n                \u003C/tbody>\n              \u003C/table>\n            \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n    \n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"center\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n                  \n      \u003Cp style=\"border-top:solid 1px #E0E0E0;font-size:1px;margin:0px auto;width:100%;\">\n      \u003C/p>\n      \n      \u003C!--[if mso | IE]>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" style=\"border-top:solid 1px #E0E0E0;font-size:1px;margin:0px auto;width:550px;\" role=\"presentation\" width=\"550px\" >\u003Ctr>\u003Ctd style=\"height:0;line-height:0;\">  \n\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n    \n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:120px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-20 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n                  \n      \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:16px;font-weight:300;line-height:24px;text-align:left;color:#616161;\">Share via\u003C/div>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003Ctd class=\"\" style=\"vertical-align:top;width:480px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-80 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"left\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n                  \n      \n     \u003C!--[if mso | IE]>\u003Ctable align=\"left\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" >\u003Ctr>\u003Ctd>\u003C![endif]-->\n              \u003Ctable align=\"left\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"float:none;display:inline-table;\">\n                \u003Ctbody>\n                  \n      \u003Ctr>\n        \u003Ctd style=\"padding:4px;vertical-align:middle;\">\n          \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"background:#3b5998;border-radius:3px;width:20px;\">\n            \u003Ctbody>\n              \u003Ctr>\n                \u003Ctd style=\"font-size:0;height:20px;vertical-align:middle;width:20px;\">\n                  \u003Ca href=\"https://www.facebook.com/sharer/sharer.php?u=https://weekly-vue.news/issues/81\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">\n                    \u003Cimg height=\"20\" src=\"https://www.mailjet.com/images/theme/v1/icons/ico-social/facebook.png\" style=\"border-radius:3px;display:block;\" width=\"20\">\n                  \u003C/a>\n                \u003C/td>\n              \u003C/tr>\n            \u003C/tbody>\n          \u003C/table>\n        \u003C/td>\n        \n          \u003Ctd style=\"vertical-align:middle;\">\n            \u003Ca href=\"https://www.facebook.com/sharer/sharer.php?u=https://weekly-vue.news/issues/81\" style=\"text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px; color: #333333; font-size: 12px; font-family: NotoSans, Helvetica, sans-serif; line-height: 22px; text-decoration: none;\" target=\"_blank\">\n              Facebook\n            \u003C/a>\n          \u003C/td>\n          \n      \u003C/tr>\n    \n                \u003C/tbody>\n              \u003C/table>\n            \u003C!--[if mso | IE]>\u003C/td>\u003Ctd>\u003C![endif]-->\n              \u003Ctable align=\"left\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"float:none;display:inline-table;\">\n                \u003Ctbody>\n                  \n      \u003Ctr>\n        \u003Ctd style=\"padding:4px;vertical-align:middle;\">\n          \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"background:#55acee;border-radius:3px;width:20px;\">\n            \u003Ctbody>\n              \u003Ctr>\n                \u003Ctd style=\"font-size:0;height:20px;vertical-align:middle;width:20px;\">\n                  \u003Ca href=\"https://twitter.com/intent/tweet?url=https://weekly-vue.news/issues/81\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">\n                    \u003Cimg height=\"20\" src=\"https://www.mailjet.com/images/theme/v1/icons/ico-social/twitter.png\" style=\"border-radius:3px;display:block;\" width=\"20\">\n                  \u003C/a>\n                \u003C/td>\n              \u003C/tr>\n            \u003C/tbody>\n          \u003C/table>\n        \u003C/td>\n        \n          \u003Ctd style=\"vertical-align:middle;\">\n            \u003Ca href=\"https://twitter.com/intent/tweet?url=https://weekly-vue.news/issues/81\" style=\"text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px; color: #333333; font-size: 12px; font-family: NotoSans, Helvetica, sans-serif; line-height: 22px; text-decoration: none;\" target=\"_blank\">\n              Twitter\n            \u003C/a>\n          \u003C/td>\n          \n      \u003C/tr>\n    \n                \u003C/tbody>\n              \u003C/table>\n            \u003C!--[if mso | IE]>\u003C/td>\u003Ctd>\u003C![endif]-->\n              \u003Ctable align=\"left\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"float:none;display:inline-table;\">\n                \u003Ctbody>\n                  \n      \u003Ctr>\n        \u003Ctd style=\"padding:4px;vertical-align:middle;\">\n          \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"background:#0077b5;border-radius:3px;width:20px;\">\n            \u003Ctbody>\n              \u003Ctr>\n                \u003Ctd style=\"font-size:0;height:20px;vertical-align:middle;width:20px;\">\n                  \u003Ca href=\"https://www.linkedin.com/shareArticle?mini=true&url=https://weekly-vue.news/issues/81&title=&summary=&source=\" target=\"_blank\" style=\"color: #616161; text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px;\">\n                    \u003Cimg height=\"20\" src=\"https://www.mailjet.com/images/theme/v1/icons/ico-social/linkedin.png\" style=\"border-radius:3px;display:block;\" width=\"20\">\n                  \u003C/a>\n                \u003C/td>\n              \u003C/tr>\n            \u003C/tbody>\n          \u003C/table>\n        \u003C/td>\n        \n          \u003Ctd style=\"vertical-align:middle;\">\n            \u003Ca href=\"https://www.linkedin.com/shareArticle?mini=true&url=https://weekly-vue.news/issues/81&title=&summary=&source=\" style=\"text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px; color: #333333; font-size: 12px; font-family: NotoSans, Helvetica, sans-serif; line-height: 22px; text-decoration: none;\" target=\"_blank\">\n              LinkedIn\n            \u003C/a>\n          \u003C/td>\n          \n      \u003C/tr>\n    \n                \u003C/tbody>\n              \u003C/table>\n            \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n    \n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"center\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n                  \n      \u003Cp style=\"border-top:solid 1px #E0E0E0;font-size:1px;margin:0px auto;width:100%;\">\n      \u003C/p>\n      \n      \u003C!--[if mso | IE]>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" style=\"border-top:solid 1px #E0E0E0;font-size:1px;margin:0px auto;width:550px;\" role=\"presentation\" width=\"550px\" >\u003Ctr>\u003Ctd style=\"height:0;line-height:0;\">  \n\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n    \n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"\" role=\"presentation\" style=\"width:600px;\" width=\"600\" >\u003Ctr>\u003Ctd style=\"line-height:0px;font-size:0px;mso-line-height-rule:exactly;\">\u003C![endif]-->\n    \n      \n      \u003Cdiv style=\"margin:0px auto;max-width:600px;\">\n        \n        \u003Ctable align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"width:100%;\">\n          \u003Ctbody>\n            \u003Ctr>\n              \u003Ctd style=\"direction:ltr;font-size:0px;padding:0px;text-align:center;\">\n                \u003C!--[if mso | IE]>\u003Ctable role=\"presentation\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\u003Ctr>\u003Ctd class=\"\" style=\"vertical-align:top;width:600px;\" >\u003C![endif]-->\n            \n      \u003Cdiv class=\"mj-column-per-100 mj-outlook-group-fix\" style=\"font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;\">\n        \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"vertical-align:top;\" width=\"100%\">\n        \u003Ctbody>\n          \n              \u003Ctr>\n                \u003Ctd align=\"center\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n                  \n      \u003Cdiv style=\"font-family:NotoSans, Helvetica, sans-serif;font-size:11px;font-weight:300;line-height:24px;text-align:center;color:#9B9B9B;\">\u003Ca href=\"https://weekly-vue.news/unsubscribe?token=UNSUBSCRIBE_TOKEN_PLACEHOLDER\" style=\"text-decoration: underline; text-decoration-color: #3fb983; text-decoration-thickness: 2px; text-underline-offset: 3px; color: #9b9b9b;\" data-v-inspector=\"components/content/EmailWrapper.vue:117:14\">Unsubscribe\u003C/a> from this newsletter\u003Cbr data-v-inspector=\"components/content/EmailWrapper.vue:120:33\">Holzapfelkreuther Str. 19, 81375 Munich, Germany\u003Cbr data-v-inspector=\"components/content/EmailWrapper.vue:120:87\">\u003C/div>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n              \u003Ctr>\n                \u003Ctd align=\"center\" style=\"font-size:0px;padding:10px 25px;word-break:break-word;\">\n                  \n      \u003Ctable border=\"0\" cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" style=\"border-collapse:collapse;border-spacing:0px;\">\n        \u003Ctbody>\n          \u003Ctr>\n            \u003Ctd style=\"width:1px;\">\n              \n      \u003Cimg height=\"1\" src=\"https://weekly-vue.news/api/log.gif?issueId=81&email=EMAIL_PLACEHOLDER\" style=\"border:0;display:block;outline:none;text-decoration:none;height:1px;width:100%;font-size:13px;\" width=\"1\">\n    \n            \u003C/td>\n          \u003C/tr>\n        \u003C/tbody>\n      \u003C/table>\n    \n                \u003C/td>\n              \u003C/tr>\n            \n        \u003C/tbody>\n      \u003C/table>\n    \n      \u003C/div>\n    \n          \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n              \u003C/td>\n            \u003C/tr>\n          \u003C/tbody>\n        \u003C/table>\n        \n      \u003C/div>\n    \n      \n      \u003C!--[if mso | IE]>\u003C/td>\u003C/tr>\u003C/table>\u003C![endif]-->\n    \n    \n      \u003C/div>\n    \n  \u003C/body>\n\u003C/html>\n  ",171,81,{"absoluteUrl":14,"relativeUrl":15},"-","og-issue-default.png","2023-02-19T23:00:00.000Z","Weekly Vue News #81 - Re-Rendering Vue Routes When Path Parameters Change","/issues/81",1,1794479173713]