← All guides

๐Ÿฅฌ Veg Mart โ€” Build & Publish an eCommerce App

Rebuild a vegetables ordering system from a Dribbble design, then take it from prototype to a published App Store app.

Design prompt Auth Database + storage Payments Privacy policy App icon Onboarding Ship

๐ŸŽจ Design prompt

Reference design (Dribbble): Nutrition eCommerce Website UI Design

Prompt

I want you to rebuild a vegetables ordering system like this pizza
ordering system. Come up with your own name, but use their design
elements to build our website. I want to see two different vegetable
templates.

I want to see two vegetable templates: normal and organic. I want to
be able to select two other add-ons for each template, and the image
should change according to the add-ons selected. I want to be able to
add to cart and also check out.

Use Higgsfield MCP to generate any images.

Ask me clarifying questions.

Follow the design as closely as possible.

1 Authentication (user accounts)

What it is: letting users sign up and log in so their data is tied to them, not just their phone.

Tool to use: Supabase โ€” free to start, handles sign up, login, and password resets out of the box. Works with React Native.

Alternative: Firebase Auth by Google โ€” also free, slightly more complex to set up.

Prompt to give Claude

Add Supabase authentication to my vegetable ordering system. I want
users to be able to sign up and log in with their email and password.
Show a login screen when the user is not authenticated, and once
logged in take them to the main app. Use @supabase/supabase-js. My
Supabase project URL is [PASTE URL] and my anon key is [PASTE KEY].

2 Cloud storage + database

What it is: instead of saving data on the phone, you save it to a database in the cloud. The user can switch phones and their data is still there.

Tool to use: Supabase Database โ€” same tool as auth above, so you only need one account. Gives you a database with a simple dashboard, no technical knowledge needed.

For images: Supabase Storage โ€” stores the actual image files. Also included in Supabase for free.

Prompt to give Claude

Replace AsyncStorage in my vegetable ordering system with Supabase.
Create the tables needed to store products, templates, add-ons, cart
items and orders (id, user_id, created_at, plus the relevant fields).
Upload product/add-on images to Supabase Storage and save the public
URL. All reads and writes should be scoped to the logged-in user only.

3 Payments and usage limits

What it is: charging users for the app. A common model is free with a small monthly allowance, then a subscription to unlock more.

Tool to use: RevenueCat โ€” the easiest way to add subscriptions to a React Native app. Handles Apple's payment system, receipts, and renewals for you. Free up to $2,500/month revenue.

โš ๏ธ Apple takes 30% of all in-app purchases (15% if you earn under $1M/year).

Prompt to give Claude

Add a usage limit to my vegetable ordering system using RevenueCat.
Free users get 5 [actions] per month. When they hit the limit, show a
paywall screen offering a monthly subscription for $4.99/month that
unlocks unlimited use. Use react-native-purchases (RevenueCat's SDK).
My RevenueCat API key is [PASTE KEY].

4 Privacy policy (required by Apple)

What it is: a page that explains what data your app collects and how you use it. Apple will reject your app without one. Takes ~5 minutes to generate.

Tool to use: Termly or iubenda โ€” both generate a privacy policy for free. Host it as a web page and paste the URL into App Store Connect.

What to disclose for this app: camera access, images sent to AI, email address collected at signup.

5 App icon

What it is: the icon shown on the home screen and in the App Store. Apple requires a 1024×1024 PNG.

Tool to use: Canva โ€” free. Search the "app icon" template, design it, export at 1024×1024.

6 Onboarding screen

What it is: a 2โ€“3 screen intro shown the first time someone opens the app.

Prompt to give Claude

Add a simple onboarding flow to the vegetable ordering system. Show 3
screens the first time the user opens the app: 1) "Browse fresh
vegetables" with a leaf icon, 2) "Pick normal or organic + add-ons"
with a basket icon, 3) "Add to cart and check out" with a bag icon.
Each screen has a title, subtitle, and a Next button. The last screen
has a Get Started button. After completing onboarding, save a flag to
AsyncStorage so it never shows again.

7 Move the code to GitHub

Prompt to give Claude

I have already created a repository on GitHub at [PASTE YOUR REPO URL HERE].

Please perform the following steps in my terminal:

- Initialize a local git repository.
- Ensure a .gitignore file is present so I don't push unnecessary files.
- Stage all files and create an initial commit.
- Link this local folder to the existing GitHub repository using the URL provided.

IMPORTANT: Once the remote is linked and the commit is ready, STOP. Do
not push the code yet. Ask me for my explicit permission before you
execute the final git push command.

ฮฃ Full stack summary

What you needToolCost
User accountsSupabaseFree to start
Database + photo storageSupabaseFree to start
Payments + subscriptionsRevenueCatFree under $2.5K/month
Privacy policyTermlyFree
App iconCanvaFree
App Store submissionEAS by ExpoFree tier available
Apple Developer accountdeveloper.apple.com$99/year

โœ“ The order to do things

  1. Set up Supabase (auth + database) โ€” this unlocks everything else.
  2. Add usage limits tied to user accounts.
  3. Add the RevenueCat paywall.
  4. Generate the privacy policy.
  5. Design the app icon.
  6. Add onboarding screens.
  7. Submit via EAS.