Concepts n Strategies

Let's connect your Task Organiser

This one-time setup takes about 10 minutes. No coding knowledge needed — just follow the pictures below, step by step.

Your Task Organiser needs somewhere safe on the internet to keep everyone's tasks, so the whole team sees the same board at the same time. We use a free service called Supabase for that — think of it as a locked filing cabinet in the cloud that only your app can open. You only have to set this up once.
Already have your own server (not just a website)? If whoever manages your hosting has a VPS or cloud server with admin/SSH access — not just a plan that serves web pages — you can run this same filing cabinet on your own domain instead of using the free cloud version below. Ask them: "Do we have a VPS or cloud server, and can we install Docker on it?" If yes, hand them SELF_HOSTING.md instead of this guide. If you're not sure, the steps below are the easier starting point — you can always move to your own server later without changing the app itself.
1

Create your free storage account

Open your web browser and go to supabase.com. Click the button to sign up (you can usually sign up with your Google account in one click). Then click "New Project".

  • Give the project a name — your company name is fine.
  • Set a database password. Write this down somewhere safe — you probably won't need it again, but keep it just in case.
  • Pick the region closest to you, then click "Create new project".
  • It takes a minute or two to get ready — like a kettle boiling. That's normal.
supabase.com/new New Project Project name — e.g. Acme Textiles Database password •••••••• Create new project
2

Give it the app's blueprint

Once your project is ready, look at the menu on the left for an icon that looks like </> — it's called SQL Editor. Click it, then click "New query".

  • In the folder you downloaded, open the sql folder, then open schema.sql in any text editor.
  • Select everything in that file and copy it (Ctrl+A then Ctrl+C, or Cmd+A then Cmd+C on Mac).
  • Paste it into the empty box on the Supabase page, then click the green Run button.
</> SQL Editor create table public.organizations (   id uuid primary key ...   name text not null ); ⋮ (pasted from schema.sql) Run
If it says "Success. No rows returned" — that's exactly what you want to see. It worked.
3

Copy your two connection details

On the left-hand menu, click the gear icon ⚙ for Project Settings, then click API. You'll see two boxes — copy each one (there's usually a little copy icon next to them).

  • Project URL — a web address starting with https://
  • anon public key — a long string of letters and numbers
Project Settings → API PROJECT URL https://abcxyz123.supabase.co Copy ANON PUBLIC KEY eyJhbGciOiJIUzI1NiIsInR5cCI6... Copy
4

Paste them into one small file

In the downloaded folder, open the js folder, then open config.js using a plain text editor — right-click the file, choose "Open with", then Notepad (Windows) or TextEdit (Mac).

  • Replace the text between the quotes after SUPABASE_URL: with the Project URL you copied.
  • Replace the text between the quotes after SUPABASE_ANON_KEY: with the anon public key you copied.
  • Save the file (Ctrl+S or Cmd+S), then close it.
config.js — Notepad window.CNS_CONFIG = { SUPABASE_URL: "https://abcxyz123.supabase.co", SUPABASE_ANON_KEY: "eyJhbGciOiJIUzI1NiIs...", }; ← paste here
5

Put it online for your team

To try it yourself first, just double-click index.html in the downloaded folder. To let your whole team use it, upload the entire folder (all files, keeping the same folder structure) to wherever your company's website already lives.

  • If you already have a web host or IT person — hand them the folder and this guide.
  • If not, free options like Netlify or Vercel let you drag-and-drop the folder to get a working web address in minutes.
Your folder Your website / hosting

You're live 🎉

Reload the page (or open your new web address). The very first person should choose "Start a new department" — that makes them the head of that department and gives them an invite code. Everyone else signs up and enters that code to join.

Plain-language glossary

Supabase
The free online service that stores your team's tasks and handles sign-in. You only set it up once.
Project URL / anon key
Think of these as an address and a name-tag your app uses to find and talk to your storage. They are not passwords and are safe to be visible inside the app's code.
SQL Editor
A box on the Supabase website where you paste one block of setup instructions, one time, to create the storage your app needs.
Department / invite code
Each team using the app has its own private space. The code is how new teammates join the right one.
← Back to the Task Organiser