[{"data":1,"prerenderedAt":400},["ShallowReactive",2],{"blog-is-safe/tempo-labs":3},{"id":4,"title":5,"body":6,"category":374,"date":375,"dateModified":375,"description":376,"draft":377,"extension":378,"faq":379,"featured":377,"headerVariant":385,"image":386,"keywords":387,"meta":388,"navigation":161,"ogDescription":389,"ogTitle":386,"path":390,"readTime":391,"schemaOrg":392,"schemaType":393,"seo":394,"sitemap":395,"stem":396,"tags":397,"twitterCard":398,"__hash__":399},"blog/blog/is-safe/tempo-labs.md","Is Tempo Labs Safe? Security Review for AI React Builders (2026)",{"type":7,"value":8,"toc":364},"minimark",[9,13,19,26,31,34,37,41,44,47,62,66,69,80,98,102,105,116,208,226,229,236,240,247,253,257,260,263,267,295,329,348,360],[10,11,12],"p",{},"Tempo Labs connects to your GitHub account, reads your codebase for AI context, and generates React component code directly into your project. That workflow is genuinely useful, and it's also a different security posture from copy-paste tools like v0. Before you wire it into a project with real user data, here's what actually matters.",[14,15,16],"tldr",{},[10,17,18],{},"Tempo Labs is safe as a platform. It's frontend-only (no backend generation), which limits what can go wrong. The real risks are: broad GitHub OAuth scope covering all your repos, codebase content sent to AI inference servers (including any secrets in project files), and generated components that occasionally skip input sanitization. Review OAuth permissions, configure file exclusions, and scan your output before shipping.",[20,21,23],"verdict-badge",{"verdict":22},"caution",[10,24,25],{},"Safe platform, audit the output",[27,28,30],"h2",{"id":29},"what-tempo-labs-does","What Tempo Labs Does",[10,32,33],{},"Tempo is an AI-powered visual editor for React. You describe a UI change in plain language and Tempo edits the relevant component files directly in your repo. It supports in-browser editing at tempo.new and integrates as a VS Code extension for local development.",[10,35,36],{},"The key thing Tempo does not do: it doesn't generate backend code, touch your database schema, or manage authentication. That puts it in the same category as v0 (Vercel's React generator) for security purposes. Frontend-only tools carry lower inherent risk than full-stack builders like Bolt or Lovable.",[27,38,40],{"id":39},"github-oauth-scope","GitHub OAuth Scope",[10,42,43],{},"When you connect Tempo, it requests OAuth access to your GitHub account. The access Tempo needs to commit code back to your repo typically covers all repositories in your account, not just the one you're actively editing. This is a standard GitHub OAuth limitation: granular per-repo access requires GitHub Apps (which offer scoped installation permissions), but many tools still use the older OAuth flow that grants broader access.",[10,45,46],{},"What that means in practice: a compromised Tempo session, or a breach of Tempo's stored tokens, could expose other repos in your account, not just your current project.",[48,49,50],"warning-box",{},[10,51,52,53,57,58,61],{},"Check your connected apps at ",[54,55,56],"code",{},"github.com/settings/applications",". You'll see \"Authorized OAuth Apps\" and \"Installed GitHub Apps\" separately. If Tempo shows up under OAuth Apps with ",[54,59,60],{},"repo"," scope, it can read and write to all your repositories. Consider whether that's acceptable for your account, especially if you have private repos with sensitive code.",[27,63,65],{"id":64},"code-sent-to-ai-servers","Code Sent to AI Servers",[10,67,68],{},"Tempo reads your project files to give its AI model context about your codebase. Those files are sent to Tempo's inference pipeline for processing. That's how all in-context AI coding tools work. The risk is specific: if your project contains secrets in comments, hardcoded strings, or .env files that the AI resolves for context, those values travel to Tempo's servers.",[10,70,71,72,75,76,79],{},"CheckYourVibe's scanner flags this pattern regularly: ",[54,73,74],{},"VITE_API_SECRET"," referenced in a component import, ",[54,77,78],{},"REACT_APP_STRIPE_SECRET_KEY"," appearing in a configuration comment, or a database URL hardcoded in a seed script sitting in the project root. The AI sees all of it.",[81,82,83],"tip-box",{},[10,84,85,86,89,90,93,94,97],{},"Tempo supports ignore configuration similar to ",[54,87,88],{},".gitignore",". Create a file that excludes ",[54,91,92],{},".env",", ",[54,95,96],{},".env.local",", and any directory with credentials before connecting Tempo to a project. At minimum, exclude files the AI doesn't need to read to do UI work.",[27,99,101],{"id":100},"generated-code-what-to-audit","Generated Code: What to Audit",[10,103,104],{},"Tempo focuses on React component generation. The platform generates clean, readable TypeScript in most cases. The issues that appear in CheckYourVibe scans of Tempo-built apps cluster around two patterns.",[10,106,107,111,112,115],{},[108,109,110],"strong",{},"dangerouslySetInnerHTML without sanitization."," When AI generates a component that renders HTML from a data source, it sometimes reaches for ",[54,113,114],{},"dangerouslySetInnerHTML"," because it's the idiomatic React way to inject raw HTML. Without a sanitizer like DOMPurify wrapping the value, any attacker-controlled HTML in that data source is executed in the visitor's browser.",[117,118,123],"pre",{"className":119,"code":120,"language":121,"meta":122,"style":122},"language-jsx shiki shiki-themes github-light github-dark","// what tempo sometimes generates\n\u003Cdiv dangerouslySetInnerHTML={{ __html: userContent }} />\n\n// what you want\nimport DOMPurify from 'dompurify';\n\u003Cdiv dangerouslySetInnerHTML={{ __html: DOMPurify.sanitize(userContent) }} />\n","jsx","",[54,124,125,134,156,163,169,188],{"__ignoreMap":122},[126,127,130],"span",{"class":128,"line":129},"line",1,[126,131,133],{"class":132},"sJ8bj","// what tempo sometimes generates\n",[126,135,137,141,145,149,153],{"class":128,"line":136},2,[126,138,140],{"class":139},"sVt8B","\u003C",[126,142,144],{"class":143},"s9eBZ","div",[126,146,148],{"class":147},"sScJk"," dangerouslySetInnerHTML",[126,150,152],{"class":151},"szBVR","=",[126,154,155],{"class":139},"{{ __html: userContent }} />\n",[126,157,159],{"class":128,"line":158},3,[126,160,162],{"emptyLinePlaceholder":161},true,"\n",[126,164,166],{"class":128,"line":165},4,[126,167,168],{"class":132},"// what you want\n",[126,170,172,175,178,181,185],{"class":128,"line":171},5,[126,173,174],{"class":151},"import",[126,176,177],{"class":139}," DOMPurify ",[126,179,180],{"class":151},"from",[126,182,184],{"class":183},"sZZnC"," 'dompurify'",[126,186,187],{"class":139},";\n",[126,189,191,193,195,197,199,202,205],{"class":128,"line":190},6,[126,192,140],{"class":139},[126,194,144],{"class":143},[126,196,148],{"class":147},[126,198,152],{"class":151},[126,200,201],{"class":139},"{{ __html: DOMPurify.",[126,203,204],{"class":147},"sanitize",[126,206,207],{"class":139},"(userContent) }} />\n",[10,209,210,213,214,217,218,221,222,225],{},[108,211,212],{},"Hardcoded backend URLs."," AI generates realistic-looking code, which means it fills in placeholder values. A component that fetches from ",[54,215,216],{},"https://api.myapp.com/data"," is fine. A component that fetches from ",[54,219,220],{},"http://localhost:3001/data"," or ",[54,223,224],{},"https://staging.myapp.com/data?token=abc123"," is not something you want in a production bundle.",[10,227,228],{},"After any Tempo-generated commit, grep your src directory for localhost, staging., and any URL containing a token or key parameter.",[230,231,233],"finding-box",{"title":232},"CheckYourVibe Finding: Sensitive Data in JS Bundle",[10,234,235],{},"When we scan production builds of Tempo-generated React apps, the most common finding is a staging URL or internal endpoint URL bundled into the client JavaScript. These don't expose secrets directly, but they map your internal infrastructure and are visible to anyone who opens devtools.",[27,237,239],{"id":238},"npm-dependencies","npm Dependencies",[10,241,242,243,246],{},"Tempo may suggest adding packages to support generated components (animation libraries, date pickers, icon sets). Each added dependency is a potential supply-chain risk. Before running ",[54,244,245],{},"npm install"," on anything Tempo recommends, check the package on npmjs.com: look at the weekly download count (popularity), last publish date (maintenance), and whether the package is from a well-known maintainer.",[10,248,249,250,252],{},"This applies to any AI code generation tool, not just Tempo. The convenience of \"add this package\" in AI-generated code can slide past the review step that a manual ",[54,251,245],{}," would prompt.",[27,254,256],{"id":255},"platform-security","Platform Security",[10,258,259],{},"Tempo is a funded, established company with a real security posture. The platform uses HTTPS for all communication, and there is no evidence of significant data breaches or security incidents at time of writing. SOC 2 certification status and their full privacy policy are available on their site and worth checking before connecting to a project with regulated data (HIPAA, GDPR).",[10,261,262],{},"For most React frontend work, the platform itself is not the concern. The concern is what you give it access to and what it generates.",[27,264,266],{"id":265},"what-to-do-before-you-ship","What to Do Before You Ship",[268,269,270,275,279,283,287,291],"checklist-section",{},[271,272],"checklist-item",{"description":273,"label":274},"Go to github.com/settings/applications. If Tempo shows OAuth repo access, evaluate whether that breadth is acceptable for your account.","Audit GitHub OAuth scope",[271,276],{"description":277,"label":278},"Configure Tempo to exclude .env, credentials, and config files with secrets before it reads your project.","Set up file exclusions",[271,280],{"description":281,"label":282},"Run: grep -r 'dangerouslySetInnerHTML' src/. For each hit, confirm the value is sanitized before injection.","Grep for dangerouslySetInnerHTML",[271,284],{"description":285,"label":286},"Run: grep -rE '(localhost|staging\\\\.|token=|key=)' src/. Any hardcoded non-production URLs or token params in component code should be moved to env vars.","Check for hardcoded URLs",[271,288],{"description":289,"label":290},"Check any package Tempo added to package.json since the last known-good state. Verify it's from a trusted publisher.","Review added npm packages",[271,292],{"description":293,"label":294},"Use CheckYourVibe to scan your built app for secrets in bundles, missing security headers, and open API endpoints before deploying.","Run a full security scan",[296,297,298,305,311,317,323],"faq-section",{},[299,300,302],"faq-item",{"question":301},"Is Tempo Labs safe for production React apps?",[10,303,304],{},"Tempo itself is safe as a platform. The generated code is frontend-only (no backend or database), which limits the blast radius. The main risks are code quality issues in generated components (missing input sanitization, hardcoded values) and the broad GitHub OAuth scope Tempo requests. Scan your output before shipping.",[299,306,308],{"question":307},"Does Tempo Labs send my code to external servers?",[10,309,310],{},"Yes. Tempo uploads file context from your project to its AI pipeline for code generation. Any secrets or credentials stored in project files (including .env references the AI resolves for context) can be included in those payloads. Use Tempo's ignore configuration to exclude sensitive files.",[299,312,314],{"question":313},"What GitHub permissions does Tempo Labs request?",[10,315,316],{},"Tempo requests OAuth access to your GitHub account to read and commit code. The exact scope varies by how you connect, but repo-level OAuth access typically covers all repositories in your account, not just the one you're editing. Audit your connected OAuth apps at github.com/settings/applications.",[299,318,320],{"question":319},"Can Tempo-generated code introduce XSS vulnerabilities?",[10,321,322],{},"Yes, it can. CheckYourVibe scans of Tempo-generated React components surface two patterns: dangerouslySetInnerHTML used to render dynamic content without DOMPurify sanitization, and direct interpolation of URL parameters or query strings into component state. Both are exploitable if the source is attacker-controlled.",[299,324,326],{"question":325},"How does Tempo Labs compare to v0 from a security perspective?",[10,327,328],{},"Both are frontend-only React builders, so neither touches your database or backend auth. Tempo's key difference is deeper codebase integration: it reads your existing files for context and commits back via GitHub, which means broader access scope than v0's copy-paste workflow.",[330,331,332,338,343],"related-articles",{},[333,334],"related-card",{"description":335,"href":336,"title":337},"Security analysis of Vercel's AI React component generator: code quality, XSS patterns, and what frontend-only scope means for your app.","/blog/is-safe/v0","Is v0 Safe?",[333,339],{"description":340,"href":341,"title":342},"Security and privacy review of Cursor AI IDE: what code gets sent to servers, Privacy Mode, and how to audit generated code.","/blog/is-safe/cursor","Is Cursor Safe?",[333,344],{"description":345,"href":346,"title":347},"Security analysis of Bolt.new: the authentication gaps, API key leaks, and missing input validation common in AI-generated full-stack apps.","/blog/is-safe/bolt","Is Bolt.new Safe?",[349,350,353,357],"cta-box",{"href":351,"label":352},"/","Start Free Scan",[27,354,356],{"id":355},"built-with-tempo-labs","Built with Tempo Labs?",[10,358,359],{},"Scan your React app for secrets in bundles, missing security headers, and XSS patterns before you ship.",[361,362,363],"style",{},"html pre.shiki code .sJ8bj, html code.shiki .sJ8bj{--shiki-default:#6A737D;--shiki-dark:#6A737D}html pre.shiki code .sVt8B, html code.shiki .sVt8B{--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .s9eBZ, html code.shiki .s9eBZ{--shiki-default:#22863A;--shiki-dark:#85E89D}html pre.shiki code .sScJk, html code.shiki .sScJk{--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .szBVR, html code.shiki .szBVR{--shiki-default:#D73A49;--shiki-dark:#F97583}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":122,"searchDepth":136,"depth":136,"links":365},[366,367,368,369,370,371,372,373],{"id":29,"depth":136,"text":30},{"id":39,"depth":136,"text":40},{"id":64,"depth":136,"text":65},{"id":100,"depth":136,"text":101},{"id":238,"depth":136,"text":239},{"id":255,"depth":136,"text":256},{"id":265,"depth":136,"text":266},{"id":355,"depth":136,"text":356},"is-safe","2026-06-27","Is Tempo Labs safe to use for React development? Honest review of codebase access scope, GitHub OAuth permissions, generated code quality, and what to audit before you ship.",false,"md",[380,381,382,383,384],{"question":301,"answer":304},{"question":307,"answer":310},{"question":313,"answer":316},{"question":319,"answer":322},{"question":325,"answer":328},"amber",null,"is tempo labs safe, tempo labs security, tempo react security, tempo labs github oauth, tempo labs ai coding, tempo labs privacy",{},"Tempo Labs security review: GitHub OAuth scope, codebase context sent to AI, generated code quality, and what CheckYourVibe scans find in Tempo-built React apps.","/blog/is-safe/tempo-labs","7 min read","[object Object]","BlogPosting",{"title":5,"description":376},{"loc":390},"blog/is-safe/tempo-labs",[],"summary_large_image","ICp2_JC6mxKlTvfBC0DdxNkXf9KlBxVYXz7cOxdvXJE",1784736378961]