+5

.markdownlint.json

reviewed

··· 1 1 + { 2 2 + "MD013": false, 3 3 + "MD025": false, 4 4 + "MD033": false 5 5 + }

+2 -9

components.d.ts

reviewed

··· 4 4 5 5 declare module 'vue' { 6 6 export interface GlobalComponents { 7 7 - CommunityIcon: typeof import('./src/components/icons/CommunityIcon.vue')['default'] 8 8 - DocumentationIcon: typeof import('./src/components/icons/DocumentationIcon.vue')['default'] 9 9 - EcosystemIcon: typeof import('./src/components/icons/EcosystemIcon.vue')['default'] 10 10 - FrameworkLink: typeof import('./src/components/FrameworkLink.vue')['default'] 11 11 - HelloWorld: typeof import('./src/components/HelloWorld.vue')['default'] 12 12 - Island: typeof import('./node_modules/.pnpm/iles@0.7.32/node_modules/iles/dist/client/app/components/Island.vue')['default'] 13 13 - SupportIcon: typeof import('./src/components/icons/SupportIcon.vue')['default'] 14 14 - ToolingIcon: typeof import('./src/components/icons/ToolingIcon.vue')['default'] 7 7 + Island: typeof import("./node_modules/.pnpm/iles@0.7.32/node_modules/iles/dist/client/app/components/Island.vue")["default"]; 8 8 + ProductionFlow: typeof import('./src/components/flow/ProductionFlow.vue')['default'] 15 9 Welcome: typeof import('./src/components/Welcome.vue')['default'] 16 16 - WelcomeItem: typeof import('./src/components/WelcomeItem.vue')['default'] 17 10 } 18 11 } 19 12

+4 -2

iles.config.ts

reviewed

··· 1 1 - import { defineConfig } from 'iles' 1 1 + import { defineConfig } from "iles"; 2 2 3 3 - export default defineConfig({}) 3 3 + export default defineConfig({ 4 4 + modules: ["@islands/headings"], 5 5 + });

+6

netlify.toml

reviewed

··· 1 1 + [build] 2 2 + publish = "dist" 3 3 + command = "npm run build" 4 4 + 5 5 + [build.environment] 6 6 + NODE_VERSION = "16"

+7 -1

package.json

reviewed

··· 12 12 "node": "^14.18 || >= 16.0.0" 13 13 }, 14 14 "devDependencies": { 15 15 + "@islands/headings": "^0.1.1", 16 16 + "@islands/prism": "^0.1.1", 15 17 "iles": "^0.7.19", 18 18 + "sass": "^1.49.9", 16 19 "typescript": "^4.5", 17 20 "vitest": "*", 18 21 "vue-tsc": "^0.29" 22 22 + }, 23 23 + "dependencies": { 24 24 + "pinia": "^2.0.11" 19 25 } 20 20 - } 26 26 + }

+108 -10

pnpm-lock.yaml

reviewed

