DEV Community: Barsolasco, Dearah Mae

Your Video Call Isn’t A Classroom. Here’s What It Is.

Barsolasco, Dearah Mae — Thu, 10 Sep 2026 10:46:00 +0000

Every ed-tech team hits the same wall eventually: your video call works fine for a meeting, but a classroom needs more. A teacher who can promote a student's mic, a whiteboard that stays in sync for forty kids, breakout rooms that don't fall over. Building that stack from raw WebRTC is a semester-long project by itself. So instead of building it, I set out to stand up Agora's Flexible Classroom (the desktop build) and see how far a .env file and an afternoon could actually get me.

It got me further than expected. This is the walkthrough I wish I'd had going in: what Flexible Classroom actually is, the exact steps that got it running locally, and, because a working demo isn't the same as a reason to use it, where this kind of setup earns its keep in the real world.

What you're actually installing

Flexible Classroom isn't a video-call widget you drop into a page. It's a pre-built classroom UI, with layouts, roles, and interaction patterns already assembled, sitting on top of Agora's real-time engine. Under the hood you get low-latency video and audio over Agora's SD-RTN, a real-time messaging channel for state sync, and an interactive whiteboard, all wrapped in scenarios the docs call "small classes," "1-on-1," and "lecture hall." This particular repo builds it as an Electron desktop client rather than a browser tab: same engine, packaged as a native app for Windows and macOS.

**Why that distinction matters. **You're not writing signaling logic or reconnect handling. You're configuring credentials and picking a role. The trade-off is you inherit Agora's opinions about layout and UX, which is exactly what makes the "from scratch to first class" timeline realistic in an afternoon rather than a quarter.

What's actually inside it

Before touching a terminal, it's worth knowing what you're getting for that .env file. Flexible Classroom ships as a set of pre-built scenes (the SDK in this repo alone is split into a classroom UI kit, an education-core state layer, and a real-time transport layer) bundled into four feature groups.

Communication

Live video & audio over Agora's SD-RTN, tuned for classroom-scale participant counts
Screen sharing for slides, code, or any application window
Shared whiteboard, built in rather than bolted on: freehand drawing, shape and text tools, multi-page docs, and live PDF/image annotation, with every stroke mirrored to each participant in the room as it's drawn
Built-in text chat alongside the video layout: a room-wide channel plus 1:1 private messages, with teacher-side muting so a big room doesn't turn into noise

Engagement

Hand-raise queue so a teacher can bring one student on stage at a time
Live polling and **pop-up quizzes **pushed to every student mid-session, with results tallied in real time
Reward/points system for lightweight participation feedback
Countdown timers for timed exercises inside a live class

Roles & management

Teacher / Student / Assistant roles, each with distinct permissions out of the box
Attendance tracking logged automatically per room
Mute, remove, or promote any participant from the teacher console
Session recording for later playback or compliance

Platform

Three built-in scenarios (1-on-1, small class, and lecture hall), each a different pre-tuned layout
Web, desktop (Electron), and mobile builds from the same core SDK
**Custom branding **via the UI kit's theming layer
ISO / SOC 2-aligned security posture on the underlying Agora infrastructure

1-on-1 tutoring → small class, ~50 students → lecture hall, large cohorts: same SDK, different scene config.

The optional layer: widgets and proctoring

None of what's above is hard-wired into the layout. Every one of it, whiteboard included, is its own bundle in the SDK's plugin gallery, loaded per scene, which is what makes the next tier possible: features you only turn on for a specific kind of session.

whiteboard · chatroom · vote / polling · answer / quiz · countdown counter · watermark · stream-media · webview embed

Proctoring (separate SDK)

This is the one that's genuinely separate, not just switched off by default. It ships as its own package, agora-proctor-sdk, and even packages into its own standalone desktop client, distinct from the classroom app itself. It turns a room into an invigilated exam session rather than a lesson.

**Locked-down exam view **replacing the normal classroom layout
Continuous camera monitoring for the duration of the session
Same real-time transport as the classroom SDK, so no separate infra to stand up
Opt-in only: it's a separate install, not a toggle inside a normal class

Setting it up, step by step

