Build Your Own Social Media Command Center

This is a walkthrough for making your own private analytics dashboard — the kind that pulls your TikTok and Instagram into one page you check every week.

It runs on your own computer. There is no website to sign up for, no monthly fee for the dashboard itself, and nothing about your accounts gets uploaded anywhere. You build it once, connect it to your accounts, and then it updates itself.

You do not need to know how to code. You will hand the work to Claude, and you will spend most of your time clicking through two setup websites.

What it shows

Your total audience across TikTok and Instagram, and how it moved since last week
A growth chart that builds up one point per week
A card for each platform with followers and recent numbers
Your best-performing posts, ranked
A calendar showing how often you post

What you need

A Mac (if you use Windows, just tell Claude at the start and it will adjust the steps)
Claude Code, the tool that builds the dashboard for you. Get it at claude.com/claude-code and follow the install steps there.
Node.js, a small free tool the sync uses. Install it from nodejs.org, or ask Claude Code to help you get it.
Your TikTok and Instagram logins
About 45 minutes. Most of that is clicking through the TikTok and Instagram developer sites, which is free.

Step 1: Build the dashboard

First, make an empty folder on your computer for the project. Your Desktop is a fine spot. Open Claude Code inside that folder.

Inside the chat, use the /goal command.

Then paste in the prompt below. Before you send it, replace the two account links with your own.

Build me a personal social media analytics dashboard,
following the template from this TikTok video:
https://www.tiktok.com/@tess.barclay/video/7621583403368041748

It runs on my own Mac. It brings my TikTok and Instagram into one page
that I check once a week, styled to my personal brand. Keep it fully private:
a plain HTML, CSS and JavaScript page with no login and no online server, all
data saved in my own browser.

My accounts:
TikTok: https://www.tiktok.com/@yourhandle
Instagram: https://www.instagram.com/yourhandle

The dashboard should include:
- A headline with my total audience across both platforms and the change
  since last week
- A row of stats for the last 7 days: net new followers, engagement, reach,
  and posts
- A growth chart that adds one point each week as I file new numbers
- A card for each platform with followers, a small trend line, and recent stats
- A "best posts" section that ranks my strongest posts
- A posting calendar heatmap for the last 10 weeks
- A weekly "file this week's numbers" step that records the week and drives
  the week-over-week comparisons

Also build a sync script in Node.js that pulls my real numbers automatically
from the official TikTok Display API and Instagram Graph API. It should
collect follower counts, posts, reach, and engagement, plus my recent
individual posts so the "best posts" section and the posting calendar fill
in by themselves.

Connection details that matter:
- TikTok uses OAuth with PKCE. Its code challenge must be a hex-encoded
  SHA256 of the code verifier, which is TikTok's own variant rather than the
  usual base64. Send the redirect address http://127.0.0.1:5176/callback/
  and run a small local server on port 5176 to catch the reply. In TikTok's
  developer portal the redirect address has to be saved as a wildcard,
  http://127.0.0.1:*/callback/.
- Instagram uses OAuth with the redirect address
  https://localhost:5177/callback. There is no local HTTPS server, so let me
  paste the redirected web address by hand.
- Keep my API keys in a separate config file that is never uploaded.

Finally, make two files I can double-click: one that starts a local server
and opens the dashboard, and one that runs the sync.

If any part of the setup throws an error later, I will paste it back to you
and we can fix it together.

Claude will create a folder of files and a working dashboard. At first it shows sample numbers so you can see the layout. The next steps connect it to your real accounts.

Keep Claude Code open. If anything goes wrong later, you will paste the error back to it.

Step 2: Connect TikTok

This lets the dashboard read your TikTok numbers on its own. You will set up a free developer app on TikTok’s website.

Go to developers.tiktok.com and log in with your TikTok account. Agree to the developer terms if it asks.
Click “Manage apps”, then “Connect an app”. Give it any name, such as “My Dashboard Sync”.
Add the “Login Kit” product to the app. You do not need any other product.
At the top of the app page there is a switch between “Production” and “Sandbox”. Click “Sandbox”, and do the rest of these steps inside it. Do not click “Submit for review” — you do not need a review.
Find the “Platforms” section and check the “Desktop” box.
Find the “Redirect URI” field under Login Kit and click the “Desktop” tab. Type this in exactly, including the star and the slash at the end: http://127.0.0.1:*/callback/

