How to Integrate Retool with Thinkific

Before configuring Retool, gather two pieces of information from your Thinkific school: your API key and your subdomain. Sign in to your Thinkific school admin panel. To find your subdomain, look at your browser's address bar — your Thinkific admin URL is in the format yourschool.thinkific.com/admin. The subdomain is the 'yourschool' portion before .thinkific.com. Write this down as you will need it for the Resource header configuration. To generate an API key, navigate to Settings in the left sidebar of your Thinkific admin panel. Click 'Code & API' or look for an 'API' tab in settings — the location varies slightly depending on your Thinkific plan. On the API settings page, you will find your API key displayed or a 'Reveal' button to show it. Copy the API key value. If no API key exists yet, look for a 'Generate' or 'Regenerate' button. Thinkific provides a single API key per school account — it is not possible to create multiple keys with different scopes. The API key provides full read and write access to your school's data, so treat it with the same security as a password. Store it temporarily somewhere safe — you will paste it into Retool's Resource configuration in the next step. Note that Thinkific API keys do not expire unless explicitly regenerated, but if you regenerate the key, you must update it in Retool immediately to avoid API authentication failures.

In Retool, navigate to the Resources tab from your organization's homepage sidebar. Click '+ Create new', scroll through the connector list, and select 'REST API'. Set the Name to 'Thinkific API'. Set the Base URL to https://api.thinkific.com — this is Thinkific's central API host, not your school-specific URL. For Authentication, select 'No authentication' from the dropdown — Thinkific uses custom headers rather than the standard Bearer token or Basic auth schemes that Retool's built-in auth options cover. In the Headers section, click 'Add header' three times to add the required headers. First, add X-Auth-API-Key with your Thinkific API key as the value. Second, add X-Auth-Subdomain with your school subdomain as the value (e.g., yourschool, not the full yourschool.thinkific.com domain). Third, add Content-Type with value application/json. These three headers are required on every Thinkific API request — the API key authenticates you, the subdomain routes the request to your school, and the content type ensures JSON encoding. Click 'Test connection'. Thinkific's root API endpoint may return a 404 since there is no base path, but if the network request reaches Thinkific without a DNS or connectivity error, the resource is configured correctly. Click 'Save resource'.

