Uncodie
Technical DocumentationNo CodeTutorialsChangelogDisccord
No Code
No Code
  • 🏁Getting Stared
    • 🥳Introduction
      • What is Uncodie?
      • App
      • Figma No Code Plugin
        • How to associate your Figma token to Uncodie?
        • How to associate an Uncodie project to figma?
  • 📖Basic Concepts
    • 🧩Components
      • Screen Page
        • Screen Layout
        • Screen Content
      • Table View
        • Table View Header
        • Table View Row
        • Table View Cell
      • Form
        • Text Area
        • Selector
        • Input
        • Button
        • Output
      • HTML components
        • Headers
          • H1
          • H2
          • H3
          • H4
          • H5
        • Title
        • Parragraph
        • List
        • Iframe
        • Video
        • Audio
        • Link
        • Progress
        • Meta
        • Image
        • SVG
      • Advanced
        • Chart
          • Style Personalization
        • Repeat
        • Loading
    • 🎨Appearance
      • Visibility
      • CSS
      • Adaptative Design
      • Responsive Design
    • 🏗️Prototyping
      • Modals
      • Variants
      • Navigation
    • 🔤Variables
    • 💽Data Sources
      • Collections
      • Queries
      • Scripts
    • 🔍Data Binding
    • ⚡Actions
      • Scripts
      • Events
    • 🧑User Management
      • Privacy
    • 🍪SEO and Tracking
      • Capabilities
      • HTML Head Scripts
    • ☁️Publish and Deploy
      • Custom Domains
Powered by GitBook
On this page
  • Overview
  • Setup
  • Screen Component
  • Creating a New Path
  • Using Path Querie Variables

Was this helpful?

  1. Basic Concepts
  2. Components

Screen Page

Screens are users access point to your app

PreviousComponentsNextScreen Layout

Last updated 1 year ago

Was this helpful?

Overview

Uncodie uses a special component for screen declaring in your app, screens will publish your Frame or Component design in a URL accessible from your app domain or in localhost. By protecting a Screen component Uncodie applications will ask the visitor to log in to interact with your page.

Setup

  1. Open the IDE

  2. Select the Figma component you want to make a screen

  3. Navigate to the Components Section

  4. Select Screen Component

  5. Select the path for your screen

  6. Click Save

  7. Compile your app

Screen Component

To declare a new Screen select a component and use the Screen component in the IDE you will be required to declare the screen path and you can inheirt a content wrapper settings and design.

Creating a New Path

To publish a new path you are required to configure a screen component in your app

Using Path Querie Variables

You can declare variables in your path to interact with the information on your screen.

For more information about URL and Route Variables see:

📖
🧩
🔤Variables