1. Get the prerequisites in place
Git, Node.js 16 specifically (18+ isn't supported yet), and Yarn. An Agora account with a project that has Flexible Classroom enabled in the console. And, less obviously, a connection with no firewall getting in the way of real-time media ports.

enable yarn via corepack (node 16.10+) 

corepack enable

2. Clone the desktop repo and pin the release
I stayed on release/2.9.0. Matching what's actually deployed matters more than chasing main when you're evaluating the platform.

git clone https://github.com/AgoraIO-Community/flexible-classroom-desktop.git
cd flexible-classroom-desktop
git checkout release/2.9.0

3. Pull in the submodules
The classroom UI, the whiteboard bindings, and the Electron shell each live as their own package. This one command fetches and links all of it.

yarn install:packages

4. Drop in your App ID and certificate
These come from the Agora Console project you enabled Flexible Classroom on. With both set, the client generates its own RTM token at runtime, so no separate auth step is needed for local testing.

# .env
REACT_APP_AGORA_APP_ID={your app id}
REACT_APP_AGORA_APP_CERTIFICATE={your app certificate}

5. Launch it
This starts the dev build and serves the classroom UI locally.

yarn dev

http://localhost:3000

6. Prove it with two roles
Join a room as Teacher in one window, then join the same room name as Student from a second window or device. This is the moment it stops being a config file and starts being a classroom: video tiles populate, the whiteboard syncs live, and the teacher can mute, promote, or hand off drawing control.

7. Optional: pack it as a native client
Because this is the desktop variant, the same build can be shipped as an actual installable app rather than a browser tab.

yarn ci:build
yarn pack:electron:mac # or pack:electron:win

Before this touches real students
The bundled token generator is there so you can get to a working demo without standing up backend infrastructure first. It is not meant to survive contact with production. Swap it for a real token server before anyone outside your laptop joins a room.

Where this setup actually pays off

A working local build is a proof of concept. These are the shapes of the real deployments it's built for.

K-12 remote & hybrid classes
Small Class · Whiteboard

One teacher, a full roster of students, and a whiteboard that needs to feel like the front of a real room, with hand-raising, mic control, and screen share included by default.

Corporate onboarding & L&D
Lecture Hall · Recording

Live cohort training where the same session needs to be recorded, replayed, and tracked for completion, without engineering a bespoke video pipeline for HR.

1-on-1 tutoring & exam prep
1-on-1 · Low Latency

Just a tutor and a student sharing an annotated whiteboard in real time. It's the lightest of the three modes, and the one where sub-second latency is felt the most.

Bootcamps & lab sections
Breakout · Electron

Breakout groups working through an exercise while an instructor drops between rooms. Desktop packaging matters here since labs often run on locked-down campus machines.

What I'd tell the next person doing this

Pin the Node version before you do anything else. Node 18 will get you an install that looks fine and a runtime that isn't. Past that, the honest surprise wasn't the video or the audio, both of which just worked; it was the whiteboard staying pixel-in-sync between a teacher window and a student window on different machines, with nothing I had to configure for it. That's the actual pitch for a platform like this: not that it saves you from writing video code, but that it saves you from debugging the failure modes of video code you didn't write carefully enough the first time.

Resources

#Agora #FlexibleClassroom #FlexibleOnlineClasroom #ConversationalAI #RTC #Real-Time-Communication #Real-Time-Engagement

I Built a Voice-Based Daily Reflection Companion under 15 Minutes Using Agora Agents SDK

Barsolasco, Dearah Mae — Thu, 10 Sep 2026 10:17:33 +0000

I expected to spend a weekend on working on my vision. Instead, I had a voice agent asking me "How was your day?" in under 15 minutes. What surprised me most wasn't the speed - it was that when I interrupted the voice AI agent I named "Compass" mid-sentence to change my answer, she just stopped and listened. No stuttering, no doubled audio, no ghost speech finishing in the background. It just worked, out of the box, without a single line of interruption-handling code on my end.

Why Voice Agents Are Still a Pain to Build (Normally)

If you've tried to build a voice agent from scratch, you know the pipeline looks deceptively simple on a whiteboard: speech in, text to LLM, speech out. The reality is messier.

You need a WebRTC or WebSocket layer to stream audio in real time. You need to integrate STT (and handle partial transcripts), stream tokens to TTS, manage token refresh, handle network retries, detect when the user starts speaking mid-sentence, and somehow prevent the agent from continuing its TTS output while the user is already replying. That's before you write a single line of actual product logic.

The Agora Agents SDK removes every item on that list. It's built on top of Agora's existing RTC infrastructure, which is the same real-time communications network that powers video calling for hundreds of millions of users. The SDK wraps that into a Python (or TypeScript or Go) library where you describe what your agent should do, not how the audio pipeline should work.

What I Built

Daily Reflection Companion
a voice AI named Compass that guides users through a structured end-of-day reflection: a daily check-in, a meaningful moment exploration, a gratitude round, a forward intention, and then an AI-generated written summary of the conversation.

Backend: Python + FastAPI
Agent pipeline: Deepgram STT → OpenAI GPT-4o-mini → MiniMax TTS
Frontend: HTML/JS + Agora Web SDK (no build tooling)

Phase 1: Setup - From Zero to First Voice

Install

pip install agora-agents fastapi uvicorn[standard] python-dotenv openai

That's it. The SDK installs in under 10 seconds. Imports are under agora_agent (note: no hyphen at import time).

Credentials You'll Need

Create a free account @console.agora.io
Create a project, and enable the Conversational AI feature.
You'll get an App ID and an App Certificate.
You also need an OpenAI API key (for the LLM and for generating the post-session summary) and DeepGram API key

Copy your .env.example to .env:

AGORA_APP_ID=your_app_id
AGORA_APP_CERTIFICATE=your_certificate
OPENAI_API_KEY=sk-…
DEEPGRAM_API_KEY=your_deepgram_key

Note: The Agora console's Conversational AI toggle is not prominently labelled. I spent about 4 minutes finding it - it lives under Project Settings → Features. Once enabled, everything worked on the first try.

Phase 2: The Core Code

The builder chain
The entire STT → LLM → TTS pipeline is configured in one fluent chain. Here's the real code from agent.py:

from agora_agent import (
  Agent, Agora, Area,
  DeepgramSTT, OpenAI as AgoraOpenAI, MiniMaxTTS,
  expires_in_hours,
)

client = Agora(area=Area.US, app_id=app_id, app_certificate=app_certificate)

agent = (
  Agent(client=client, turn_detection={"language": "en-US"})
  .with_stt(DeepgramSTT(model="nova-3", language="en"))
  .with_llm(
    AgoraOpenAI(
    model="gpt-4o-mini",
    system_messages=[{"role": "system", "content": REFLECTION_SYSTEM_PROMPT}],
    greeting_message="Hello! I'm Compass. How was your day today?",
    failure_message="I didn't quite catch that. Could you say that again?",
    max_history=50,
    params={"max_tokens": 150, "temperature": 0.75},
    )
  )
  .with_tts(MiniMaxTTS(model="speech_2_6_turbo", voice_id="English_captivating_female1"))
)

Every line is intentional:

turn_detection={"language": "en-US"} - tells the VAD (Voice Activity Detection) which language's speech patterns to use for end-of-turn detection. This directly affects how quickly the agent recognises you've finished speaking.
max_history=50 - the agent's LLM receives up to 50 turns of conversation as context. Critical for a reflection agent that needs to remember what was said early in the session.
max_tokens=150 - voice replies need to be short. Capping at 150 tokens enforces this at the model level, not just the prompt.
greeting_message - the agent speaks this immediately when the session starts, without waiting for the user to speak first. No extra session.say() call needed.

The System Prompt (condensed)

The reflection flow is driven entirely by the LLM system prompt. No explicit state machine, no conditional logic in the server code. The prompt instructs the agent to move through five phases naturally:

PHASE 1 - DAILY CHECK-IN: Ask one meaningful follow-up after the user's response.
PHASE 2 - MEANINGFUL MOMENT: Explore one significant experience.
PHASE 3 - GRATITUDE: Ask for 2–3 things they're thankful for.
PHASE 4 - TOMORROW'S INTENTION: Ask for one thing they'd like to carry forward.
PHASE 5 - CLOSING: Offer a warm, personalised goodbye.
VOICE RULES: Keep all responses under 35 words. One question per turn. No markdown.

The "under 35 words" constraint was the most important prompt engineering decision. Voice synthesis doesn't render markdown, and long replies feel like lectures, not conversations.

Starting a Session
session = agent.create_session(
channel=f"reflection-{int(time.time())}",
agent_uid="999",
remote_uids=["*"],
idle_timeout=90,
expires_in=expires_in_hours(1),
)
agent_id = session.start()

session.start() is a single blocking call that provisions the agent, connects it to the RTC channel, and returns an agent_id. The channel name is how the browser's Agora Web SDK joins the same audio room.

Summary

After the conversation ends, I call session.get_history() to retrieve the transcript and send it to GPT-4o-mini with a structured summary prompt:

history = session.get_history()
# Format turns into a readable transcript, then:
response = openai_client.chat.completions.create(
model="gpt-4o-mini",
messages=[
{"role": "system", "content": SUMMARY_PROMPT},
{"role": "user", "content": f"Transcript:\n\n{transcript}"},
],
max_tokens=200,
)
return response.choices[0].message.content

The summary appears on-screen after the session ends - a written record of what you reflected on. This is the feature that makes this more than a demo.

The Browser Client (key parts)

The browser uses the Agora Web SDK (loaded from CDN - no npm, no webpack) to join the same RTC channel:

// Create client and join
rtcClient = AgoraRTC.createClient({ mode: "rtc", codec: "vp8" });
await rtcClient.join(app_id, channel, token || null, uid);
// Publish microphone
localMicTrack = await AgoraRTC.createMicrophoneAudioTrack({
encoderConfig: "speech_standard",
});
await rtcClient.publish(localMicTrack);
// Subscribe to agent's audio and play it
rtcClient.on("user-published", async (user, mediaType) => {
if (mediaType !== "audio") return;
await rtcClient.subscribe(user, "audio");
user.audioTrack.play();
});

Three async calls: join, publish, subscribe. That's the entire WebRTC layer.

Phase 3: Real-Time Feel - The Part That Actually Matters

Once the pipeline runs, the question that matters is: does it feel like a real conversation?

Turn-taking
The Deepgram nova-3 model detects end-of-speech accurately. Compass waits for me to finish, then responds within about 1.2–1.8 seconds (STT transcription + LLM generation + TTS synthesis). Agora's published benchmark is <650ms end-to-end - I measured closer to 1.2–1.5s for GPT-4o-mini with MiniMax TTS, which still feels conversational rather than laggy.

Interruption test
This is where I was genuinely surprised. I spoke over Compass mid-sentence. She stopped. Immediately, cleanly, no audio bleed. I tried this five times with different timing - sometimes right as she started a word, sometimes deep into a sentence. Every time the cut was instant.
This is handled entirely by Agora's RTC infrastructure and the VAD layer. I wrote zero interruption-handling code. It just worked.

Conversation quality
The reflection flow felt natural across few turns. The agent stayed on-topic, transitioned between phases at the right moments, and the "under 35 words" constraint kept responses appropriately brief for voice. The one area that needed tuning: Compass occasionally asked two questions in one turn early in testing (prompt refinement fixed this with a firm "Ask only ONE question per turn" rule).

Sample Demo

Daily Companion AI.mp4 - Google Drive

drive.google.com

Built with Agora Agents SDK (Python) + OpenAI GPT-4o-mini + Deepgram STT + MiniMax TTS

Phase 4: Honest Verdict

What's genuinely great
The builder pattern is the right abstraction. Instead of wiring five services together yourself, you declare your pipeline and the SDK handles transport, buffering, retries, and token refresh.
Interruption handling working out of the box is not a small thing - in a DIY build, that's easily a full day of work.

session.think() (not demonstrated in this project's MVP but available) is a powerful primitive: you can inject mid-session instructions into the LLM without the agent speaking them aloud. For a more sophisticated reflection agent, this could be used to nudge the agent toward a specific phase based on time elapsed.
What could be better
*The gap between quickstart and production. **The CLI quickstart (agora init) scaffolds a working app fast, but the gap from that template to understanding *why each piece exists is steep. Better intermediate documentation (not just API reference, not just quickstart) would help.

**get_history() response format. **The method exists and works, but the response shape isn't clearly documented. I had to handle three possible formats defensively. This is the kind of thing that adds 30 minutes to an otherwise 5-minute task.

Error specificity. When I accidentally misconfigured my App Certificate, the error was a generic 401. A message like "App Certificate mismatch - check AGORA_APP_CERTIFICATE in your environment" would have saved 10 minutes of debugging.

These are fixable problems, not fundamental ones. The core pipeline is rock-solid.

Conclusion

I started this build expecting to spend most of my time on infrastructure. Instead, I spent most of it on the part that matters - the conversation design, the system prompt, the reflection flow. That's the correct trade-off, and the SDK made it possible.

The Agora Agents SDK doesn't replace the REST API - it's built on top of it, and REST stays fully supported. What it does is remove the RTC plumbing so you can focus on what your agent should say and feel like, not on how audio bytes travel between browser and model.

For a real-time voice product where interruption, latency, and audio quality matter, the infrastructure Agora provides is serious. For a developer who wants to build that product in an afternoon rather than a week, this SDK is the fastest path I've found.

Run It Yourself

pip install agora-agents fastapi uvicorn[standard] python-dotenv openai
cp .env.example .env
# Fill in your API keys
uvicorn main:app - reload
# Open http://localhost:8000

GitHub (Python SDK): https://github.com/AgoraIO/agora-agents-python

#VoiceAI #AIagents #Agora #ConversationalAI #ConvoAI #OpenAI #Agora #TTS #STT

A Quick Start on Amazon Lightsail ☁️⚡

Barsolasco, Dearah Mae — Fri, 20 Dec 2024 04:42:53 +0000

Hello, fellow tech enthusiasts! Like me, are you someone who has just started their tech journey and exploration in cloud computing🤓☝🏻? Well, don't worry. Amazon Lightsail is the perfect platform to begin your cloud journey!

What is Amazon Lightsail🤔?

Amazon Lightsail offers core services in a simplified approach, so you can deploy and manage your applications that do not require massive computing power and scaling.

Here are the high-level features offered by Lightsail:
-Instances: Easy-to-set-up virtual servers for various applications.
-Containers: Run containerized applications securely in the cloud.
-Load Balancers: Distribute web traffic for improved performance and reliability.
-Managed Databases: Fully managed MySQL or PostgreSQL databases.
-Block and Object Storage: Scalable storage options for various needs.
-CDN Distributions: Global content delivery network for faster website access.
-AWS Integration: Access to a wider range of AWS services through VPC peering.

🚀Get Started with Lightsail!

Here is the walkthrough on how you can set up your Amazon Lightsail ready for your website's deployment. But, if you don't have your website files ready, it is perfectly fine. We are here to learn how we can set up our instances.

What is an Instance? : An instance in cloud computing is like a virtual server provided by a cloud service. Instead of owning and maintaining physical servers, you rent these virtual servers from cloud providers to run tasks like apps, databases, or virtual machines.

1.) Access Amazon Lightsail
After logging in to your AWS Account, search for ‘Amazon Lightsail’ or ‘Lightsail’ on the search bar or from your AWS Console.

2.) Create Your Instance
In the Lightsail dashboard, click "Create instance".