··· 1 1 lockfileVersion: 5.3 2 2 3 3 specifiers: 4 4 + '@islands/headings': ^0.1.1 5 5 + '@islands/prism': ^0.1.1 4 6 iles: ^0.7.19 7 7 + pinia: ^2.0.11 8 8 + sass: ^1.49.9 5 9 typescript: ^4.5 6 10 vitest: '*' 7 11 vue-tsc: ^0.29 12 12 + 13 13 + dependencies: 14 14 + pinia: 2.0.11_typescript@4.5.5 8 15 9 16 devDependencies: 10 10 - iles: 0.7.32 17 17 + '@islands/headings': 0.1.1 18 18 + '@islands/prism': 0.1.1 19 19 + iles: 0.7.32_sass@1.49.9 20 20 + sass: 1.49.9 11 21 typescript: 4.5.5 12 12 - vitest: 0.5.5 22 22 + vitest: 0.5.5_sass@1.49.9 13 23 vue-tsc: 0.29.8_typescript@4.5.5 14 24 15 25 packages: ··· 86 96 - webpack 87 97 dev: true 88 98 99 99 + /@islands/headings/0.1.1: 100 100 + resolution: {integrity: sha512-sDMDQD6b9d48psagYBt5MbWm0wonJ4t7BJV/hzln45Xg+h4RxBUT9d/R66UaAmHiPx5b/Q+4c3VvXq9HYciMvg==} 101 101 + dependencies: 102 102 + estree-util-value-to-estree: 1.3.0 103 103 + hast-util-heading-rank: 2.1.0 104 104 + hast-util-to-string: 2.0.0 105 105 + dev: true 106 106 + 89 107 /@islands/hydration/0.3.8: 90 108 resolution: {integrity: sha512-3cjMM0Zk/AiBq0uPc2rjUsT2qNrsAvdS8MJvLHqNAnKf0BdWrqesdOJLCUHmqFqR1GmIElzUN+MoS7+9VPTr8A==} 91 109 dev: true ··· 123 141 resolution: {integrity: sha512-iB7V0foFDRxuJBM1mihVaqQbnpU3CBl0YALXh0L+e/qkAXgPR0CAckPQ3eHmpS3756cTE8hxcbCAR+B7OG0NOg==} 124 142 dependencies: 125 143 '@islands/hydration': 0.3.8 144 144 + dev: true 145 145 + 146 146 + /@islands/prism/0.1.1: 147 147 + resolution: {integrity: sha512-kTkQo/qBfgIXeb0unuEazCZEVyWnuIJX81j/QSqjQliX5MAlg/f6THJUJVyQvgKcXipR/TkQutiBXoGXRz208w==} 148 148 + dependencies: 149 149 + prismjs: 1.27.0 150 150 + unist-util-visit: 4.1.0 126 151 dev: true 127 152 128 153 /@nodelib/fs.scandir/2.1.5: ··· 278 303 vite: ^2.5.10 279 304 vue: ^3.2.25 280 305 dependencies: 281 281 - vite: 2.8.4 306 306 + vite: 2.8.4_sass@1.49.9 282 307 vue: 3.2.31 283 308 dev: true 284 309 ··· 382 407 383 408 /@vue/devtools-api/6.0.12: 384 409 resolution: {integrity: sha512-iO/4FIezHKXhiDBdKySCvJVh8/mZPxHpiQrTy+PXVqJZgpTPTdHy4q8GXulaY+UKEagdkBb0onxNQZ0LNiqVhw==} 385 385 - dev: true 386 410 387 411 /@vue/reactivity-transform/3.2.31: 388 412 resolution: {integrity: sha512-uS4l4z/W7wXdI+Va5pgVxBJ345wyGFKvpPYtdSgvfJfX/x2Ymm6ophQlXXB6acqGHtXuBqNyyO3zVp9b1r0MOA==} ··· 1059 1083 resolution: {integrity: sha512-aXXZFVMnBBDRP81vS4YtAYJ0hUkgEsXea7lNKWCOeaAquGb1Jm2rcONPB5fpzwgbNxulTvrWuKnp9UElUGAKeQ==} 1060 1084 dev: true 1061 1085 1086 1086 + /estree-util-value-to-estree/1.3.0: 1087 1087 + resolution: {integrity: sha512-Y+ughcF9jSUJvncXwqRageavjrNPAI+1M/L3BI3PyLp1nmgYTGUXU6t5z1Y7OWuThoDdhPME07bQU+d5LxdJqw==} 1088 1088 + engines: {node: '>=12.0.0'} 1089 1089 + dependencies: 1090 1090 + is-plain-obj: 3.0.0 1091 1091 + dev: true 1092 1092 + 1062 1093 /estree-util-visit/1.1.0: 1063 1094 resolution: {integrity: sha512-3lXJ4Us9j8TUif9cWcQy81t9p5OLasnDuuhrFiqb+XstmKC1d1LmrQWYsY49/9URcfHE64mPypDBaNK9NwWDPQ==} 1064 1095 dependencies: ··· 1229 1260 resolution: {integrity: sha512-WdZTbAByD+pHfl/g9QSsBIIwy8IT+EsPiKDs0KNX+zSHhdDLFKdZu0BQHljvO+0QI/BasbMSUa8wYNCZTvhslg==} 1230 1261 dev: true 1231 1262 1263 1263 + /hast-util-heading-rank/2.1.0: 1264 1264 + resolution: {integrity: sha512-w+Rw20Q/iWp2Bcnr6uTrYU6/ftZLbHKhvc8nM26VIWpDqDMlku2iXUVTeOlsdoih/UKQhY7PHQ+vZ0Aqq8bxtQ==} 1265 1265 + dependencies: 1266 1266 + '@types/hast': 2.3.4 1267 1267 + dev: true 1268 1268 + 1232 1269 /hast-util-is-element/2.1.2: 1233 1270 resolution: {integrity: sha512-thjnlGAnwP8ef/GSO1Q8BfVk2gundnc2peGQqEg2kUt/IqesiGg/5mSwN2fE7nLzy61pg88NG6xV+UrGOrx9EA==} 1234 1271 dependencies: ··· 1272 1309 unist-util-is: 5.1.1 1273 1310 dev: true 1274 1311 1312 1312 + /hast-util-to-string/2.0.0: 1313 1313 + resolution: {integrity: sha512-02AQ3vLhuH3FisaMM+i/9sm4OXGSq1UhOOCpTLLQtHdL3tZt7qil69r8M8iDkZYyC0HCFylcYoP+8IO7ddta1A==} 1314 1314 + dependencies: 1315 1315 + '@types/hast': 2.3.4 1316 1316 + dev: true 1317 1317 + 1275 1318 /hast-util-whitespace/2.0.0: 1276 1319 resolution: {integrity: sha512-Pkw+xBHuV6xFeJprJe2BBEoDV+AvQySaz3pPDRUs5PNZEMQjpXJJueqrpcHIXxnWTcAGi/UOCgVShlkY6kLoqg==} 1277 1320 dev: true ··· 1301 1344 resolve-alpn: 1.2.1 1302 1345 dev: true 1303 1346 1304 1304 - /iles/0.7.32: 1347 1347 + /iles/0.7.32_sass@1.49.9: 1305 1348 resolution: {integrity: sha512-mXN+Phm2krOBk1jvSxFfRdL3lIVelcoBXuRm7z5W0GLr/0oyzBAtZAfnD/DPY1UnLDcJPCXBH5dDEP/lrzjVpA==} 1306 1349 engines: {node: ^14.18 || >= 16.0.0} 1307 1350 hasBin: true ··· 1325 1368 picocolors: 1.0.0 1326 1369 unist-util-visit: 4.1.0 1327 1370 unplugin-vue-components: /@islands/components/0.17.0_vite@2.8.4+vue@3.2.31 1328 1328 - vite: 2.8.4 1371 1371 + vite: 2.8.4_sass@1.49.9 1329 1372 vue: 3.2.31 1330 1373 vue-router: 4.0.12_vue@3.2.31 1331 1374 xdm: 3.3.1 ··· 1338 1381 - stylus 1339 1382 - supports-color 1340 1383 - webpack 1384 1384 + dev: true 1385 1385 + 1386 1386 + /immutable/4.0.0: 1387 1387 + resolution: {integrity: sha512-zIE9hX70qew5qTUjSS7wi1iwj/l7+m54KWU247nhM3v806UdGj1yDndXj+IOYxxtW9zyLI+xqFNZjTuDaLUqFw==} 1341 1388 dev: true 1342 1389 1343 1390 /import-meta-resolve/1.1.1: ··· 1475 1522 engines: {node: '>=0.12.0'} 1476 1523 dev: true 1477 1524 1525 1525 + /is-plain-obj/3.0.0: 1526 1526 + resolution: {integrity: sha512-gwsOE28k+23GP1B6vFl1oVh/WOzmawBrKwo5Ev6wMKzPkaXaCDIQKzLnvsA42DRlbVTWorkgTKIviAKCWkfUwA==} 1527 1527 + engines: {node: '>=10'} 1528 1528 + dev: true 1529 1529 + 1478 1530 /is-plain-obj/4.0.0: 1479 1531 resolution: {integrity: sha512-NXRbBtUdBioI73y/HmOhogw/U5msYPC9DAtGkJXeFcFWSFZw0mCUsPxk/snTuJHzNKA8kLBK4rH97RMB1BfCXw==} 1480 1532 engines: {node: '>=12'} ··· 2187 2239 engines: {node: '>=8.6'} 2188 2240 dev: true 2189 2241 2242 2242 + /pinia/2.0.11_typescript@4.5.5: 2243 2243 + resolution: {integrity: sha512-JzcmnMqu28PNWOjDgEDK6fTrIzX8eQZKPPKvu/fpHdpXARUj1xeVdFi3YFIMOWswqaBd589cpmAMdSSTryI9iw==} 2244 2244 + peerDependencies: 2245 2245 + '@vue/composition-api': ^1.4.0 2246 2246 + typescript: '>=4.4.4' 2247 2247 + vue: ^2.6.14 || ^3.2.0 2248 2248 + peerDependenciesMeta: 2249 2249 + '@vue/composition-api': 2250 2250 + optional: true 2251 2251 + typescript: 2252 2252 + optional: true 2253 2253 + dependencies: 2254 2254 + '@vue/devtools-api': 6.0.12 2255 2255 + typescript: 4.5.5 2256 2256 + vue-demi: 0.12.1 2257 2257 + dev: false 2258 2258 + 2190 2259 /postcss/8.4.7: 2191 2260 resolution: {integrity: sha512-L9Ye3r6hkkCeOETQX6iOaWZgjp3LL6Lpqm6EtgbKrgqGGteRMNb9vzBfRL96YOSu8o7x3MfIH9Mo5cPJFGrW6A==} 2192 2261 engines: {node: ^10 || ^12 || >=14} ··· 2194 2263 nanoid: 3.3.1 2195 2264 picocolors: 1.0.0 2196 2265 source-map-js: 1.0.2 2266 2266 + dev: true 2267 2267 + 2268 2268 + /prismjs/1.27.0: 2269 2269 + resolution: {integrity: sha512-t13BGPUlFDR7wRB5kQDG4jjl7XeuH6jbJGt11JHPL96qwsEHNX2+68tFXqc1/k+/jALsbSWJKUOT/hcYAZ5LkA==} 2270 2270 + engines: {node: '>=6'} 2197 2271 dev: true 2198 2272 2199 2273 /promise/7.3.1: ··· 2405 2479 mri: 1.2.0 2406 2480 dev: true 2407 2481 2482 2482 + /sass/1.49.9: 2483 2483 + resolution: {integrity: sha512-YlYWkkHP9fbwaFRZQRXgDi3mXZShslVmmo+FVK3kHLUELHHEYrCmL1x6IUjC7wLS6VuJSAFXRQS/DxdsC4xL1A==} 2484 2484 + engines: {node: '>=12.0.0'} 2485 2485 + hasBin: true 2486 2486 + dependencies: 2487 2487 + chokidar: 3.5.3 2488 2488 + immutable: 4.0.0 2489 2489 + source-map-js: 1.0.2 2490 2490 + dev: true 2491 2491 + 2408 2492 /section-matter/1.0.0: 2409 2493 resolution: {integrity: sha512-vfD3pmTzGpufjScBh50YHKzEu2lxBWhVEHsNGoEXmCmn2hKGfeNLYMzCJpe8cD7gqX7TJluOVpBkAequ6dgMmA==} 2410 2494 engines: {node: '>=4'} ··· 2636 2720 webpack: 2637 2721 optional: true 2638 2722 dependencies: 2639 2639 - vite: 2.8.4 2723 2723 + vite: 2.8.4_sass@1.49.9 2640 2724 webpack-virtual-modules: 0.4.3 2641 2725 dev: true 2642 2726 ··· 2672 2756 vfile-message: 3.1.0 2673 2757 dev: true 2674 2758 2675 2675 - /vite/2.8.4: 2759 2759 + /vite/2.8.4_sass@1.49.9: 2676 2760 resolution: {integrity: sha512-GwtOkkaT2LDI82uWZKcrpRQxP5tymLnC7hVHHqNkhFNknYr0hJUlDLfhVRgngJvAy3RwypkDCWtTKn1BjO96Dw==} 2677 2761 engines: {node: '>=12.2.0'} 2678 2762 hasBin: true ··· 2692 2776 postcss: 8.4.7 2693 2777 resolve: 1.22.0 2694 2778 rollup: 2.68.0 2779 2779 + sass: 1.49.9 2695 2780 optionalDependencies: 2696 2781 fsevents: 2.3.2 2697 2782 dev: true 2698 2783 2699 2699 - /vitest/0.5.5: 2784 2784 + /vitest/0.5.5_sass@1.49.9: 2700 2785 resolution: {integrity: sha512-oBKIXpFOGN7jDdK0MO4uWcB+UOPRyEJveB8XDx74XsFNbjGF7vHmHqwAomNE8MGtDW8hBKvSSbr58hibFiQc5Q==} 2701 2786 engines: {node: '>=14.14.0'} 2702 2787 hasBin: true ··· 2721 2806 local-pkg: 0.4.1 2722 2807 tinypool: 0.1.2 2723 2808 tinyspy: 0.3.0 2724 2724 - vite: 2.8.4 2809 2809 + vite: 2.8.4_sass@1.49.9 2725 2810 transitivePeerDependencies: 2726 2811 - less 2727 2812 - sass ··· 2848 2933 vscode-pug-languageservice: 0.29.8 2849 2934 vscode-typescript-languageservice: 0.29.8 2850 2935 dev: true 2936 2936 + 2937 2937 + /vue-demi/0.12.1: 2938 2938 + resolution: {integrity: sha512-QL3ny+wX8c6Xm1/EZylbgzdoDolye+VpCXRhI2hug9dJTP3OUJ3lmiKN3CsVV3mOJKwFi0nsstbgob0vG7aoIw==} 2939 2939 + engines: {node: '>=12'} 2940 2940 + hasBin: true 2941 2941 + requiresBuild: true 2942 2942 + peerDependencies: 2943 2943 + '@vue/composition-api': ^1.0.0-rc.1 2944 2944 + vue: ^3.0.0-0 || ^2.6.0 2945 2945 + peerDependenciesMeta: 2946 2946 + '@vue/composition-api': 2947 2947 + optional: true 2948 2948 + dev: false 2851 2949 2852 2950 /vue-router/4.0.12_vue@3.2.31: 2853 2951 resolution: {integrity: sha512-CPXvfqe+mZLB1kBWssssTiWg4EQERyqJZes7USiqfW9B5N2x+nHlnsM1D3b5CaJ6qgCvMmYJnz+G0iWjNCvXrg==}

