# Create Frontend Project

> Scaffold a new React (Vite), Next.js, or React Native project from scratch, then interactively add integrations. Always installs latest package versions.

- **Type:** Skill
- **Install:** `agentstack add skill-global-software-consulting-project-scaffolding-skills-create-frontend-project`
- **Verified:** Yes — security-reviewed for prompt injection and unsafe behavior
- **Seller:** [Global-Software-Consulting](https://agentstack.voostack.com/s/global-software-consulting)
- **Installs:** 0
- **Category:** [Agent Skills](https://agentstack.voostack.com/c/agent-skills)
- **Latest version:** 0.1.0
- **License:** MIT
- **Upstream author:** [Global-Software-Consulting](https://github.com/Global-Software-Consulting)
- **Source:** https://github.com/Global-Software-Consulting/project-scaffolding-skills/tree/main/skills/create-frontend-project

## Install

```sh
agentstack add skill-global-software-consulting-project-scaffolding-skills-create-frontend-project
```

Requires the [AgentStack CLI](https://agentstack.voostack.com/docs/cli). Works with Claude Code, Cursor, and any MCP-compatible agent.

## About

# Create Project

You are a project scaffolding assistant. Your job is to create a fresh frontend project and then guide the user through adding integrations.

## Step 0 — Detect Environment

**Before asking anything**, check whether you are inside a Turborepo monorepo:

1. Look for `turbo.json` in the current directory or up to 3 parent directories
2. Also check for `package.json` with a `"workspaces"` field
3. Also check for an `apps/` directory alongside `packages/`

**If a monorepo is detected:**

Read the root `package.json` to get the monorepo name (from the `"name"` field).
List any existing apps in `apps/` so you can show the user what's already there.

Then ask:

> "You're inside the `` monorepo.
> Where do you want to create this project?
> A) Add as a new app in this monorepo (creates in `apps/`, links shared packages)
> B) Create as a standalone project (creates in the current directory, independent)"

**If no monorepo is detected:** Skip this step entirely and proceed to Step 1 as normal.

**Store the result as `CONTEXT: monorepo | standalone`** — it affects Steps 3 and 4.

---

## Step 1 — Project Type

Ask the user (one question):

> "What type of project?
> A) React (Vite)
> B) Next.js
> C) React Native"

Wait for the answer before proceeding.

## Step 2 — Project Name

Ask:

> "What should the project be named?"

Use the name as-is (no spaces — remind user to use kebab-case if they use spaces).

## Step 3 — Create the Project

### If CONTEXT = monorepo:

Navigate into the `apps/` directory at the monorepo root first, then create the app there:

```bash
cd /apps
```

**Then create the app using the same commands as standalone (below), but from inside `apps/`.**

After creation, link the monorepo's shared packages by adding them to the new app's `package.json`:

```json
"dependencies": {
  "-types": "1.0.0",
  "-api": "1.0.0",
  "-ui": "1.0.0"
},
"devDependencies": {
  "-theme": "1.0.0",
  "-config": "1.0.0"
}
```

> Skip `-ui` and `-theme` for React Native / Expo apps (web-only packages).

Then run `yarn install` from the **monorepo root** (not inside the app):
```bash
cd 
yarn install
```

### If CONTEXT = standalone (or no monorepo):

Create in the current directory as normal.

---

### React (Vite):
```bash
yarn create vite  --template react-ts
cd 
yarn install
```

### Next.js:
```bash
npx create-next-app@latest  --typescript --eslint --app --src-dir --import-alias "@/*" --use-yarn
cd 
```

### React Native:

First ask:
> "Which setup would you prefer?
> A) Expo (recommended — managed workflow, easier setup, Expo Router)
> B) React Native CLI (bare, full native control)"

**If Expo:**
```bash
npx create-expo-app@latest  --template blank-typescript
cd 
```
Note: This installs with Expo SDK (latest). New Architecture is enabled by default in SDK 53+.

**If React Native CLI:**
```bash
npx @react-native-community/cli@latest init  --template react-native-template-typescript
cd 
```
Note: Project name must be PascalCase for CLI. New Architecture is mandatory in RN 0.82+.

After creation, tell the user which setup was chosen and any important notes.

## Step 4 — Initialize Git

### If CONTEXT = monorepo:

**Do NOT run `git init`** — the monorepo root already has a git repo.

Just stage and commit from the monorepo root:
```bash
cd 
git add apps/
git commit -m "feat: add  app to monorepo"
```

### If CONTEXT = standalone:

Run:
```bash
git init
git add .
git commit -m "chore: initial project scaffold"
```

(Skip `git init` if the project already has a repo — e.g., create-expo-app initializes one automatically.)

## Step 5 — App Type

Ask:

> "What kind of app is this?
> A) Dashboard / Admin app — data tables, auth required, lots of API calls
> B) Landing / Marketing site — public pages, contact forms, SEO important
> C) Consumer app — user-facing features, accounts, mixed content
> D) Not sure / General purpose"

Remember the answer — pass it into the setup flow so recommendations are tailored.

## Step 6 — Continue with Setup

Now follow the full `/setup-project` skill to walk the user through integrations.
The app type from Step 5 is already known — skip the app type question in setup-project and go straight to categories.

**The `/setup-project` skill automatically continues into scaffold-app at the end** — no separate command needed. The full flow (integrations → scaffold → extras → "All done") runs without any interruption.

## Source & license

This open-source skill is cataloged on AgentStack and links to its original source — we do not rehost the code.

- **Author:** [Global-Software-Consulting](https://github.com/Global-Software-Consulting)
- **Source:** [Global-Software-Consulting/project-scaffolding-skills](https://github.com/Global-Software-Consulting/project-scaffolding-skills)
- **License:** MIT

Install and usage instructions live in the source repository linked above.

## Pricing

- **Free** — Free

## Security capabilities

Automated source analysis of v0.1.0 — what this tool can access:

- **Network access:** no
- **Filesystem access:** no
- **Shell / process execution:** no
- **Environment & secrets:** no
- **Dynamic code execution:** no

*"Yes" means the capability is present in the source — more access means more to trust, not that it is unsafe.*


## Versions

- **0.1.0** — security scan: passed — Imported from the upstream source.

## Links

- Listing page: https://agentstack.voostack.com/l/skill-global-software-consulting-project-scaffolding-skills-create-frontend-project
- Seller: https://agentstack.voostack.com/s/global-software-consulting
- Browse the marketplace: https://agentstack.voostack.com/browse

---
Listed on AgentStack — the marketplace for AI agent skills and MCP servers. Every listing is security-reviewed. Creators keep 70%.