What You'll Learn

You'll discover how to retrieve information about your app's pages, tables, fields, views, and users using promise-based methods. This enables dynamic applications that can adapt based on your app's current structure and user context.

👍
Every JavaScript customization must begin with the Knack.ready() method. This ensures the Knack object is fully initialized and the React application has finished mounting before your custom code executes.

Knack.ready().then(async () => {
  // All your custom code goes here
  console.log('Knack is ready for customization!');
});

Page Methods

Access information about the pages in your application:

Knack.ready().then(async () => {
  // Get all pages in your application
  const pages = await Knack.getPages();
  console.log('All pages:', pages);

  // Get a specific page by its key
  const page = await Knack.getPage('scene_123');
  console.log('Specific page:', page);
});

Table and Object Methods

Retrieve information about your data structure:

Knack.ready().then(async () => {
  // Get all tables (objects) in your application
  const tables = await Knack.getTables();
  console.log('All tables:', tables);

  // Get a specific table by its key
  const table = await Knack.getTable('object_1');
  console.log('Specific table:', table);

  // Get all fields for a specific table
  const fields = await Knack.getFields('object_1');
  console.log('Table fields:', fields);

  // Get a specific field
  const field = await Knack.getField('field_1', 'object_1');
  console.log('Specific field:', field);
});

👍
Tip: Field and object keys typically look like field_1, object_1. Use the actual keys from your app

View Methods

Access information about views on specific pages:

Knack.ready().then(async () => {
  // Get all views for a specific page
  const views = await Knack.getViews('scene_123');
  console.log('Page views:', views);

  // Get a specific view
  const view = await Knack.getView('view_456', 'scene_123');
  console.log('Specific view:', view);
});

User and Authentication Methods

Get information about the current user and their permissions:

Knack.ready().then(async () => {
  Knack.on('page:render', ({ pageKey }) => {

  // get the user token promise

    Knack.getUser()

    // all code where the token will be used need to happen within the .then portion of the code below.

      .then((user) => {
        if (user) {
          let token = user.token
          let id = user.id
          let email = user.email
          console.log('user id: ', id)
          console.log('email: ', email)
          console.log('token: ', token)
        }
      })
  })
})

Option 1 - Event-Based (Runs on every page)

Use Option 1 if you need fresh user data on every page

Knack.on('page:render', () => {
  Knack.getUser().then(user => {
    // Runs every time user navigates to a new page
  })
})

Option 2 - One-Time (Runs only at startup)

Use Option 2 if you need it once for global setup

Knack.ready().then(() => {
  Knack.getUser().then(user => {
    // Runs only once when app loads
  })
})

Application Details

Retrieve metadata about your application:

Knack.ready().then(async () => {
  // Get application metadata
  const appDetails = await Knack.getApplicationDetails();
  console.log('Application details:', appDetails);

SchemaApplicationDetails {
 id: string;
 name: string;
 slug: string;
 description: string;
 settings: {
   users: {
     registration_type: string;
     invitation_required: boolean;
     self_registration: boolean;
   };
   region: string;
   timezone: string;
   language: string;
 };
}

Best Practices

Error Handling

Wrap API calls in try-catch blocks:

Knack.ready().then(async () => {
  try {
    const user = await Knack.getUser();
    const roles = user?.roles || [];
    console.log('User loaded:', user?.email, roles);
  } catch (error) {
    console.error('Failed to load user data:', error);
  }
});

Caching Results

The Knack object automatically caches results, but you can store frequently accessed data:

Knack.ready().then(async () => {
  let cachedTables;

  async function getTablesCached() {
    if (!cachedTables) {
      cachedTables = await Knack.getTables();
    }
    return cachedTables;
  }

  // Usage
  const tables = await getTablesCached();
  console.log('Cached tables:', tables);
});