Open a Retool app and navigate to the Code panel at the bottom. Click '+ New query', select your Thinkific API resource, and name the query getCourses. Set the Method to GET and the URL path to /api/v1/courses. Add URL parameters: set page to 1 and limit to 50 (Thinkific's maximum per-page response). Click 'Run query'. Thinkific returns a JSON object with a items array containing course objects and a meta object with pagination info (total_count, next_page, previous_page). Each course in the items array has fields including id, name, slug, description, price, course_card_image_url, duration, and status ('published' or 'draft'). Create a transformer that filters to only published courses and extracts the fields you need for display. Bind the transformed output to a Table component by dragging a Table onto the canvas and setting Data source to {{ getCourses.data }}. To get enrollment data, create a second query named getEnrollments with path /api/v1/enrollments. Add parameters including page, limit (50), and course_id set to {{ coursesTable.selectedRow.id }} to filter enrollments for the selected course. The enrollments response includes user data (id, email, first_name, last_name) and enrollment metadata (activated_at, completed_at, percentage_completed, is_free_trial, created_at, and updated_at for the last activity timestamp).

1// Transformer: flatten Thinkific courses response
2const courses = data.items || [];
3return courses
4  .filter(c => c.status === 'published')
5  .map(c => ({
6    id: c.id,
7    name: c.name,
8    slug: c.slug,
9    price: c.price ? `$${(c.price / 100).toFixed(2)}` : 'Free',
10    status: c.status,
11    duration: c.duration || 'N/A'
12  }));

Thinkific's enrollments endpoint returns raw completion data that needs transformation to be useful for dashboards. Each enrollment includes percentage_completed (a number 0-100), activated_at (when the student first accessed the course), completed_at (null if not finished), and updated_at (the last time any enrollment record was modified, which approximates last activity). Create a JavaScript query named enrollmentMetrics that processes the getEnrollments response and calculates per-enrollment derived fields for display. The transformer should calculate: days since enrollment (from created_at to today), days since last activity (from updated_at to today), enrollment status classification ('Completed' when completed_at is not null, 'Active' when updated within 14 days, 'At Risk' when updated 14-30 days ago, 'Inactive' when updated over 30 days ago), and format the percentage_completed as a display string. Also create a summary statistics query named courseSummary using the same data to calculate overall completion rate (enrollments with completed_at not null / total enrollments × 100), average completion percentage across all enrollments, count of active students, and count of at-risk students. Display summary statistics in Stat components above the enrollments Table, and use the status classification in the Table to color-code rows: green for Completed, blue for Active, yellow for At Risk, red for Inactive.

1// Transform enrollments with derived activity and status fields
2const enrollments = getEnrollments.data?.items || [];
3const today = new Date();
4
5return enrollments.map(e => {
6  const enrolledAt = e.created_at ? new Date(e.created_at) : null;
7  const lastActivity = e.updated_at ? new Date(e.updated_at) : null;
8  const daysEnrolled = enrolledAt ? Math.floor((today - enrolledAt) / (1000 * 60 * 60 * 24)) : null;
9  const daysSinceActivity = lastActivity ? Math.floor((today - lastActivity) / (1000 * 60 * 60 * 24)) : null;
10
11  const status = e.completed_at ? 'Completed'
12    : daysSinceActivity === null ? 'Unknown'
13    : daysSinceActivity <= 14 ? 'Active'
14    : daysSinceActivity <= 30 ? 'At Risk'
15    : 'Inactive';
16
17  return {
18    student_name: `${e.user?.first_name || ''} ${e.user?.last_name || ''}`.trim() || 'N/A',
19    email: e.user?.email || 'N/A',
20    enrolled_at: enrolledAt ? enrolledAt.toLocaleDateString() : 'N/A',
21    completion_pct: `${Math.round(e.percentage_completed || 0)}%`,
22    status,
23    days_enrolled: daysEnrolled ?? 'N/A',
24    days_since_activity: daysSinceActivity ?? 'N/A',
25    completed: e.completed_at ? new Date(e.completed_at).toLocaleDateString() : null
26  };
27});

To build revenue visibility into your Thinkific dashboard, create queries for the orders endpoint. Create a query named getOrders with Method GET and path /api/v1/orders. Add URL parameters to filter by date range using created_at[gte] and created_at[lte] bound to a DateRangePicker component in your app — for example, set created_at[gte] to {{ dateRange.start }} and created_at[lte] to {{ dateRange.end }}. Also set limit to 50 and page for pagination. The orders response includes user information, amount_in_cents (the amount charged in cents), created_at, status ('complete', 'pending', or 'refunded'), coupon_id, and a course or bundle reference. Create a JavaScript transformer named orderSummary that aggregates the orders response: sum amount_in_cents for all complete orders and convert to dollars, count of complete orders, count of refunded orders, and calculate the refund rate as a percentage. Display these as Stat components: Gross Revenue, Orders Completed, Refund Rate. A Table below shows all individual orders with student name, email, course name, amount paid, coupon code if any, and status. Add a DateRangePicker component linked to the getOrders query's date parameters so finance staff can review any billing period on demand. For complex Thinkific deployments integrating with payment processors, CRM systems, and accounting tools for automated revenue reporting, RapidDev's team can help architect the complete Retool solution.

1// Calculate order revenue summary
2const orders = getOrders.data?.items || [];
3
4const completedOrders = orders.filter(o => o.status === 'complete');
5const refundedOrders = orders.filter(o => o.status === 'refunded');
6
7const grossRevenue = completedOrders.reduce((sum, o) => sum + (o.amount_in_cents || 0), 0);
8const refundAmount = refundedOrders.reduce((sum, o) => sum + (o.amount_in_cents || 0), 0);
9
10return {
11  gross_revenue: `$${(grossRevenue / 100).toFixed(2)}`,
12  net_revenue: `$${((grossRevenue - refundAmount) / 100).toFixed(2)}`,
13  completed_orders: completedOrders.length,
14  refunded_orders: refundedOrders.length,
15  refund_rate: orders.length > 0
16    ? `${Math.round((refundedOrders.length / orders.length) * 100)}%`
17    : '0%'
18};