Google AI Studio Adds ‘Import from GitHub’ to Build Mode, Turning an Existing Repo Into an Editable, Deployable App
Google AI Studio is rolling out an ‘import from GitHub’ feature inside its Build mode. It takes a repo and transforms it into a runtime-compatible format. You can then keep iterating on it, deploy it, and more. The update was shared by the Google AI Studio account and by Logan Kilpatrick, who leads the product.
‘Import from GitHub’
Build mode is Google AI Studio’s ‘vibe coding’ surface. You describe an app in a prompt. Gemini generates a full-stack app with a live preview. You then refine it through chat or annotation mode.
The new feature adds a starting point. Instead of a blank prompt, you point Build at a GitHub repository. AI Studio then transforms the repo into a format compatible with its runtime.
The flow has three parts:
- Import the repo
- Keep iterating on it in AI Studio.
- Deploy it.
How the Import Flow Works
Google has not published the internal steps. In plain terms, the importer reads the repo, fits it to the runtime, then opens it in Build. The interactive walkthrough embedded below is a concept simulation, not the real backend.
One documented behavior matters when moving code in. For apps that use the Gemini API, AI Studio configures your GEMINI_API_KEY as a server-side secret. Keys are never included in client-side code.
So plan for the server-side pattern if your repo calls the Gemini API from the browser. The example below shows both sides for contrast.
// Discouraged: calling the Gemini API from the browser exposes the key
const res = await fetch(
"https://generativelanguage.googleapis.com/v1beta/models/gemini-flash-latest:generateContent",
{
method: "POST",
headers: {
"Content-Type": "application/json",
"x-goog-api-key": MY_KEY, // visible in the client bundle
},
body: JSON.stringify({ contents: [{ parts: [{ text: "Hello" }] }] }),
}
);
// Recommended: read the key from the server environment, call the API server-side
// GEMINI_API_KEY lives in the server-side runtime, not in shipped client code.
export async function handler(req) {
const apiKey = process.env.GEMINI_API_KEY; // server-side only
const r = await fetch(
"https://generativelanguage.googleapis.com/v1beta/models/gemini-flash-latest:generateContent",
{
method: "POST",
headers: {
"Content-Type": "application/json",
"x-goog-api-key": apiKey,
},
body: JSON.stringify({ contents: [{ parts: [{ text: "Hello" }] }] }),
}
);
return new Response(await r.text(), { status: r.status });
}
The endpoint and header above match the Gemini REST API. The point is placement: keep the key on the server.
Use Cases With Examples
- Reviving a hackathon repo: You built a Vite plus React demo months ago. You import it, ask Build to add a settings page, then deploy to Cloud Run.
- Onboarding a teammate fast: A colleague shares a public repo. You import it, generate a walkthrough UI, and hand back a live preview link.
- Turning a script into an app: You have a small Gemini prototype in a repo. You import it, then use annotation mode to add a real interface.
Import from GitHub vs Other Build Workflows
| Workflow | What it does | Direction | Best for | Notes |
|---|---|---|---|---|
| Import from GitHub (new) | Ingests a repo, normalizes it to the runtime | GitHub → AI Studio | Continuing an existing codebase | Just announced; details still emerging |
| Push / export to GitHub | Creates a repo and commits app code | AI Studio → GitHub | Version control and external editing | Historically one repo per app |
| Download as ZIP | Exports generated code as a ZIP file | AI Studio → local | Local dev in VS Code or Cursor | Manual re-import needed |
| Remix from App Gallery | Copies a gallery app into Build | Gallery → AI Studio | Starting from a template | Not your own repo |
| Deploy to Cloud Run | Ships the app to a live URL | AI Studio → Cloud Run | Production hosting | Cloud Run pricing may apply |
The table shows the shape of the change. Import adds the inbound path that was missing.
Key Takeaways
- Google AI Studio is adding “import from GitHub” to Build mode, letting you start from an existing repo.
- AI Studio transforms the repo into a runtime-compatible format, then supports iterate and deploy.
- This adds the inbound GitHub path that Build mode previously lacked.
- AI Studio’s runtime keeps
GEMINI_API_KEYserver-side, so plan for that with client-side key code. - Exact runtime format, private-repo support, and sync behavior are still unconfirmed at launch.
The post Google AI Studio Adds ‘Import from GitHub’ to Build Mode, Turning an Existing Repo Into an Editable, Deployable App appeared first on MarkTechPost.
MarkTechPost
