Jump to Content
Home
Knowledge Base
Examples
Sign up for Draftbit ↗
Dashboard ↗
Community ↗
Knowledge Base
Sign up for Draftbit ↗
Dashboard ↗
Community ↗
Moon (Dark Mode)
Sun (Light Mode)
Knowledge Base
Intro to Custom Code
Intro to Custom Code
Search
All
Pages
Start typing to search…
GETTING STARTED
Welcome to Draftbit!
Dashboard Overview
Workspaces
Community Resources
FAQs
Builder
Intro to the Builder
Assets
Settings
Environments
Live Preview
Console Logs
Keyboard Shortcuts
COMPONENTS
Intro to Components
Basic
Screen
Icon
Text
View
Buttons
Button
Icon Button
Link
Touchable
Pressable
Views
Blur View
Keyboard Avoiding View
Keyboard Aware Scroll View
Scroll View
Shadow
Flex Layout
Aspect Ratio
Center
Circle
Square
Linear Gradient
H Stack
V Stack
Z Stack
Divider
Spacer
Containers
Accordion
Surface
Media
Image
Image Background
SVG
Lottie Animation
Audio Player
Video Player
Youtube Player
Lists & Data
Fetch
List
FlashList
Masonry List
Section List
Section Header
Swipeable List
Swipable Item
Swipeable Item Button
Table
Table Row
Table Cell
Form Inputs
Text Input
Text Area
Number Input
Styled Text Field
Styled Text Area
Picker
Picker Item
Date Picker
Multi-Select Picker
PIN Input
Form Controls
Switch
Switch Row
Checkbox
Checkbox Row
Radio Button
Radio Button Row
Radio Button Group
Slider
Star Rating
Stepper
Maps
Map View
Map Marker
Map Callout
Map Marker Cluster
Map Marker Cluster View
Map Circle
Swipers
Swiper
Swiper Item
Deck Swiper
Deck Swiper Card
Tab View
Tab View Item
Text Elements
Headings
Markdown
Overlays
Modal
Bottom Sheet
Action Sheet
Action Sheet Item
Action Sheet Cancel
Utilities
Timer
Activity Indicator
Loading Indicator
Linear Progress
Circular Progress
Web View
HTML View
Custom Code
Blocks
STYLing
Intro to Styling
Theme
Breakpoints
Stylesheets
Dynamic Styling
Conditional Display
Typography
Flex Layout
Margins & Padding
Borders, Background, Effects
Size & Position
Safe Area
VARIABLES
Intro to Variables
App Variables
Device Variables
Screen Variables
System Variables
Variables in Code
Transforming Values
NAVIGATION
Intro to Navigation
Stack Navigator
Tab Navigator
Tab Bar Block
Drawer Navigator
Drawer Nav Block
Passing Data
Header Buttons
InterActions
Action Editor
Triggers
Actions
CUSTOM CODE
Intro to Custom Code
Code Editor
Code Assistant
Functions
Files
JSX
Packages
Connecting To Data
REST API Services
REST API Endpoints
WORKING WITH DATA
Fetching Data
Submitting Data
DATA INTEGRATIONS
REST API Integrations
Example Data
Xano
Supabase
Airtable
Back4App
Backendless
Bubble CMS
Webflow CMS
Contentful
Directual
Sheety
Unsplash
Zapier
AUTHENTICATION
Intro to Authentication
Back4App
Backendless
Bubble
Supabase
Xano
EXPORTING, PUBLISHING & SHARING
Intro to Publishing
Publishing Your App to the Apple App Store
Publishing Your App to the Google Play Store
Exporting Your Project
Self-Publishing to the Apple App Store
Self-Publishing to the Google Play Store
Publishing Your App as a PWA
Sharing Your Project Online
GitHub Commit
Push Notifications
Intro to Push Notifications
Push Notifications for iOS
Push Notifications for Android
Sending Push Notifications
Push Notification Actions
Intro to Custom Code
Updated 30 days ago
What’s Next
Learn how to use the Code Editor
Editor
