App Walkthroughs
      Back to home
      1. Knowledge Base
      2. How-To Guides
      3. App Walkthroughs

      How to Build a Member Directory App

      In this step-by-step guide, we will explore the process of creating a Member Directory app through the effective utilization of Knack's user roles.

      Use Case

      The Member Directory app allows users to log in, view a directory of members, and make changes to member records based on user roles.

      Members have the ability to update their own profile and also have access to view other members' records. On the other hand, Admins have the capability to view, edit, and delete member records.

      Requirements

      If this is your first time creating an app, you'll need to know some basics about adding tables, fields, pages, and views. You can start by reading our Builder Basics section. 
      Other good resources can be found in our About Your Database and Working With Pages article in our knowledge base.

       

      Steps

      1.  Defining User Roles

      Defining user roles is an essential step in creating an effective member directory for your business. This will enable Admins to assign tasks and edit fields, while allowing members to view and update their own tasks in the field.

      To enable user activation, navigate to the left navigation panel and select "Settings". From there, choose "User Logins" where you'll locate the "Activate Users" button.

      Clicking on this button will grant you the ability to add User Role tables to your app.

      Image of the Activate Users button in the app's settings

      Note: You can also activate users by selecting "Enable Users" under the User Roles section of your Tables list.

      Adding User Roles

      After activating your users, the next step is to add user roles. In this app, we will create an "Admin" role and a "Member" role. To create these roles, simply click on the green "+" button located next to the User Roles section.

      Image of the add user role button in the Knack Builder

       

      2.  Adding User Records

      There are two methods available for adding records to your user roles in the Builder: manual entry (selecting "Add Record") or importing records.

      Tip:  You can learn more about adding and managing records here.

      Import User Records from a File

      You can also import user records by uploading a file:

      Image of the Import Records button in the Knack Builder

       

      3.  Building Your Pages for the Live App

      Now that we have defined our user roles and added user records, it is time to bring the app together by adding pages.

      Adding an Admin Access Page

      Beyond viewing and editing member records, Admins can also add or delete members.

      To get started, in the Pages section of the Builder, we'll add a new page and require a login to access it. We'll limit permissions to the Admin user role:

      Image of setting permissions to a login page in the Knack Builder

      Tip:  To learn more about adding and working with Pages, see our article here. 

       

      Adding Views to the Page

      When selecting which views to add to this page, we'll select:

      • A grid to display members' details to view more Member fields

      • A form to edit the Member

      Image of adding a grid view to the Admins page in the Knack Builder 

       

      Once the page has been added, next we will need to add a menu view linking to a new page with a form to add new members.

      Image of adding a menu view to the Admins page

      Image of adding a form view to the Add New Member page

      Next, we will need to add the ability to delete records in the Members grid view created on the Admins page. To accomplish this, access the grid view editor.

      Within the "Add Columns" section of the grid view editor, you can include the delete link by selecting "Actions."

      Image of adding an action link to the Members grid view

      Tip:  You can learn more about using action links here.

       

       

      Adding a Member Access Page

      To allow Members to access and modify their Member records, we will need to include a Member access page. This page will require users to log in to view it and will be restricted to Members only.

      Members will have the capability to view and edit their own records, as well as view the records of other Members.

      To get started, we'll add a new page and require a login to access it. We'll limit permissions to the Member user role.

      Image of adding a login page for Members

       

      Once we have added our Member access page, we will need to add a grid view to display Member records. 

      This grid will display Member records and link to view more details about each Member in the grid:

      Image of adding a grid view to the Members page

       

      4.  View Your Live App

      Well done, you have successfully created your member directory! Your page should resemble something like this:

      Image of the Live App

       

      Members will have the capability to access a grid that displays detailed information about each member. Additionally, they will be able to click on a link to view more extensive details about each individual member.

      Admins, on the other hand, will have the authority to view, edit, and delete member information.

       

      Optional Features