public/favicon.ico

reviewed

This is a binary file and will not be displayed.

+7 -2

src/app.ts

reviewed

··· 1 1 - import { defineApp } from 'iles' 1 1 + import { defineApp } from "iles"; 2 2 + import { createPinia } from "pinia"; 2 3 3 3 - export default defineApp({}) 4 4 + export default defineApp({ 5 5 + enhanceApp({ app }) { 6 6 + app.use(createPinia()); 7 7 + }, 8 8 + });

+6 -4

src/assets/base.css

reviewed

··· 1 1 /* color palette from <https://github.com/vuejs/theme> */ 2 2 + @import url("https://fonts.googleapis.com/css2?family=Courier+Prime&family=Fenix&display=swap"); 3 3 + 2 4 :root { 3 5 --vt-c-white: #ffffff; 4 6 --vt-c-white-soft: #f8f8f8; ··· 36 38 --section-gap: 160px; 37 39 } 38 40 39 39 - @media (prefers-color-scheme: dark) { 41 41 + /* @media (prefers-color-scheme: dark) { 40 42 :root { 41 43 --color-background: var(--vt-c-black); 42 44 --color-background-soft: var(--vt-c-black-soft); ··· 48 50 --color-heading: var(--vt-c-text-dark-1); 49 51 --color-text: var(--vt-c-text-dark-2); 50 52 } 51 51 - } 53 53 + } */ 52 54 53 55 *, 54 56 *::before, ··· 65 67 background: var(--color-background); 66 68 transition: color 0.5s, background-color 0.5s; 67 69 line-height: 1.6; 68 68 - font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, 69 69 - Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif; 70 70 + font-family: "Fenix", BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, 71 71 + serif; 70 72 font-size: 15px; 71 73 text-rendering: optimizeLegibility; 72 74 -webkit-font-smoothing: antialiased;

-1

src/assets/logo.svg

reviewed

··· 1 1 - <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="32" height="32" viewBox="0 0 128 128"><path d="M13.8 101.95c-1.95 12.37 16.51 22.5 52.26 22.5s48.99-13.25 48.26-21.41c-.73-8.18-15.6-21.23-52.98-19.96-37.37 1.27-46.45 11.98-47.54 18.87z" fill="#179cf5"/><path d="M26.68 96.9c.35.7 3.96 1.18 5.69 2.85 3.05 2.94 3.39 5.12 7.27 6.3 3.87 1.17 6.99-.81 11.56-.14 4.71.69 6.71 3.6 11.62 3.87 5.63.32 5.66-3.61 12-4.08 6.34-.47 7.21 1.68 12.33.23 5.04-1.43 5.52-4.34 8.22-6.34s4.59-2.48 4.59-2.48-7.65-16.87-30.53-17.95C44.64 78 26.68 96.9 26.68 96.9z" fill="#f6c973"/><path d="M40.24 94.34s5.3.3 10.98-.95 10.92-3.21 11.54-2.02c.56 1.07-4.81 5.19-4.81 5.19s2.5 1.81 8.05 1.22 9.58-2.71 11.56-3.96 5.15-3.18 9.38-4.24 6.7-.69 6.7-.69-5.16-5.42-10.27-6.76c-11.09-2.91-14.11-1.99-21.22.09-11.39 3.33-21.91 12.12-21.91 12.12z" fill="#eda052"/><path d="m71.58 37.18-7.22 4.83s5.74 6.67 7.4 15.87c1.07 5.93 1.91 11.21 1.21 16.24-.29 2.05-2.27 6.19-2.84 7.58-.57 1.39-1.39 4.67 1.15 5.33s10.82.9 12.04.74c1.23-.16 2.68-1.06 2.02-4.03-.41-1.85-1.11-7.61-1.52-11.54-.41-3.93-.66-11.5-4.08-20.79-3.33-9.07-8.16-14.23-8.16-14.23z" fill="#dc8124"/><path d="M78.22 77.07c3.73.21 6.1-.5 6.1-.5l.51 3.78s-2.28.64-6.58.38c-3.75-.23-7.14-1.26-7.14-1.26l1.4-3.57c-.01-.01 1.95.95 5.71 1.17zM73.07 66.82s.07 1.05.11 1.72c.03.67.05 1.7.05 1.7s2.82.33 5.05.24c3.65-.15 5.29-1.02 5.29-1.02s-.07-.81-.17-1.77-.21-1.76-.21-1.76-1.79.88-5.54 1.13c-2.7.16-4.58-.24-4.58-.24zM71.63 57.25s1.71.35 4.9-.34c3.1-.67 4.43-1.85 4.43-1.85s.29.91.46 1.6c.16.65.41 1.6.41 1.6s-1.25 1.23-4.65 1.9c-3.33.66-4.99.21-4.99.21s-.16-.89-.27-1.55c-.12-.77-.29-1.57-.29-1.57z" fill="#c0711f"/><path d="M69.88 51.37s1.58.11 4.65-1.05c2.68-1.01 3.83-2.36 3.83-2.36l-3.77-8.28-9.04 3.28 4.33 8.41z" fill="#a2672b"/><path d="m70.39 41.08 15.24 5.75s.71-2.02 1.06-3.68c.23-1.1.44-3.02.91-2.99.78.06 1.25 1.33 1.28 3.13.03 1.55-.38 4.27-.38 4.27l3.24.99s.73-1.52 1.2-3.45c.49-2.02.18-3.27.69-3.27.87 0 1.51 1.62 1.43 4.1-.06 1.94-.5 3.54-.4 3.61.16.13 1.92.42 3.35.82 1.43.4 2.29.51 2.29.51s2.32-11.02-4.85-15.78c-8.26-5.48-18.6-1.32-18.6-1.32l6.69-5.6s-.37-1.17-1.45-2.89c-.6-.96-1.61-2.05-1.85-2.73-.17-.48 1.28-.64 3.21.52 1.54.93 3.68 2.8 3.72 2.83l1.74-1.27s-.12-1.45-.8-2.69c-.57-1.05-1.21-2.15-.96-2.29.51-.29 2 .1 3.01 1.08.87.85 1.49 2.13 1.49 2.13l5.2-3.32s-3.6-5.65-11.42-5.37c-7.82.29-11.21 4.55-12.52 6.04-1.31 1.48-3.39 4.88-3.39 4.88l.74-9.1s-.47-.62-1.76-1.02c-1.28-.4-2.43-.13-2.45-.3-.09-.62.98-1.69 2.74-1.89 1.03-.12 1.99.04 1.99.04l.84-8.77s-9.55.19-12.58 8.8c-2.6 7.4 2.21 14.19 1.33 14.85-.75.56-6.95-6.24-16.18-4.06-10.13 2.39-12.9 13.08-12.32 13.08 1.55 0 6.27.22 6.55 0 .14-.11.56-1.42 1.48-2.83.92-1.41 3.29-3.47 4.22-3.08.48.2-.18 1.05-.8 2.57-.62 1.57-1.21 3.62-1.21 3.62l4.34-.04s1.48-5.01 3.25-5.38c.76-.16.07 1.24-.12 2.49-.19 1.29-.08 3.01-.08 3.01l6.78.4s-8.51.33-14.18 5.5c-5.87 5.35-6.5 10.79-6.05 15.51.32 3.36 1 5.69 1.32 6.05.25.29 4.51-4.53 4.68-4.93.17-.4-.29-2.78-.29-5.06s.51-3.43.97-3.48c.46-.06.34 1.6.69 3.03.36 1.49.91 2.74 1.14 2.85.23.11 2.77-3.2 2.77-3.2s-.28-1.63-.43-2.93c-.15-1.31.14-2.84.51-3.1.41-.29.6 1.33 1.08 2.61.39 1.02.71 1.58.92 1.85l4.51-4.26s-3.46 6.29-2.93 12.75c.59 7.23 5.02 9.14 5.3 9.09.29-.06 3.52-7.1 3.52-7.1s-1.01-1.24-1.89-2.89c-1.11-2.08-1.05-3.95-.64-4.21.58-.37 1.43 1.94 2.28 2.97.86 1.03 1.43 1.45 1.61 1.45s2.53-4.86 2.53-4.86-.7-.81-1.25-1.65c-.46-.71-.87-1.94-.48-2.67.42-.39.84.62 1.49 1.15.64.53 1.24 1.08 1.24 1.08l5.69-11.95z" fill="#728137"/><path d="M71.59 44.78c.33-.22.98-4.63 1.3-6.83.28-1.99.98-4.95-.53-5.25-1.04-.2-1.47 1.27-1.8 2.84-.3 1.4-.74 3.31-.74 3.31s-1.34-2.57-2.24-4.14c-.65-1.13-2.06-3.52-3.18-2.81-1.29.82.11 3.46.9 4.91.79 1.45 1.68 3.15 1.68 3.15s-2.37-.81-3.75-1.24c-1.51-.47-3.54-.88-3.82-.07-.49 1.42 1.38 2.13 5 3.61 3.6 1.48 6.63 2.88 7.18 2.52z" fill="#bdcf47"/><path d="M61.19 76.63c-2.49.31-4.37 2.4-3.81 5.64s3.89 3.73 5.75 3.42c2.24-.38 4.64-2.89 3.07-6.47-1.05-2.41-3.48-2.78-5.01-2.59z" fill="#a2672b"/><path d="M17.55 100.12c-.76-.6-2.57 2.35.07 5.7.88 1.12 1.58 2.79 3.23 3.96 1.54 1.09 2.66 1.14 4.85 2.76 1.08.8 3.28 1.67 3.86 1.58 1.29-.19 1.52-.33 1.43-.68-.14-.51-1.85-1.12-3.17-2.29-1.41-1.25-2-3.39-3.54-4.56-1.87-1.43-2.75-.83-5.07-3.28-1.08-1.13-1.56-3.11-1.66-3.19zM98.61 113.8c.33.61 5.05-2.66 7.12-3.76 2.07-1.09 5.26-1.41 6.13-5.18.56-2.45-1.28-4.86-1.82-4.8-.55.06-.82 2.35-2.01 3.89-1.64 2.13-3.77 2.49-5.71 4.31-1.55 1.46-4.14 4.75-3.71 5.54z" fill="#0fcaff"/><path d="M24.53 93.38c.59.74-1.58 2.37-1.22 3.71.85 2.49 2.19 1.82 5.53 4.44 3.22 2.51 2.8 3.83 5.29 5.83 2.01 1.62 4.74 2.92 8.81 2.61s5.19-.55 8.11-.19c4.93.62 4.72 2.56 9.88 3.77 2.33.55 4.62-.18 6.87-1.52 2.03-1.21 4.74-2.67 8.69-2.73 3.95-.06 8.99 1.23 13.35-.49 3.56-1.41 4.4-3.64 7.01-6.07 2.61-2.43 5.94-2.66 6.56-4.74.73-2.43-2.37-3.77-2.86-4.31-.49-.55-.43-1.52.67-1.46s6.5 2.25 6.14 6.32c-.28 3.11-2.92 4.19-4.38 4.92-.92.46-3.1 1.52-5.41 4.44-2.31 2.92-3.44 4.65-6.56 5.65-3.52 1.12-7.54 1.03-12.15.79-3.76-.2-6.96.71-9.54 2.01-2.67 1.34-5.85 2.1-8.63 1.64-4.44-.73-6.02-2.98-10.21-3.71-4.01-.97-7.23 1.46-13.73-.67-5.02-1.64-6.44-4.68-7.78-6.2s-2.31-2.98-5.47-4.38c-3.16-1.4-3.77-3.46-3.71-4.8.11-2.31 1.82-3.59 2.49-4.19.67-.6 2.01-.97 2.25-.67z" fill="#76f8ff"/></svg>

-6

src/components/FrameworkLink.vue

reviewed

··· 1 1 - <template> 2 2 - <a target="_blank" href="https://v3.vuejs.org/"> 3 3 - Vue 3 4 4 - <slot /> 5 5 - </a> 6 6 - </template>

-42

src/components/HelloWorld.vue

reviewed

··· 1 1 - <script setup lang="ts"> 2 2 - defineProps<{ 3 3 - msg: String 4 4 - }>() 5 5 - </script> 6 6 - 7 7 - <template> 8 8 - <div class="greetings"> 9 9 - <h1 class="green">{{ msg }}</h1> 10 10 - <h3> 11 11 - You’ve successfully created a project with 12 12 - <a target="_blank" href="https://iles-docs.netlify.app/">îles</a> + 13 13 - <a target="_blank" href="https://vitejs.dev/">Vite</a> + <FrameworkLink client:none />. What's 14 14 - next? 15 15 - </h3> 16 16 - </div> 17 17 - </template> 18 18 - 19 19 - <style scoped> 20 20 - h1 { 21 21 - font-weight: 500; 22 22 - font-size: 2.6rem; 23 23 - top: -10px; 24 24 - } 25 25 - 26 26 - h3 { 27 27 - font-size: 1.2rem; 28 28 - } 29 29 - 30 30 - .greetings h1, 31 31 - .greetings h3 { 32 32 - text-align: center; 33 33 - } 34 34 - 35 35 - @media (min-width: 1024px) { 36 36 - .greetings h1, 37 37 - .greetings h3 { 38 38 - display: block; 39 39 - text-align: left; 40 40 - } 41 41 - } 42 42 - </style>

+23 -1

src/components/Welcome.vue

reviewed

··· 1 1 - <template>Home</template> 1 1 + <script setup lang="ts"> 2 2 + import { usePosts } from "@/hooks/usePosts.hook"; 3 3 + 4 4 + const posts = usePosts(); 5 5 + </script> 6 6 + 7 7 + <template> 8 8 + <h1>Hi! I'm Julien. A mobile & web developer.</h1> 9 9 + <p> 10 10 + I am into building things with code. I love creating offline first 11 11 + Progressive Web Apps. I've been doing programmation for 5 years and lead 12 12 + dev/technical architecture for 1 year now. 13 13 + </p> 14 14 + 15 15 + <section> 16 16 + <h2>My blog posts</h2> 17 17 + <ul> 18 18 + <li v-for="post in posts" :key="post.href"> 19 19 + <a :href="post.href">{{ post.title }}</a> 20 20 + </li> 21 21 + </ul> 22 22 + </section> 23 23 + </template>

+26

src/components/flow/ProductionFlow.vue

reviewed

··· 1 1 + <script setup lang="ts"> 2 2 + import { useProductionFlow } from "@/modules/flow/store/useProductionFlow.store"; 3 3 + import AddFlow from "@/modules/flow/components/AddFlow.vue"; 4 4 + 5 5 + const store = useProductionFlow(); 6 6 + </script> 7 7 + 8 8 + <template> 9 9 + <section class="production-flow"> 10 10 + <add-flow /> 11 11 + <ul> 12 12 + <li :key="step.name" v-for="step in store.$state.steps"> 13 13 + {{ step.name }} 14 14 + </li> 15 15 + </ul> 16 16 + </section> 17 17 + </template> 18 18 + 19 19 + <style scoped lang="scss"> 20 20 + .production-flow { 21 21 + ul { 22 22 + display: flex; 23 23 + justify-content: space-around; 24 24 + } 25 25 + } 26 26 + </style>

+35

src/hooks/usePosts.hook.ts

reviewed

··· 1 1 + import { computed } from "vue"; 2 2 + 3 3 + interface Post { 4 4 + filename: string; 5 5 + lastUpdated: Date; 6 6 + href: string; 7 7 + title: string; 8 8 + meta: { 9 9 + filename: string; 10 10 + lastUpdated: Date; 11 11 + href: string; 12 12 + }; 13 13 + frontmatter: { 14 14 + title: string; 15 15 + publishedAt?: Date; 16 16 + }; 17 17 + } 18 18 + 19 19 + const byDate = (a: Post, b: Post) => { 20 20 + if (!b.frontmatter.publishedAt) { 21 21 + return -1; 22 22 + } 23 23 + 24 24 + if (!a.frontmatter.publishedAt) { 25 25 + return 1; 26 26 + } 27 27 + 28 28 + return a.frontmatter.publishedAt <= b.frontmatter.publishedAt ? -1 : 1; 29 29 + }; 30 30 + 31 31 + export const usePosts = () => { 32 32 + const posts = $(useDocuments<Post>("@/pages/posts")); 33 33 + 34 34 + return computed(() => posts.sort(byDate)); 35 35 + };

+7 -17

src/layouts/default.vue

reviewed

··· 1 1 <template> 2 2 - <div> 2 2 + <div class="default"> 3 3 <header> 4 4 <div class="wrapper"> 5 5 <div id="nav"> ··· 14 14 </template> 15 15 16 16 <style> 17 17 - @import "~/assets/base.css"; 18 18 - 19 19 - .logo { 20 20 - display: block; 21 21 - margin: 0 auto 2rem; 22 22 - } 23 23 - 24 24 - #nav a.router-link-exact-active { 25 25 - color: var(--color-text); 26 26 - } 17 17 + @import "@/assets/base.css"; 27 18 28 28 - #nav a.router-link-exact-active:hover { 29 29 - background-color: transparent; 30 30 - } 19 19 + /* #nav a.router-link-exact-active { 20 20 + background-color: var(--color-text); 21 21 + } */ 31 22 32 23 #nav a { 33 24 display: inline-block; 34 25 padding: 0 1rem; 35 35 - border-left: 1px solid var(--color-border); 36 26 } 37 27 38 38 - #nav a:first-of-type { 39 39 - border: 0; 28 28 + .default { 29 29 + padding: 0 1rem; 40 30 } 41 31 </style>

+23

src/modules/flow/components/AddFlow.vue

reviewed

··· 1 1 + <script setup lang="ts"> 2 2 + import { useProductionFlow } from "@/modules/flow/store/useProductionFlow.store"; 3 3 + 4 4 + const store = useProductionFlow(); 5 5 + const addStep = () => { 6 6 + store.addStep({ 7 7 + name: "Recette", 8 8 + outputs: ["Go production"], 9 9 + prerequisites: ["app in staging"], 10 10 + }); 11 11 + }; 12 12 + </script> 13 13 + 14 14 + <template> 15 15 + <form class="add-flow" @submit.prevent> 16 16 + <button @click="addStep">Add a step</button> 17 17 + </form> 18 18 + </template> 19 19 + 20 20 + <style scoped> 21 21 + .add-flow { 22 22 + } 23 23 + </style>

+10

src/modules/flow/components/FlowStep.vue

reviewed

··· 1 1 + <script setup lang="ts"></script> 2 2 + 3 3 + <template> 4 4 + <div class="flow-step"></div> 5 5 + </template> 6 6 + 7 7 + <style scoped> 8 8 + .flow-step { 9 9 + } 10 10 + </style>

+30

src/modules/flow/store/useProductionFlow.store.ts

reviewed

··· 1 1 + import { defineStore } from "pinia"; 2 2 + 3 3 + interface Step { 4 4 + name: string; 5 5 + prerequisites: string[]; 6 6 + outputs: string[]; 7 7 + } 8 8 + 9 9 + interface State { 10 10 + steps: Step[]; 11 11 + } 12 12 + 13 13 + const initialState: State = { 14 14 + steps: [ 15 15 + { 16 16 + name: "In production", 17 17 + prerequisites: [], 18 18 + outputs: ["Users can use the app"], 19 19 + }, 20 20 + ], 21 21 + }; 22 22 + 23 23 + export const useProductionFlow = defineStore("production-flow", { 24 24 + state: () => ({ ...initialState }), 25 25 + actions: { 26 26 + addStep(step: Step) { 27 27 + this.$state.steps = [step, ...this.$state.steps]; 28 28 + }, 29 29 + }, 30 30 + });

+1 -1

src/pages/index.mdx

reviewed

··· 1 1 --- 2 2 - title: Julien Calixte 2 2 + title: Hi! 3 3 --- 4 4 5 5 <main>

+24

src/pages/posts/production-flow.mdx

reviewed

··· 1 1 + --- 2 2 + title: An introduction to production flow 3 3 + --- 4 4 + 5 5 + # {title} 6 6 + 7 7 + Dear developers, how clear is it for you the way you build an app? 8 8 + 9 9 + You may answer "Easy! There are few steps:" 10 10 + 11 11 + 1. Talking to the client 12 12 + 2. Getting the design 13 13 + 3. Coding 14 14 + 4. deploying to users 15 15 + 16 16 + But how exactly? What does "talking to the client" really mean? And "coding" ? 17 17 + 18 18 + In lean, one particular important concept is **Visual Management**: *doing by seeing*. For that, we want to be clear on how we work. 19 19 + 20 20 + May I ask you some questions? 21 21 + 22 22 + First, can you name your different step before having your app in production? 23 23 + 24 24 + <ProductionFlow />

+3 -3

src/site.ts

reviewed

··· 1 1 export default { 2 2 - title: 'îles', 3 3 - description: 'Islands of interactivity with Vue in Vite.js' 4 4 - } 2 2 + title: "Julien Calixte", 3 3 + description: `Julien Calixte's blog`, 4 4 + };

+1 -2

tsconfig.json

reviewed

··· 12 12 "resolveJsonModule": true, 13 13 "esModuleInterop": true, 14 14 "paths": { 15 15 - "@/*": ["src/*"], 16 16 - "~/*": ["src/*"] 15 15 + "@/*": ["src/*"] 17 16 }, 18 17 "lib": ["esnext", "dom", "dom.iterable", "scripthost"], 19 18 "skipLibCheck": true