This exact form is the one TikTok accepts. The word “localhost” and plain port numbers both get rejected, so use this and nothing else.
Find the “Scopes” section and add these three: user.info.basic, user.info.stats, video.list.
The Sandbox makes you fill in app details: a category, a description, a Terms of Service link, and a Privacy Policy link. None of this is reviewed by anyone, so a short description is fine, and for the link fields you can use your own TikTok profile address.
Open “Sandbox settings” and add your own TikTok account as a target user.
Open “App details” inside the Sandbox and copy the “Client key” and the “Client secret”.

Now open the config file Claude made. It is named config.json, inside the sync folder of your project. Open it in any text editor. Paste your Client key and Client secret in where it says PASTE_YOUR_TIKTOK_CLIENT_KEY and PASTE_YOUR_TIKTOK_CLIENT_SECRET.

Paste each value between the quotation marks, and keep the quotation marks. If your text editor curls the quotes into fancy ones, turn that off (in TextEdit it is under Edit → Substitutions → uncheck Smart Quotes).

Step 3: Connect Instagram

Instagram’s API only works with a Professional account, which is free.

In the Instagram app on your phone, open Settings → “Account type and tools” → “Switch to professional account”. Choose “Creator”. You can switch back later if you want.
On your computer, go to developers.facebook.com and log in with your Facebook account. If you do not have one, create one.
Click “Create App”. Give it any name. The business portfolio dropdown can stay empty. For the use case, pick the Instagram option if you see one, otherwise pick “Other” and then choose “Business” as the type. Finish creating it.
You are now on the app dashboard. Find “Instagram” in the product list, click “Set up”, and choose “API setup with Instagram login”.
Your “Instagram app ID” and “Instagram app secret” are shown near the top of this page. You will copy them in a moment.
Find the section called “Set up Instagram business login” and click its “Set up” button. In the panel that opens, find the redirect field and type this in exactly: https://localhost:5177/callback

It has to start with https. Plain http gets rejected.
In the left menu, open “Permissions” and make sure both of these are added: instagram_business_basic and instagram_business_manage_insights.
Make your account a tester. This has two parts, and the order matters:
- Open the app’s “Roles” page. Under “Instagram Testers”, add your Instagram username. This sends an invite.
- Go to instagram.com/accounts/manage_access in a web browser, signed in as that account, and accept the invite.
Copy the “Instagram app ID” and “Instagram app secret” from step 5.
Open config.json again and paste them in where it says PASTE_YOUR_INSTAGRAM_APP_ID and PASTE_YOUR_INSTAGRAM_APP_SECRET. Keep them inside the quotation marks.

Step 4: Turn on the sync

In your project folder, double-click the file sync.command. A window opens and your browser asks you to approve access.
- For TikTok, click Allow. The window handles the rest on its own.
- For Instagram, click Allow. Your browser will land on a page that says it cannot be reached. That is expected. Copy the full web address from the address bar and paste it into the sync window when it asks.
When the sync finishes, double-click serve.command. Your dashboard opens in the browser.
Click “Update this week’s numbers”, look the numbers over, and click “File the edition”.

Your dashboard is now live with your real data.

Your weekly routine

Pick one day a week and stick with it. Monday works well.

Double-click sync.command to pull fresh numbers
Double-click serve.command to open the dashboard
Click “Update this week’s numbers”, then “File the edition”

That is about two minutes. The growth chart and the week-over-week comparisons fill in as the weeks add up. Your best posts and your posting calendar update on their own every time you sync.

If something goes wrong

The two developer sites are fiddly, and most people hit at least one snag. The fastest fix is always the same: copy the error message, paste it into Claude Code, and ask it to help. It knows the whole project and will walk you through it.

A few common ones:

TikTok will not save the redirect address. Check that you typed http://127.0.0.1:*/callback/ exactly, with the star and the trailing slash, on the Desktop tab.
Instagram says “Insufficient Developer Role”. You have not accepted the tester invite yet. Go to instagram.com/accounts/manage_access and accept it.
Instagram will not save the redirect address. It must start with https, not http.
The sync says it needs Node.js. Install it from nodejs.org and run the sync again.

A note on privacy

Everything stays on your own computer. Your API keys live in the config file on your machine and are never uploaded. Your numbers are saved only in your own browser. The dashboard has no account and no server. It is yours, and it is private.