[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"navigation":3,"url-settings":80,"blog-\u002Fblog\u002Fvs-code-snippets-guide":589,"blog-author-\u002Fblog\u002Fvs-code-snippets-guide":1226},{"id":4,"extension":5,"footer":6,"header":66,"meta":77,"stem":78,"__hash__":79},"navigation\u002Fdata\u002Fshared\u002Fnavigation.yml","yml",{"brand":7,"columns":10,"legal":56},{"name":8,"tagline":9},"Pieces","The memory layer for modern work.",[11,26,41],{"title":12,"links":13},"Product",[14,17,21,24],{"label":15,"href":16},"Pieces Desktop","\u002Fdownloads",{"label":18,"href":19,"external":20},"Pieces MCP","url:docs.mcp.overview",true,{"label":22,"href":23,"external":20},"Pieces APIs","url:docs.api",{"label":25,"href":16},"Downloads",{"title":27,"links":28},"Resources",[29,32,35,38],{"label":30,"href":31,"external":20},"Documentation","url:docs.home",{"label":33,"href":34},"Blog","\u002Fblog",{"label":36,"href":37},"Changelog","\u002Fchangelog",{"label":39,"href":40,"external":20},"GitHub","url:github.org",{"title":42,"links":43},"Company",[44,47,50,53],{"label":45,"href":46},"About","\u002Fabout",{"label":48,"href":49},"Enterprise","\u002Fenterprise",{"label":51,"href":52,"external":20},"Discord","url:social.discord",{"label":54,"href":55,"external":20},"X \u002F Twitter","url:social.x",[57,60,63],{"label":58,"href":59,"external":20},"Privacy Policy","url:legal.privacyPolicy",{"label":61,"href":62,"external":20},"Refund Policy","url:legal.refundPolicy",{"label":64,"href":65,"external":20},"Terms of Service","url:legal.terms",{"links":67,"signIn":68,"contact":71,"cta":74},[],{"label":69,"href":70},"Sign in","url:portal.home",{"label":72,"href":73},"Contact sales","url:site.contact",{"label":75,"href":76},"Download","url:routes.downloads",{},"data\u002Fshared\u002Fnavigation","Ia8tCWWqcGvuaIro8jwZ3HH-MwI66yqJpWshASJdYQ0",{"id":81,"extension":5,"links":82,"meta":586,"stem":587,"__hash__":588},"urlSettings\u002Fdata\u002Fshared\u002Furls.yml",[83,87,91,95,99,103,107,111,115,119,123,127,131,135,139,143,147,151,155,159,163,167,171,175,179,183,187,191,195,199,203,207,211,215,219,223,227,231,235,238,242,246,249,253,257,261,265,269,273,277,281,285,289,293,297,301,305,309,313,317,321,325,329,333,337,341,345,349,353,357,361,365,369,373,377,381,385,389,393,396,400,404,408,412,416,420,423,426,429,432,436,440,444,448,452,456,460,464,468,472,476,480,484,488,492,495,499,503,507,511,515,519,523,527,531,534,538,542,546,550,553,557,561,565,568,571,575,579,582],{"key":84,"label":85,"href":86},"downloads.desktop","Desktop download page","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fdesktop\u002Fdownload",{"key":88,"label":89,"href":90},"downloads.macOS.dmgArm64","macOS DMG Apple Silicon","https:\u002F\u002Fbuilds.pieces.app\u002Fstages\u002Fproduction\u002Fpieces_for_x\u002Fdmg-arm64\u002Fdownload",{"key":92,"label":93,"href":94},"downloads.macOS.dmgIntel","macOS DMG Intel","https:\u002F\u002Fbuilds.pieces.app\u002Fstages\u002Fproduction\u002Fpieces_for_x\u002Fdmg\u002Fdownload",{"key":96,"label":97,"href":98},"downloads.macOS.pkg","macOS PKG","https:\u002F\u002Fbuilds.pieces.app\u002Fstages\u002Fproduction\u002Fmacos_packaging\u002Fpkg\u002Fdownload",{"key":100,"label":101,"href":102},"downloads.windows.appinstaller","Windows App Installer","https:\u002F\u002Fbuilds.pieces.app\u002Fstages\u002Fproduction\u002Fappinstaller\u002Fpieces_for_x.appinstaller",{"key":104,"label":105,"href":106},"downloads.windows.exe","Windows EXE","https:\u002F\u002Fbuilds.pieces.app\u002Fstages\u002Fproduction\u002Fpieces_for_x\u002Fwindows-exe\u002Fdownload",{"key":108,"label":109,"href":110},"downloads.windows.suiteManager","Windows Suite Manager","https:\u002F\u002Fbuilds.pieces.app\u002Fstages\u002Fproduction\u002Fpieces_suite_windows\u002Fappinstaller\u002Fdownload",{"key":112,"label":113,"href":114},"downloads.linux.flatpakRepo","Linux Flatpak repository","https:\u002F\u002Fbuilds.pieces.app\u002Fpieces-flatpak-repo\u002Fpieces-flatpak.flatpakrepo",{"key":116,"label":117,"href":118},"downloads.linux.snapDesktop","Linux Snap Desktop","https:\u002F\u002Fsnapcraft.io\u002Fpieces-for-developers",{"key":120,"label":121,"href":122},"downloads.linux.snapPiecesOS","Linux Snap PiecesOS","https:\u002F\u002Fsnapcraft.io\u002Fpieces-os",{"key":124,"label":125,"href":126},"downloads.piecesOS.macOS.dmgArm64","PiecesOS macOS DMG Apple Silicon","https:\u002F\u002Fbuilds.pieces.app\u002Fstages\u002Fproduction\u002Fos_server\u002Fdmg-arm64\u002Fdownload",{"key":128,"label":129,"href":130},"downloads.piecesOS.macOS.dmgIntel","PiecesOS macOS DMG Intel","https:\u002F\u002Fbuilds.pieces.app\u002Fstages\u002Fproduction\u002Fos_server\u002Fdmg\u002Fdownload",{"key":132,"label":133,"href":134},"downloads.piecesOS.windows.appinstaller","PiecesOS Windows App Installer","https:\u002F\u002Fbuilds.pieces.app\u002Fstages\u002Fproduction\u002Fappinstaller\u002Fos_server.appinstaller",{"key":136,"label":137,"href":138},"downloads.piecesOS.windows.exe","PiecesOS Windows EXE","https:\u002F\u002Fbuilds.pieces.app\u002Fstages\u002Fproduction\u002Fos_server\u002Fwindows-exe\u002Fdownload",{"key":140,"label":141,"href":142},"downloads.guides.macOS","macOS installation guide","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fmeet-pieces\u002Fmacos-installation-guide",{"key":144,"label":145,"href":146},"downloads.guides.windows","Windows installation guide","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fmeet-pieces\u002Fwindows-installation-guide",{"key":148,"label":149,"href":150},"downloads.guides.linux","Linux installation guide","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fmeet-pieces\u002Flinux-installation-guide",{"key":152,"label":153,"href":154},"downloads.guides.piecesOS","PiecesOS manual installation","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fcore-dependencies\u002Fpieces-os\u002Fmanual-installation",{"key":156,"label":157,"href":158},"extensions.chrome","Chrome extension","https:\u002F\u002Fchrome.google.com\u002Fwebstore\u002Fdetail\u002Fpieces-save-code-snippets\u002Figbgibhbfonhmjlechmeefimncpekepm",{"key":160,"label":161,"href":162},"extensions.firefox","Firefox add-on","https:\u002F\u002Faddons.mozilla.org\u002Fen-US\u002Ffirefox\u002Faddon\u002Fpieces-save-code-from-the-web\u002F",{"key":164,"label":165,"href":166},"extensions.edge","Edge add-on","https:\u002F\u002Fmicrosoftedge.microsoft.com\u002Faddons\u002Fdetail\u002Fpieces-save-code-snippet\u002Fhglfimcdgonaeeobjckfdabcldfidmim",{"key":168,"label":169,"href":170},"extensions.vscode","VS Code extension","https:\u002F\u002Fmarketplace.visualstudio.com\u002Fitems?itemName=MeshIntelligentTechnologiesInc.pieces-vscode",{"key":172,"label":173,"href":174},"extensions.visualStudio","Visual Studio extension","https:\u002F\u002Fmarketplace.visualstudio.com\u002Fitems?itemName=MeshIntelligentTechnologiesInc.PiecesVisualStudio",{"key":176,"label":177,"href":178},"extensions.jetbrains","JetBrains plugin","https:\u002F\u002Fplugins.jetbrains.com\u002Fplugin\u002F17328-pieces--save-search-share--reuse-code-snippets",{"key":180,"label":181,"href":182},"extensions.obsidian","Obsidian plugin","https:\u002F\u002Fobsidian.md\u002Fplugins?id=pieces-for-developers",{"key":184,"label":185,"href":186},"extensions.sublime","Sublime package","https:\u002F\u002Fpackagecontrol.io\u002Fpackages\u002FPieces",{"key":188,"label":189,"href":190},"extensions.neovim","Neovim plugin","https:\u002F\u002Fgithub.com\u002Fpieces-app\u002Fplugin_neo_vim",{"key":192,"label":193,"href":194},"extensions.jupyterlab","JupyterLab plugin","https:\u002F\u002Fgithub.com\u002Fpieces-app\u002Fjupyterlab-pieces",{"key":196,"label":197,"href":198},"extensions.cli","Pieces CLI","https:\u002F\u002Fpypi.org\u002Fproject\u002Fpieces-cli\u002F",{"key":200,"label":201,"href":202},"docs.home","Documentation home","https:\u002F\u002Fdocs.pieces.app",{"key":204,"label":205,"href":206},"docs.getStarted","Get started docs","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fmeet-pieces",{"key":208,"label":209,"href":210},"docs.api","API docs","https:\u002F\u002Fdocs.pieces.app\u002Fapi",{"key":212,"label":213,"href":214},"docs.desktop.overview","Desktop overview","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fdesktop",{"key":216,"label":217,"href":218},"docs.desktop.onboarding","Desktop onboarding","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fdesktop\u002Fonboarding",{"key":220,"label":221,"href":222},"docs.desktop.timeline","Desktop timeline docs","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fdesktop\u002Ftimeline",{"key":224,"label":225,"href":226},"docs.desktop.summaries","Desktop summaries docs","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fdesktop\u002Fsingle-click-summaries",{"key":228,"label":229,"href":230},"docs.desktop.search","Desktop conversational search docs","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fdesktop\u002Fconversational-search",{"key":232,"label":233,"href":234},"docs.desktop.drive","Desktop drive docs","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fdesktop\u002Fdrive",{"key":236,"label":237,"href":86},"docs.desktop.download","Desktop download docs",{"key":239,"label":240,"href":241},"docs.piecesOS.overview","PiecesOS overview docs","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fcore-dependencies",{"key":243,"label":244,"href":245},"docs.piecesOS.details","PiecesOS details docs","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fcore-dependencies\u002Fpieces-os",{"key":247,"label":248,"href":154},"docs.piecesOS.install","PiecesOS install docs",{"key":250,"label":251,"href":252},"docs.piecesOS.quickMenu","PiecesOS quick menu docs","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fcore-dependencies\u002Fpieces-os\u002Fquick-menu",{"key":254,"label":255,"href":256},"docs.piecesOS.storage","On-device storage docs","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fcore-dependencies\u002Fon-device-storage",{"key":258,"label":259,"href":260},"docs.piecesOS.troubleshooting","PiecesOS troubleshooting docs","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fcore-dependencies\u002Fpieces-os\u002Ftroubleshooting",{"key":262,"label":263,"href":264},"docs.mcp.overview","MCP overview docs","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fmcp",{"key":266,"label":267,"href":268},"docs.mcp.cursor","MCP Cursor docs","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fmcp\u002Fcursor",{"key":270,"label":271,"href":272},"docs.mcp.vscode","MCP VS Code docs","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fmcp\u002Fvs-code",{"key":274,"label":275,"href":276},"docs.mcp.claudeDesktop","MCP Claude Desktop docs","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fmcp\u002Fclaude-desktop",{"key":278,"label":279,"href":280},"docs.mcp.claudeCode","MCP Claude Code docs","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fmcp\u002Fclaude-code",{"key":282,"label":283,"href":284},"docs.mcp.claudeCowork","MCP Claude Cowork docs","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fmcp\u002Fclaude-cowork",{"key":286,"label":287,"href":288},"docs.mcp.githubCopilot","MCP GitHub Copilot docs","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fmcp\u002Fgithub-copilot",{"key":290,"label":291,"href":292},"docs.mcp.goose","MCP Goose docs","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fmcp\u002Fgoose",{"key":294,"label":295,"href":296},"docs.mcp.windsurf","MCP Windsurf docs","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fmcp\u002Fwindsurf",{"key":298,"label":299,"href":300},"docs.mcp.zed","MCP Zed docs","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fmcp\u002Fzed",{"key":302,"label":303,"href":304},"docs.mcp.jetbrains","MCP JetBrains docs","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fmcp\u002Fjetbrains-ides",{"key":306,"label":307,"href":308},"docs.mcp.continueDev","MCP Continue docs","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fmcp\u002Fcontinue-dev",{"key":310,"label":311,"href":312},"docs.mcp.cline","MCP Cline docs","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fmcp\u002Fcline",{"key":314,"label":315,"href":316},"docs.mcp.raycast","MCP Raycast docs","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fmcp\u002Fraycast",{"key":318,"label":319,"href":320},"docs.mcp.rovoDevCli","MCP Rovo Dev CLI docs","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fmcp\u002Frovo-dev-cli",{"key":322,"label":323,"href":324},"docs.mcp.openaiCodexCli","MCP OpenAI Codex CLI docs","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fmcp\u002Fopenai-codex-cli",{"key":326,"label":327,"href":328},"docs.mcp.googleGeminiCli","MCP Google Gemini CLI docs","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fmcp\u002Fgoogle-gemini-cli",{"key":330,"label":331,"href":332},"docs.mcp.amazonQ","MCP Amazon Q docs","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fmcp\u002Famazon-q-developer",{"key":334,"label":335,"href":336},"docs.mcp.chatgptDev","MCP ChatGPT Developer Mode docs","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fmcp\u002Fchatgpt-developer-mode",{"key":338,"label":339,"href":340},"docs.mcp.openclaw","MCP OpenClaw docs","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fmcp\u002Fopenclaw",{"key":342,"label":343,"href":344},"docs.mcp.mcpRemote","MCP Remote docs","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fmcp\u002Fmcp-remote",{"key":346,"label":347,"href":348},"docs.mcp.ngrok","MCP ngrok docs","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fmcp\u002Fngrok-setup",{"key":350,"label":351,"href":352},"docs.troubleshooting.macOS","macOS troubleshooting docs","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fmeet-pieces\u002Ftroubleshooting\u002Fmacos",{"key":354,"label":355,"href":356},"docs.troubleshooting.windows","Windows troubleshooting docs","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fmeet-pieces\u002Ftroubleshooting\u002Fwindows",{"key":358,"label":359,"href":360},"docs.troubleshooting.linux","Linux troubleshooting docs","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fmeet-pieces\u002Ftroubleshooting\u002Flinux",{"key":362,"label":363,"href":364},"docs.privacy","Privacy and security docs","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fprivacy-security-your-data",{"key":366,"label":367,"href":368},"docs.support","Support docs","https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fsupport",{"key":370,"label":371,"href":372},"portal.home","Pieces portal","https:\u002F\u002Fportal.pieces.app",{"key":374,"label":375,"href":376},"site.home","Website home","https:\u002F\u002Fpieces.app",{"key":378,"label":379,"href":380},"site.about","About page","https:\u002F\u002Fpieces.app\u002Fabout",{"key":382,"label":383,"href":384},"site.features","Features page","https:\u002F\u002Fpieces.app\u002Ffeatures",{"key":386,"label":387,"href":388},"site.plugins","Plugins page","https:\u002F\u002Fpieces.app\u002Fplugins",{"key":390,"label":391,"href":392},"site.contact","Contact page","https:\u002F\u002Fpieces.app\u002Fcontact",{"key":394,"label":36,"href":395},"site.changelog","https:\u002F\u002Fpieces.app\u002Fchangelog",{"key":397,"label":398,"href":399},"site.news","News","https:\u002F\u002Fpieces.app\u002Fnews",{"key":401,"label":402,"href":403},"site.events","Community events","https:\u002F\u002Fpieces.app\u002Fcommunity\u002Fevents",{"key":405,"label":406,"href":407},"site.userStories","User stories","https:\u002F\u002Fpieces.app\u002Fuser-stories",{"key":409,"label":410,"href":411},"site.academy","Academy","https:\u002F\u002Fpieces.app\u002Flearn\u002Facademy",{"key":413,"label":414,"href":415},"site.support","Website support","https:\u002F\u002Fpieces.app\u002Fsupport",{"key":417,"label":418,"href":419},"site.standup","Standup","https:\u002F\u002Fpieces.app\u002Fstandup",{"key":421,"label":33,"href":422},"site.blog","https:\u002F\u002Fcode.pieces.app\u002Fblog",{"key":424,"label":51,"href":425},"social.discord","https:\u002F\u002Fdiscord.gg\u002Fgetpieces",{"key":427,"label":54,"href":428},"social.x","https:\u002F\u002Fx.com\u002Fgetpieces",{"key":430,"label":431,"href":428},"social.twitter","Twitter",{"key":433,"label":434,"href":435},"social.instagram","Instagram","https:\u002F\u002Fwww.instagram.com\u002Fgetpieces\u002F",{"key":437,"label":438,"href":439},"social.tiktok","TikTok","https:\u002F\u002Fwww.tiktok.com\u002F@getpieces",{"key":441,"label":442,"href":443},"social.linkedin","LinkedIn","https:\u002F\u002Fwww.linkedin.com\u002Fcompany\u002Fgetpieces\u002F",{"key":445,"label":446,"href":447},"social.youtube","YouTube","https:\u002F\u002Fyoutube.com\u002F@getpieces",{"key":449,"label":450,"href":451},"github.org","GitHub organization","https:\u002F\u002Fgithub.com\u002Fpieces-app",{"key":453,"label":454,"href":455},"github.support","GitHub support","https:\u002F\u002Fgithub.com\u002Fpieces-app\u002Fsupport",{"key":457,"label":458,"href":459},"github.issues","GitHub issues","https:\u002F\u002Fgithub.com\u002Fpieces-app\u002Fsupport\u002Fissues",{"key":461,"label":462,"href":463},"github.discussions","GitHub discussions","https:\u002F\u002Fgithub.com\u002Fpieces-app\u002Fsupport\u002Fdiscussions",{"key":465,"label":466,"href":467},"github.documentation","GitHub documentation","https:\u002F\u002Fgithub.com\u002Fpieces-app\u002Fdocumentation",{"key":469,"label":470,"href":471},"github.opensource","GitHub open source","https:\u002F\u002Fgithub.com\u002Fpieces-app\u002Fopensource",{"key":473,"label":474,"href":475},"github.sdks.python","Python SDK","https:\u002F\u002Fgithub.com\u002Fpieces-app\u002Fpieces-os-client-sdk-for-python",{"key":477,"label":478,"href":479},"github.sdks.typescript","TypeScript SDK","https:\u002F\u002Fgithub.com\u002Fpieces-app\u002Fpieces-os-client-sdk-for-typescript",{"key":481,"label":482,"href":483},"github.sdks.dart","Dart SDK","https:\u002F\u002Fgithub.com\u002Fpieces-app\u002Fpieces-os-client-sdk-for-dart",{"key":485,"label":486,"href":487},"github.sdks.kotlin","Kotlin SDK","https:\u002F\u002Fgithub.com\u002Fpieces-app\u002Fpieces-os-client-sdk-for-kotlin",{"key":489,"label":490,"href":491},"github.plugins.obsidian","Obsidian plugin repository","https:\u002F\u002Fgithub.com\u002Fpieces-app\u002Fobsidian-pieces",{"key":493,"label":494,"href":194},"github.plugins.jupyterlab","JupyterLab plugin repository",{"key":496,"label":497,"href":498},"github.plugins.sublime","Sublime plugin repository","https:\u002F\u002Fgithub.com\u002Fpieces-app\u002Fplugin_sublime",{"key":500,"label":501,"href":502},"github.plugins.neovim","Neovim plugin repository","https:\u002F\u002Fgithub.com\u002Fpieces-app\u002Fplugin_neovim",{"key":504,"label":505,"href":506},"github.cliAgent","CLI agent repository","https:\u002F\u002Fgithub.com\u002Fpieces-app\u002Fcli-agent",{"key":508,"label":509,"href":510},"github.mcpDart","MCP Dart repository","https:\u002F\u002Fgithub.com\u002Fpieces-app\u002Fmcp_dart",{"key":512,"label":513,"href":514},"github.awesomePieces","Awesome Pieces repository","https:\u002F\u002Fgithub.com\u002Fpieces-app\u002Fawesome-pieces",{"key":516,"label":517,"href":518},"legal.privacyPolicy","Privacy policy","https:\u002F\u002Fpieces.app\u002Flegal\u002Fprivacy-policy",{"key":520,"label":521,"href":522},"legal.refundPolicy","Refund policy","https:\u002F\u002Fpieces.app\u002Flegal\u002Frefund-policy",{"key":524,"label":525,"href":526},"legal.terms","Terms","https:\u002F\u002Fpieces.app\u002Flegal\u002Fterms",{"key":528,"label":529,"href":530},"legal.security","Legal security","https:\u002F\u002Fpieces.app\u002Flegal\u002Fsecurity",{"key":532,"label":533,"href":447},"videos.youtubeChannel","YouTube channel",{"key":535,"label":536,"href":537},"videos.gettingStartedDesktop","Getting started desktop video","https:\u002F\u002Fyoutu.be\u002FdUr1lRM_TYk",{"key":539,"label":540,"href":541},"videos.snippetDiscovery","Snippet discovery video","https:\u002F\u002Fyoutu.be\u002FG6vb1USw-30",{"key":543,"label":544,"href":545},"sales.bookACall","Book a sales call","https:\u002F\u002Fcalendar.app.google\u002FWVUDtUfNy5Vst3sH7",{"key":547,"label":548,"href":549},"sales.enterprise","Enterprise form","https:\u002F\u002Fgetpieces.typeform.com\u002Fto\u002FaVQFTvpE",{"key":551,"label":552,"href":463},"sales.feedback","Feedback discussions",{"key":554,"label":555,"href":556},"sales.earlyAccess","Early access form","https:\u002F\u002Fgetpieces.typeform.com\u002Fearlyaccess",{"key":558,"label":559,"href":560},"sales.supportEmail","Support email","mailto:support@pieces.app",{"key":562,"label":563,"href":564},"routes.home","Home route","\u002F",{"key":566,"label":567,"href":46},"routes.about","About route",{"key":569,"label":570,"href":16},"routes.downloads","Downloads route",{"key":572,"label":573,"href":574},"routes.pricing","Pricing route","\u002Fpricing",{"key":576,"label":577,"href":578},"routes.security","Security route","\u002Fsecurity",{"key":580,"label":581,"href":49},"routes.enterprise","Enterprise route",{"key":583,"label":584,"href":585},"routes.thankYou","Thank you \u002F download route","\u002Fthank-you",{},"data\u002Fshared\u002Furls","P27xKEauu8D-8sfyr0wR4giF0teFSaCuAQ8kgcICQdI",{"id":590,"title":591,"author":592,"authorPhoto":593,"authorPhotoAlt":594,"authorSlug":595,"body":596,"buttonText":1212,"buttonUrl":206,"category":1213,"date":1214,"description":1215,"draft":1216,"editorsPick":1216,"extension":1217,"featured":1216,"image":1218,"imageAlt":1219,"meta":1220,"navigation":20,"ogImage":1221,"ogImageAlt":1221,"path":1222,"seo":1223,"stem":1224,"tags":1221,"__hash__":1225},"blog\u002Fblog\u002Fvs-code-snippets-guide.md","The ultimate guide to VS Code snippets (all ways gathered)","Emmanuel Isenah","https:\u002F\u002Fstorage.googleapis.com\u002Fpieces-marketing-website\u002Fimages\u002Fblog\u002Fbest-bug-tracking-software\u002Fauthor.jpg","Victor Ikechukwu.","emmanuel-isenah",{"type":597,"value":598,"toc":1196},"minimark",[599,603,606,609,614,617,620,633,637,640,656,659,663,666,669,672,677,680,683,694,705,708,715,719,722,733,757,760,767,773,780,783,789,793,796,799,837,846,849,853,856,859,863,866,873,884,890,893,896,900,907,914,917,923,926,929,932,936,939,942,946,955,961,1186,1192],[600,601,602],"p",{},"Ever wrote the same lines of code over and over again? Be it loops, function definitions, or classes?",[600,604,605],{},"Well, if you have, you would know how much of a drag and time-wasting it can be. Fortunately, this can be solved through the use of code snippets.",[600,607,608],{},"In this article, we’ll explore what code snippets are, how to create and add them in VS Code, and how Pieces makes managing and sharing your snippets super easy.",[610,611,613],"h2",{"id":612},"summary-of-code-snippets","Summary of code snippets",[600,615,616],{},"Code snippets are pieces of templates that can be inserted in a document by a command or a trigger text. With snippets, you can quickly insert chunks of reusable code into your codebase, eliminating the need to manually type out common code patterns repeatedly.",[600,618,619],{},"If the benefits aren't yet clear, here are a few specific reasons code snippets can be helpful to your development workflow:",[621,622,623,627,630],"ul",{},[624,625,626],"li",{},"You can quickly insert large blocks of code, eliminating the need to manually type out the code repeatedly. With snippets, you save yourself from unnecessary amounts of keystrokes and don't have to spend time on writing boilerplate code.",[624,628,629],{},"We're all human, and we all make mistakes. When you type the same lines of code repeatedly, you're bound to make a mistake at least once at some point in time. Snippets provides a method to output pieces of code with 100% consistency.",[624,631,632],{},"Typing the same lines of code can make your software development workflow feel dull and mundane. Using code snippets helps to eliminate repetitive tasks, freeing up your mental resources to focus on writing enjoyable code that actually interests you.",[610,634,636],{"id":635},"classification-of-snippets","Classification of snippets",[600,638,639],{},"When people talk of snippets in general, they usually mean one of two types:",[641,642,643,650],"ol",{},[624,644,645,649],{},[646,647,648],"strong",{},"Static snippets:"," These live as plain text and are inserted exactly as written. They can't be interpolated or transformed.",[624,651,652,655],{},[646,653,654],{},"Dynamic snippets:"," They're written in specific configuration formats like JSON or YAML. They support inserting dynamic elements during usage, including tab stops, variables, placeholders, choices, and, in some editors, interpolated shell code (though VS Code doesn't support this).",[600,657,658],{},"This distinction is important, as you'll see in the coming section how different tools handle different types of snippets.",[610,660,662],{"id":661},"how-to-create-code-snippets-in-vs-code","How to create code snippets in VS Code",[600,664,665],{},"Now that you’re aware of the classification and benefits code snippets provide to developers, let’s take a look at how you can create and use VS Code user snippets.",[600,667,668],{},"Most code editors and IDEs have out-of-the-box support for code snippets, and VS Code is no exception.",[600,670,671],{},"Follow the steps in the tutorial below to get started.",[673,674,676],"h3",{"id":675},"step-1-create-a-snippet-file","Step 1: Create a snippet file",[600,678,679],{},"VS Code snippets are written in JavaScript Object Notation (JSON) files that can define an unlimited number of snippets.",[600,681,682],{},"To create a snippet, start by opening the command palette.",[600,684,685,686,689,690,693],{},"Depending on your operating system (OS), you can do that using the command ",[646,687,688],{},"Ctrl+Shift+P"," on Windows or ",[646,691,692],{},"CMD+Shift+P"," on a Mac.",[600,695,696,697,701,702],{},"Type the word ",[698,699,700],"code",{},"snippet"," into the search bar and toggle the Preferences: ",[698,703,704],{},"Configure User Snippets option.",[600,706,707],{},"This will present you with a drop-down of different languages and selections to choose from:",[600,709,710],{},[711,712],"img",{"alt":713,"src":714},"The language drop-down to select the code snippet scope.","https:\u002F\u002Fstorage.googleapis.com\u002Fpieces-marketing-website\u002Fimages\u002Fblog\u002Fvs-code-snippets-guide\u002Fimg-001.gif",[673,716,718],{"id":717},"step-2-define-your-snippets-scope","Step 2: Define your snippet’s scope",[600,720,721],{},"Next, you’ll need to define the snippet’s scope, which refers to the languages in which the snippet will be available.",[600,723,724,725,732],{},"VS Code ",[726,727,731],"a",{"href":728,"rel":729},"https:\u002F\u002Fcode.visualstudio.com\u002Fdocs\u002Fconfigure\u002Fsettings",[730],"nofollow","supports three types of scopes",":",[641,734,735,741,747],{},[624,736,737,740],{},[646,738,739],{},"Global scope snippets:"," You can use these code snippets across several or all languages of your choice.",[624,742,743,746],{},[646,744,745],{},"Language-specific scope snippets:"," You can use these code snippets only in a particular language.",[624,748,749,752,753,756],{},[646,750,751],{},"Project scope (Workspace Snippets):"," These snippets are specific to a workspace or project folder and are stored within the ",[698,754,755],{},".vscode"," folder at the root of your project. Under the hood, it creates a global snippets file but scoped to your project.",[600,758,759],{},"For this tutorial, you will be creating VS Code Global snippets.",[600,761,762,763,766],{},"From the drop-down list, select the ",[698,764,765],{},"New Global Snippets file"," option and then give the snippet file a name:",[600,768,769],{},[711,770],{"alt":771,"src":772},"Input a snippet name.","https:\u002F\u002Fstorage.googleapis.com\u002Fpieces-marketing-website\u002Fimages\u002Fblog\u002Fvs-code-snippets-guide\u002Fimg-002.png",[600,774,775,776,779],{},"With that done, VS Code will create a ",[646,777,778],{},".code-snippets file"," prefixed with the name you gave it.",[600,781,782],{},"Upon further inspection, you'll notice a few comments and an example snippet, as pictured here:",[600,784,785],{},[711,786],{"alt":787,"src":788},"A VS Code snippet sample.","https:\u002F\u002Fstorage.googleapis.com\u002Fpieces-marketing-website\u002Fimages\u002Fblog\u002Fvs-code-snippets-guide\u002Fimg-003.png",[673,790,792],{"id":791},"step-3-write-the-snippets-syntax","Step 3: Write the snippet’s syntax",[600,794,795],{},"The example snippet of code above is a sample template to show you the format for how to create your own snippet.",[600,797,798],{},"Line by line, here’s an overview of what each field does:",[621,800,801,807,813,819,825,831],{},[624,802,803,806],{},[646,804,805],{},"Print to console:"," This is the snippet’s name, which will also be displayed via IntelliSense if no description is provided. It is the property of the JSON object that will contain the actual details of the snippet.",[624,808,809,812],{},[646,810,811],{},"Scope:"," This determines the languages allowed to use the snippet. You can specify as many languages as you wish, separated by commas. If the scope is omitted, the snippet can be accessed from any language. In this example, the snippet is scoped to only JavaScript and TypeScript.",[624,814,815,818],{},[646,816,817],{},"Prefix:"," This defines one or more words you need to type for the snippet to appear. In the example, you need to type “log” to display the snippet.",[624,820,821,824],{},[646,822,823],{},"Body:"," This is where you define the code snippet. It can be a string if it is a single line of code or an array of strings if it has multiple lines, where each string forms a new line in the snippet. In this example, the actual code is console.log.",[624,826,827,830],{},[646,828,829],{},"$1 and $2:"," These are called tab stops. They enable you to pinpoint where the cursor should be placed within the code snippet after being injected and also allow you to tab through the code easily using the tab key. $1 is simply a placeholder for where the cursor should be initially placed after invoking the snippet, and $2 is the next point the cursor placement should move to after hitting the tab key.",[624,832,833,836],{},[646,834,835],{},"Description:"," This describes VS code snippets by allowing you to provide details on what it’s all about. If it is omitted, the name of the snippet will be used instead. In this example, the description tells you that the snippet’s purpose is to “log output to console.”",[600,838,839,840,845],{},"If you prefer a nice GUI to create your snippets, you can use this free ",[726,841,844],{"href":842,"rel":843},"https:\u002F\u002Fsnippet-generator\u002F",[730],"VS Code snippet generator web app",".",[600,847,848],{},"Now that you have an example code snippet saved, let’s take a look at how you can use it in your workflow.",[610,850,852],{"id":851},"using-vs-code-snippets-in-your-workflows","Using VS Code snippets in your workflows",[600,854,855],{},"There are mainly two ways you can use this snippet in your actual development workflow.",[600,857,858],{},"Here’s a quick overview of them.",[673,860,862],{"id":861},"vs-code-intellisense","VS Code IntelliSense",[600,864,865],{},"VS Code IntelliSense is the easiest way to insert code snippets. It automatically aids you by providing snippet suggestions based on the current language (because of scope) and inserted text, among several other features.",[600,867,868,869,872],{},"To use VS Code IntelliSense, start by typing the prefix for the snippet. This will display a list of suggestions with hints at what you might be trying to achieve (",[698,870,871],{},"Ctrl+Space"," also triggers IntelliSense).",[600,874,875,876,879,880,883],{},"You can then select the code snippet by hitting the ",[698,877,878],{},"Tab"," or ",[698,881,882],{},"Enter"," key to automatically insert it into your code:",[600,885,886],{},[711,887],{"alt":888,"src":889},"Code snippets suggested by VS Code IntelliSense","https:\u002F\u002Fstorage.googleapis.com\u002Fpieces-marketing-website\u002Fimages\u002Fblog\u002Fvs-code-snippets-guide\u002Fimg-004.gif",[600,891,892],{},"As you can see, the cursor is immediately placed where the $1 placeholder was in the snippet’s file.",[600,894,895],{},"If, for some reason, your code snippet isn't working (you aren't getting auto-complete suggestions), try restarting your VS Code instance.",[673,897,899],{"id":898},"snippet-picker","Snippet Picker",[600,901,902,903,906],{},"Another method to insert snippets in your code is with VS Code’s dedicated snippet picker. Open the command palette and type ",[698,904,905],{},"insert"," into the search bar.",[600,908,909,910,913],{},"Then select the ",[698,911,912],{},"Insert Snippet"," option.",[600,915,916],{},"This displays a drop-down list of all the custom VS Code snippets you have created:",[600,918,919],{},[711,920],{"alt":921,"src":922},"","https:\u002F\u002Fstorage.googleapis.com\u002Fpieces-marketing-website\u002Fimages\u002Fblog\u002Fvs-code-snippets-guide\u002Fimg-005.gif",[600,924,925],{},"From here, you can select the appropriate snippet, and it will be inserted into your code.",[600,927,928],{},"The snippet picker comes in real handy when you don't want suggestions from IntelliSense on a particular snippet, but still want to be able to insert at will.",[600,930,931],{},"This is easily achieved by not setting a prefix on the snippet.",[610,933,935],{"id":934},"how-i-use-snippets","How I use snippets",[600,937,938],{},"Personally, I’m a total snippet maniac. I'll do anything to avoid retyping the same boilerplate code over and over again.",[600,940,941],{},"From spinning up a quick for-loop to scaffolding an entire file with mock data, it's really great. Here are two of my all-time favorites that I've used over the years.",[673,943,945],{"id":944},"numero-uno","Numero uno",[947,948,953],"pre",{"className":949,"code":951,"language":952},[950],"language-text","```json\n{\n  \"React Functional Component with prop types\": {\n    \"prefix\": \"rafcet\",\n    \"body\": [\n    \"type $1Props = {\",\n    \"}\",\n    \"\",\n    \"const $1: React.FC\u003C$1Props> = () => {\",\n    \"  return (\",\n    \"   \u003Cdiv>$1\u003C\u002Fdiv>\",\n    \"  )\",\n    \"}\",\n    \"\",\n    \"export default $1;\"\n    ],\n    \"description\": \"Create a React functional component with props types\"\n  }\n}\n","text",[698,954,951],{"__ignoreMap":921},[947,956,959],{"className":957,"code":958,"language":952},[950],"\nThis is a simple snippet to create a React functional component with a props type (like the description says). It uses multiple tab stops at different points.\n\nBy reusing the same tab stop ($1) in every spot, VS Code drops in multiple cursors so I can name my component once and watch it propagate everywhere.\n\nUse this snippet as soon as I create a new component file, and honestly, I can’t recommend it enough.\n\nIt’s literally saved me countless hours.\n\n### Numero dos\n\n",[698,960,958],{"__ignoreMap":921},[947,962,966],{"className":963,"code":964,"language":965,"meta":921,"style":921},"language-json shiki shiki-themes github-light github-dark","{\n  \"YAML Front Matter\": {\n    \"prefix\": \"yfm\",\n    \"body\": [\n    \"---\",\n    \"title: \\\"${1:Your Page Title}\\\"\",\n    \"date: \\\"${CURRENT_YEAR}-${CURRENT_MONTH}-${CURRENT_DATE}\\\"\",\n    \"uuid: \\\"${2:${UUID}}\\\"\",\n    \"slug: \\\"${3:${1\u002F\\\\s+\u002F-\u002Fg}}\\\"\",\n    \"draft: ${4|false,true|}\",\n    \"tags:\",\n    \"  - ${5:tag1}\",\n    \"categories:\",\n    \"  - ${6:category1}\",\n    \"---\",\n    \"\",\n    \"$0\"\n    ],\n    \"description\": \"Insert YAML front-matter\"\n  }\n}\n","json",[698,967,968,977,987,1003,1012,1020,1039,1056,1073,1096,1104,1112,1120,1128,1136,1143,1151,1157,1163,1174,1180],{"__ignoreMap":921},[969,970,973],"span",{"class":971,"line":972},"line",1,[969,974,976],{"class":975},"sVt8B","{\n",[969,978,980,984],{"class":971,"line":979},2,[969,981,983],{"class":982},"sj4cs","  \"YAML Front Matter\"",[969,985,986],{"class":975},": {\n",[969,988,990,993,996,1000],{"class":971,"line":989},3,[969,991,992],{"class":982},"    \"prefix\"",[969,994,995],{"class":975},": ",[969,997,999],{"class":998},"sZZnC","\"yfm\"",[969,1001,1002],{"class":975},",\n",[969,1004,1006,1009],{"class":971,"line":1005},4,[969,1007,1008],{"class":982},"    \"body\"",[969,1010,1011],{"class":975},": [\n",[969,1013,1015,1018],{"class":971,"line":1014},5,[969,1016,1017],{"class":998},"    \"---\"",[969,1019,1002],{"class":975},[969,1021,1023,1026,1029,1032,1034,1037],{"class":971,"line":1022},6,[969,1024,1025],{"class":998},"    \"title: ",[969,1027,1028],{"class":982},"\\\"",[969,1030,1031],{"class":998},"${1:Your Page Title}",[969,1033,1028],{"class":982},[969,1035,1036],{"class":998},"\"",[969,1038,1002],{"class":975},[969,1040,1042,1045,1047,1050,1052,1054],{"class":971,"line":1041},7,[969,1043,1044],{"class":998},"    \"date: ",[969,1046,1028],{"class":982},[969,1048,1049],{"class":998},"${CURRENT_YEAR}-${CURRENT_MONTH}-${CURRENT_DATE}",[969,1051,1028],{"class":982},[969,1053,1036],{"class":998},[969,1055,1002],{"class":975},[969,1057,1059,1062,1064,1067,1069,1071],{"class":971,"line":1058},8,[969,1060,1061],{"class":998},"    \"uuid: ",[969,1063,1028],{"class":982},[969,1065,1066],{"class":998},"${2:${UUID}}",[969,1068,1028],{"class":982},[969,1070,1036],{"class":998},[969,1072,1002],{"class":975},[969,1074,1076,1079,1081,1084,1087,1090,1092,1094],{"class":971,"line":1075},9,[969,1077,1078],{"class":998},"    \"slug: ",[969,1080,1028],{"class":982},[969,1082,1083],{"class":998},"${3:${1\u002F",[969,1085,1086],{"class":982},"\\\\",[969,1088,1089],{"class":998},"s+\u002F-\u002Fg}}",[969,1091,1028],{"class":982},[969,1093,1036],{"class":998},[969,1095,1002],{"class":975},[969,1097,1099,1102],{"class":971,"line":1098},10,[969,1100,1101],{"class":998},"    \"draft: ${4|false,true|}\"",[969,1103,1002],{"class":975},[969,1105,1107,1110],{"class":971,"line":1106},11,[969,1108,1109],{"class":998},"    \"tags:\"",[969,1111,1002],{"class":975},[969,1113,1115,1118],{"class":971,"line":1114},12,[969,1116,1117],{"class":998},"    \"  - ${5:tag1}\"",[969,1119,1002],{"class":975},[969,1121,1123,1126],{"class":971,"line":1122},13,[969,1124,1125],{"class":998},"    \"categories:\"",[969,1127,1002],{"class":975},[969,1129,1131,1134],{"class":971,"line":1130},14,[969,1132,1133],{"class":998},"    \"  - ${6:category1}\"",[969,1135,1002],{"class":975},[969,1137,1139,1141],{"class":971,"line":1138},15,[969,1140,1017],{"class":998},[969,1142,1002],{"class":975},[969,1144,1146,1149],{"class":971,"line":1145},16,[969,1147,1148],{"class":998},"    \"\"",[969,1150,1002],{"class":975},[969,1152,1154],{"class":971,"line":1153},17,[969,1155,1156],{"class":998},"    \"$0\"\n",[969,1158,1160],{"class":971,"line":1159},18,[969,1161,1162],{"class":975},"    ],\n",[969,1164,1166,1169,1171],{"class":971,"line":1165},19,[969,1167,1168],{"class":982},"    \"description\"",[969,1170,995],{"class":975},[969,1172,1173],{"class":998},"\"Insert YAML front-matter\"\n",[969,1175,1177],{"class":971,"line":1176},20,[969,1178,1179],{"class":975},"  }\n",[969,1181,1183],{"class":971,"line":1182},21,[969,1184,1185],{"class":975},"}\n",[947,1187,1190],{"className":1188,"code":1189,"language":952},[950],"\nI write a lot of blog posts (like the one you're reading now!) and I usually write them in markdown format right in my editor. Call me old-fashioned, but I prefer the speed gain of my shortcuts and snippets over the niceties of any modern CMS.\n\nAnyways, to quickly write a front matter, I created a snippet that:\n\n- Injects today’s date automatically.\n- Generates a UUID placeholder.\n- Slugifies my title on the fly.\n- Toggles draft status and lists my tags\u002Fcategories in one go.\n\nIt's a tad bit more complex than the previous React snippet, but not by that much. Under the hood, it uses mostly tab stops, including placeholders, variables,  and a transformation to slugify the title.\n\n## A smoother way to save snippets\n\nSo far, all we've covered is dynamic snippets and how they're managed and used in VS Code.\n\nWhat we haven't really addressed is static snippets (plain-text templates you can’t parameterize).\n\nNow, to be fair, you can store your static snippets in VS Code if you're a masochist, but you'd be losing a lot of features by doing such as [one-click sharing](https:\u002F\u002Fpieces.app\u002Ffeatures\u002Fdrive\u002Fshare-code-snippets) and [metadata enrichment](https:\u002F\u002Fpieces.app\u002Ffeatures\u002Fdrive\u002Fenrich-code-snippets).\n\nThat's where [Pieces Drive](https:\u002F\u002Fpieces.app\u002Ffeatures\u002Fdrive) comes in.\n\nPieces Drive is an all-in-one workspace for saving, managing, and quickly accessing code snippets and other development materials such as notes, logs, and more.\n\nThis means Pieces Drive isn't only constrained to code snippets.\n\nSo what are the pain points Pieces solves that VS Code doesn't?\n\nWell, just to state a few:\n\n- Automatic formatting, tagging, annotations, link suggestions, and other metadata enrichment for every snippet\n- Collation of snippets from multiple sources (think GitHub Gists, Stack Overflow, articles)\n- Instant shareable links for public access (you can’t share VS Code snippets)\n- Search all your saved materials right inside VS Code\n\nThese features don't really make much sense to dynamic snippets, but do to static snippets. Let me walk you through a simple workflow of saving a snippet, inserting it, and sharing it with others.\n\n### Saving a snippet\n\nThe following section makes use of [Pieces' VS Code extension](https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fextensions-plugins\u002Fvisual-studio-code).\n\nI have a PDF integrity check function I use across multiple apps frequently. I'm sure there's an npm library for it, but I really want to add an extra third-party dependency.\n\nInstead, I can save this as a snippet in Pieces Drive by right-clicking for the context menu, and choosing `Save Active File to Pieces.`\n\n![Save a snippet to Pieces Drive in VS Code.](https:\u002F\u002Fstorage.googleapis.com\u002Fpieces-marketing-website\u002Fimages\u002Fblog\u002Fvs-code-snippets-guide\u002Fimg-006.gif)\n\nAnd that's it!\n\nNo fiddling with VS Code **.code-snippets files**.\n\nMy PDF checker lives in Pieces Drive, fully formatted, tagged by language and project, and ready to be publicly shared.\n\n### Inserting a saved snippet\n\nTo access it, I can hit **⌘+Shift+P** (or Ctrl+Shift+P) for **Command Palette**, type **“Pieces: Search Pieces”** and filter by name, tag, or a suggested query — just like you would for VS Code’s dynamic snippets.\n\n![Accessing a snippet from Pieces Drive in VS Code.](https:\u002F\u002Fstorage.googleapis.com\u002Fpieces-marketing-website\u002Fimages\u002Fblog\u002Fvs-code-snippets-guide\u002Fimg-007.gif)\n\n### Sharing a saved snippet\n\nWant to share the snippet with a teammate (or rather the public)? I can do so by opening the Pieces Drive icon in the sidebar, right-clicking the snippet, and choosing “**Generate Shareable Link”**.\n\nA button will be presented shortly to copy the generated link to my clipboard.\n\n![Generating a sharable link for a Pieces Drive snippet in VS Code.](https:\u002F\u002Fstorage.googleapis.com\u002Fpieces-marketing-website\u002Fimages\u002Fblog\u002Fvs-code-snippets-guide\u002Fimg-008.gif)\n\nOn the other end, this is what my supposed teammate would see when they visit the link:\n\n![Public web view of generated shareable link for Pieces Drive snippet](https:\u002F\u002Fstorage.googleapis.com\u002Fpieces-marketing-website\u002Fimages\u002Fblog\u002Fvs-code-snippets-guide\u002Fimg-009.png)\n\nIf you notice, there's a concise title and description for the snippet, and on the bottom right, you'll find extra info like annotations and related links telling you more about the snippet.\n\nThis is all achieved by Pieces enrichment feature.\n\nBut that's not all... there's more!\n\nDid you know that you can use all your snippets stored inside your Pieces Drive as context for [Pieces Copilot](https:\u002F\u002Fpieces.app\u002Ffeatures\u002Fcopilot)?\n\nYeah, all you have to do is click the **+** icon under the Piece Copilot Chat tab and choose **\"Add snippets\"**. This will present you with all the snippets you have stored, and you can select any one as context for your next prompt.\n\n![Adding a snippet as context for Pieces Copilot Chat](https:\u002F\u002Fstorage.googleapis.com\u002Fpieces-marketing-website\u002Fimages\u002Fblog\u002Fvs-code-snippets-guide\u002Fimg-010.gif)\n\n## Wrapping up\n\nDevelopers tend to carry out a lot of repetitive tasks during the course of development, which can really undermine efficiency when writing code. Using code snippets (whether static or dynamic) lets you focus on the real logic at hand rather than getting caught up in busy work.\n\nWhether you’re inserting a quick loop or scaffolding an entire component, snippets shave off keystrokes and keep your mind in the flow.\n\nSo what are you waiting for? [Download Pieces for free](https:\u002F\u002Fdocs.pieces.app\u002Fproducts\u002Fmeet-pieces#how-do-i-use-pieces) today and speed up your development workflow..\n\n*This article was originally published by Victor Ikechukwu on May 26, 2022. It was comprehensively rewritten by Emmanuel Isenah on May 5th, 2025 to ensure the information reflects the latest product releases, technological accuracy, and current best practices.*\n",[698,1191,1189],{"__ignoreMap":921},[1193,1194,1195],"style",{},"html pre.shiki code .sVt8B, html code.shiki .sVt8B{--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .sj4cs, html code.shiki .sj4cs{--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .sZZnC, html code.shiki .sZZnC{--shiki-default:#032F62;--shiki-dark:#9ECBFF}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":921,"searchDepth":979,"depth":979,"links":1197},[1198,1199,1200,1205,1209],{"id":612,"depth":979,"text":613},{"id":635,"depth":979,"text":636},{"id":661,"depth":979,"text":662,"children":1201},[1202,1203,1204],{"id":675,"depth":989,"text":676},{"id":717,"depth":989,"text":718},{"id":791,"depth":989,"text":792},{"id":851,"depth":979,"text":852,"children":1206},[1207,1208],{"id":861,"depth":989,"text":862},{"id":898,"depth":989,"text":899},{"id":934,"depth":979,"text":935,"children":1210},[1211],{"id":944,"depth":989,"text":945},"Get started","Developer Workflow","2025-05-05T00:00:00.000Z","Create and use VS Code snippets to speed up coding, boost productivity, and streamline your workflow.",false,"md","https:\u002F\u002Fstorage.googleapis.com\u002Fpieces-marketing-website\u002Fimages\u002Fblog\u002Fvs-code-snippets-guide\u002Fhero.png","The Guide to VS Code Snippets.",{},null,"\u002Fblog\u002Fvs-code-snippets-guide",{"title":591,"description":1215},"blog\u002Fvs-code-snippets-guide","N6EofIs8hHa0as4MtMnvc89dlSoIMribGpD8fRuxBsk",{"id":1227,"title":592,"body":1228,"description":1232,"draft":1216,"extension":1217,"meta":1235,"navigation":20,"path":1236,"photo":1237,"photoAlt":592,"seo":1238,"stem":1239,"__hash__":1240},"authors\u002Fauthors\u002Femmanuel-isenah.md",{"type":597,"value":1229,"toc":1233},[1230],[600,1231,1232],{},"Web Developer passionate about creating wonderful web applications who codes using React and Typescript along with several CSS preprocessors and libraries like SASS\u002FSCSS, Tailwind, and Framer-Motion.",{"title":921,"searchDepth":979,"depth":979,"links":1234},[],{},"\u002Fauthors\u002Femmanuel-isenah","https:\u002F\u002Fstorage.googleapis.com\u002Fpieces-marketing-website\u002Fimages\u002Fauthors\u002Femmanuel-isenah.jpeg",{"title":592,"description":1232},"authors\u002Femmanuel-isenah","5pyukM0DFXfyKmTIN0BjxvKWo984Jb-UmlV9OoqtLS8"]