美容模板
Taper Barbershop Booking App
A barbershop's own app: customers book a barber and a free time, collect stamps toward a free cut, reserve products and join the walk-in line, and barbers run the day in Staff mode. Runs on sample data until you connect Supabase.
- 30 个界面
- iOS 和 Android
- 示例数据
- 更新于 2026年10月28日
- 已验证版本
- 已复刻 1 次
免费复制 · 完整源码 · 无需信用卡
界面
来自实际运行应用的 6 个界面。
包含内容
- Book by service, barber and free time in the shop's time zone; a database rule stops two people taking one time
- Reschedule or cancel up to 2 hours before, with reminders a day and 2 hours ahead on iOS and Android
- A ten-stamp card with a member QR code: staff add the stamp on Done or by scanning, and rewards carry a code
- Reserve grooming products to pick up at the next visit; services and products are paid at the shop
- A walk-in line with the wait and your place, and staff who call the next person to the chair
- Staff mode: the day by barber, Arrived, Done and No-show, walk-ins, member scanning and time off
关于此模板
Overview
Taper is the app a neighbourhood barbershop gives its regulars. They see the shop's hours and their next visit, book a barber and a free time in a few taps, collect a stamp at every visit (the tenth cut is free), reserve products to pick up and join the walk-in line from home. The barbers use the same app in Staff mode to run the day.
Out of the box it runs in sample mode: no backend, everything kept on the phone, two sample shops in Brooklyn with six barbers. Connect Supabase and the same screens read and write the shop's own data.
Key features
Book: the menu by kind with photos, minutes and prices; a page per service; any barber or a chosen one; a 14-day strip that marks Full, Closed and Off days; free times in the shop's time zone with taken ones struck through
Confirm: extras that still fit before the barber's next client, a note for the barber, products to pick up at the visit, and a price that says it is paid at the shop
Visits: reschedule or cancel up to 2 hours before, then the app says to call the shop; Book again; rate a visit
Barbers: rating, years at the shop, specialty, the next free times as chips that start a booking, recent work and reviews
Rewards: a ten-stamp card, the 5th stamp earns a hot towel upgrade and the 10th a free haircut, a member QR code, reward codes with use-by dates and a history
Shop: bestsellers, product pages, a bag, pickup with the next visit or at the counter, a pickup code and status
Walk-in line: the wait, how many are ahead, who is working, your place refreshed every 30 seconds, Leave the line
Account: sign in with an email code; favourite barber, your usual note, reminders, Delete my data
Staff: today's bookings by barber with Arrived, Done and No-show, Done adds the member's stamp, walk-ins, scanning a member's code, handing over pickups, blocking time off
Screens
30 screens in light and dark: Home, shop switch, Book, service, choose a time, confirm, you're booked, barbers, barber, visits, visit, rate, walk-in line, rewards, reward code, shop, product, bag, pickup, news, account, sign in, terms, privacy, about, and the staff screens: today, a visit, scan a member, walk-ins and time off.
Backend
One Supabase migration adds the shops, hours, team, menu, bookings, stamps, rewards, products, pickups, the walk-in line and profiles with row-level security. Booking, moving, cancelling, stamps, rewards, pickups and Delete my data run as server functions, and an exclusion constraint stops a time being booked twice. The migration seeds the sample business, so a new project opens with data. Staff and owners are a role on their profile, set in the table editor.
Money
Nothing is paid in the app. Haircuts and products are paid at the shop, as the App Store expects for services used outside the app, so there is no in-app purchase or card form to set up.
Setup
Connect Supabase under Server › Backend › Supabase and run the migration, replace the sample shop, team, menu and photos with your own, and set your terms and privacy text. Reminders and member scanning work in the iOS and Android builds; the web preview shows the member number field instead of the camera.
你将获得
- 完整源码 — 使用 TypeScript 的 Expo 和 React Native,作为你工作区中的一个应用。
- 实时预览 — 在浏览器或手机上试用每项更改。
- 已验证版本 — 可编译,每个界面都能无错误打开。
- AI 助手 — 用聊天修改任何内容;每次修改会消耗积分。
- 构建与上架 — iOS 和 Android 构建,从发布页发送到 App Store 和 Google Play。
- 复制不耗积分 — 复制本身不收费。
使用较早版本的 FluxNative 制作。你的副本可以照常使用;需要应用语言、货币和关于链接时,请让智能体更新。
你需要什么
- FluxNative 账号 — 免费套餐最多可有 2 个应用。
- 无需先接后端 — 在你连接自己的后端之前,它使用示例数据运行。
- Creator 或更高套餐 — 用于原生构建和上架。
- 商店账号 — Apple Developer Program(每年 99 美元)和 Google Play(一次性 25 美元),用于发布。
源码里有什么
- 个界面
- 30
- 个文件(副本中)
- 455
- 行为此应用编写的代码
- 1万
- 个现成 UI 组件
- 138
应用文本语言:英语和越南语
技术栈
- Expo SDK
- 57.0.22
- React Native
- 0.86.3
- React
- 19.2.8
- TypeScript
- 6.0.3
- Expo Router
- 57.0.21
- Supabase JS
- 2.112.3
来自此版本的 package.json。
设计系统
- 标题
- 系统字体
- 正文
- 系统字体
- 支持浅色和深色模式
- Liquid Glass
- 胶囊按钮
- 悬浮卡片
复刻后的设置
你的副本会和构建它的 AI 助手一起打开。按顺序完成步骤:某一步需要连接的内容,请在 Server 中连接,然后发送每条提示词。
Connect Supabase
Create a Supabase project, save its URL and anon key under Server › Backend › Supabase, and run supabase/migrations/20261020120000_taper.sql in its SQL editor: it adds the tables, the rules and the sample shop.
给 AI 的提示词My Supabase project is connected under Server › Backend › Supabase. Write its URL and anon key into .env, make sure supabase/migrations/20261020120000_taper.sql has been run on it, and check that Home, Book, Rewards and Staff load from it.
Add your shop, team and menu
Replace the sample shops, hours, barbers, services and products with yours in Supabase's table editor (the README lists each table), add your photos, and give your barbers the staff role in profiles.
给 AI 的提示词Replace Taper's sample business with mine: the shop name, address, phone and hours, my barbers with their specialties, my services with minutes and prices, and my products. Update the seed in the migration and the sample data so they match.
Rename it for your business
src/config/business.ts holds every business word (barber, cut, shop), the cancel window and the stamps a reward needs. Change the window and the stamp goal in the migration too.
给 AI 的提示词Turn Taper into an app for my business. Change the words in src/config/business.ts, and the cancel window and stamp goal in both business.ts and the migration.
Check reminders and scanning on a phone
Reminders and scanning a member's code use the phone's notifications and camera, so try them in an iOS or Android build. The web preview shows the member number field instead.
给 AI 的提示词Check that booking reminders and the staff member scanner work in a phone build, and fix anything that does not.
Publish from your own account
App Store rule 4.2.6: an app made from a template is published by the business it is for, from its own developer account. Replace the sample photos, terms and privacy text first.
给 AI 的提示词Get the app ready to publish under my business: my name, icon and photos, and my own terms of use and privacy text in place of the sample text.
如何使用此模板
许可与支持
许可
为你生成的应用归你所有;模板代码仍归 InspireUI 所有,并授权你在自己的应用中使用(条款 › 我们的知识产权)。
由 FluxNative 制作
支持政策常见问题
免费吗?
复制免费模板不收费,也不耗积分;Premium 模板按网站一次性购买。聊天修改和构建会消耗积分。
我拥有什么?
为你生成的应用归你所有。模板代码仍归 InspireUI 所有,并授权你在自己的应用中使用(条款 › 我们的知识产权)。
需要懂代码吗?
不需要。用日常语言让助手修改;需要时随时可看完整源码。
自带后端吗?
不带。完整应用会写明所需后端,你在 Server 中连接自己的;设计模板使用示例数据运行。
可以改设计吗?
可以。设计标签页可设置品牌色、颜色、字体和圆角,不耗积分;其余由助手修改。
发布需要哪个套餐?
Creator 或更高套餐,用你自己的 Apple 和 Google 账号构建并上传到商店。Premium 模板的应用在连接其网站后,任何套餐都能构建。
能下载源码吗?
可以,使用“下载源码”或“推送到 GitHub”,前提是你的工作区已购买套餐、积分或付费模板。Premium 模板的应用还需连接其网站。
如果是用较早版本的 FluxNative 做的呢?
你的副本照常可用。让助手把它更新到较新的功能,如应用语言和货币;这是最后一个设置步骤。
准备好打造你的应用了吗?
从 Taper Barbershop Booking App 开始,通过聊天修改任何内容。你的副本包含完整源代码。
免费复刻,无需信用卡。