3.) Choose Region and Availability Zone
Select a region close to your target audience for better performance. I chose Singapore because it is the closest, therefore, providing low latency.

4.) Select Platform and Blueprint
Linux/Unix: For PHP, Python, or Node.js applications.
Windows: For ASP.NET applications.

You can use the pre-configured blueprints like Wordpress, LAMP, and Node.js. I chose Node.js for my MERN App for example.

5.) SSH Keys
An SSH key is like a digital passcode that lets you securely access a computer or server. You can configure your SSH Key Pairs and create a new one. For demonstration purposes, I created an SSH Key Pair named it as "Website".

6.) Choose Your Instance Plan
You can adjust the pricing plan based on your needs. For now, I chose the default plan.

7.) Name Your Instance
You can create a unique name for your instance. For mine, I named my instance as "website". You can also assign labels to your resources using the tagging options.

After completing the steps above, you may now click "Create Instance" to finish the process of creating your instance.

Congratulations🎉! You have just created your first instance (me too)!

You can configure other settings as you click your created instance on the Lightsail console.

You can also connect using SSH, which will open a new terminal window where you can authenticate using your SSH keys to securely access and manage your Lightsail instance. Once connected, you can run commands, configure your server, upload files, or troubleshoot issues directly on the server.

SSH, or Secure Shell, is a cryptographic network protocol that allows secure communication between a client and a server. It’s commonly used for remotely managing servers and transferring files over an encrypted connection.

You can also create snapshots to back up your instances or disk. Snapshots allow you to restore your data based on the latest saved state.

You can also give it a name. After that, the loading process may take a few minutes depending on the instance or disk size.

Conclusion

Lightsail is a beginner-friendly platform😊, offering everything from pre-configured blueprints to easy-to-use features like SSH connections and snapshots, and scalable pricing plans. Whether you are hosting a small website or you simply just want to deploy a simple app that you have created, Lightsail provides reliable and efficient support for your goals.

What I could have done differently: Because of my limited knowledge in programming and in cloud computing, I hope that I could've demonstrated and deployed a simple application or website that I have created. But nonetheless, experiencing Amazon Console with freedom and being able to create an instance using a service was already a humbling and winning experience for me🌟.