DEV Community: Julia Muiruri

The JavaScript AI Build-a-thon Season 2 starts March 2!

Julia Muiruri — Wed, 25 Feb 2026 04:09:06 +0000

Most applications used by millions of people every single day are powered by JavaScript/TypeScript. But when it comes to AI, most learning resources and code samples assume you're working in Python and will leave you trying to stitch scattered tutorials together to build AI into your stack.

The JavaScript AI Build-a-thon is a free, hands-on program designed to close that gap. Over the course of four weeks (March 2 - March 31, 2026), you'll move from running AI 100% on-device (Local AI), to designing multi-service, multi-agentic systems, all in JavaScript/ TypeScript and using tools you are already familiar with.
The series will culminate in a hackathon, where you will create, compete and turn what you'll have learnt into working projects you can point to, talk about and extend.

How the program works!

The program is organized around 2 phases: -

Phase I: Learn & Skill Up Schedule (Mar 2 - 13)

Self-paced quests that teach core AI patterns,
Interactive Expert-led sessions on Microsoft Reactor (Livestreams) and Discord (Office hours & QnA)

Day/Time (PT)	Topic	Links to join
Mon 3/2, 8:00 AM PST	Local AI Development with Foundry Local	Livestream Discord Office Hour
Wed 3/4, 8:00 AM PST	End-to-End Model Development on Microsoft Foundry	Livestream Discord Office Hour
Fri 3/6, 9:00 AM PST	Advanced RAG Deep Dive + Guided Project	Livestream Discord Office Hour
Mon 3/9, 8:00 AM PST	Design & Build an Agent E2E with Agent Builder (AITK)	Livestream Discord Office Hour
Wed 3/11, 8:00 AM PST	Build, Scale & Govern AI Agents + Guided project	Livestream Discord Office Hour

The Build-a-thon prioritizes practical learning, so you'll complete 2 guided projects by the end of this phase:-

1. A Local Serverless AI chat with RAG
Concepts covered include: -

RAG Architecture
RAG Ingestion pipeline
Query & Retrieval
Response Generation (LLM Chains)

2. A Burger Ordering AI Agent
Concepts covered include: -

Designing AI Agents
Building MCP Tools (Backend API Design)

Phase II: Global Hack! (Mar 13 - 31)

Product demo series to showcase the latest product features that will accelerate your builder experience
A Global hackathon to apply what you learn into real, working AI solutions

This is where you'll build something that matters using everything learnt in the quests, and beyond, to create an AI-powered project that solves a real problem, delights users, or pushes what's possible.

The hackathon launches on March 13, 2026. Full details on registration, submission, judging criteria, award categories, prizes, and the hack phase schedule will be published when the hack goes live. Stay tuned!

But, here's what we can tell you now:

🏆 6 award categories
💻 Product demo showcases throughout the hack phase to keep you building with the latest tools
👥 Teams of up to 4 or solo. Your call

Start Now (Join the Community)

Join our community to connect with other participants and experts from Microsoft &. GitHub to support your builder journey.

Foundry Discord (#js-ai-build-a-thon channel): Our platform for office hours, live QnA, quick questions, community & expert support
GitHub Discussions: This is where you'll share ideas, ask questions, find teammates
Social: Share your progress online using #JSAIBuildathon

See you soon!

Building an AI Study Agent - How GitHub Copilot CLI & SDK helped Reimagine LMS

Julia Muiruri — Wed, 18 Feb 2026 09:58:24 +0000

What if your Learning Management System didn't just host lecture documents, assignments, and grades - but actually understood them?

Every time I sit through a lecture, a constant thought lingers: "I love what I'm studying, don't get me wrong - but it's a lot!" These are 3-hour lectures, a little too much content with piles of reference materials - how do I create efficient study routines beyond the lectures? With the world moving toward an agentic future, AI should help but having read so many posts on AI personalization for education systems, in my experience today, that personalized support isn't here - YET!

Here is the catch though! I don't have weeks to design an architecture, plan every component, and slowly build my way there. I have a problem and a rough idea of a solution, and I need a working prototype fast!

Enter GitHub Copilot CLI

Staring at an empty folder with a half-baked idea and not exactly sure where to start, I spun up the terminal and launched a Copilot Agent in /plan mode for a brainstorming session. You know - to help me think.
This was less of a building session and more of an interactive brainstorm with the agent asking clarifying questions about features, stack preferences, and constraints, then returned a comprehensive implementation plan in seconds.

That step alone was incredibly valuable: it didn't just give the agent a picture of what I wanted to build, it also surfaced scenarios I hadn't even thought of. Even without the full implemenation, that step alone was enough to move my idea forward, and this has influenced my normal ideation routine which is now: idea → brainstorm with Copilot /plan mode → save the plan → iterate.

The Solution

With the plan ready, you might tell the agent to “Start Implementation,” and it'll likely do a great job, but I prefer a five-phase workflow that balances speed, structure and my desired level of involvement in the project (phases may vary by use case):

Here is how I think about the stages:

1. Brainstorm

The goal here is to ensure the idea is crystal clear, not just to the builder (me), but to the agent(s), and more importantly - that you are on the same page.

2. Research

This phase is important to surface the latest docs, announcements, and decision factors so in as much as most of the implementation is delegated to the agent(s), builders (I) have a clear understanding of reasons why database/ framework/ provider X was chosen over Y.

3. Project Setup

This is where the agent focuses on installs, project scaffolding, configuration, and defining how components in the architecture design communicate.

4. Core Functionality

The main goal here is to implement the core logic behind the system’s essential behavior, followed by a thorough validation that APIs and DB schemas map to the target features.

5. Frontend

Language models rarely struggle with UI design work. The trick to get the perfect frontend with a single prompt in my experience, is to save this task for last and the agent will not only factor in the features already implemented, but will also build a design that anticipates and accommodates future enhancements that you thought about and noted in the brainstorm notes (plan docs).

With these phases documented, plus the plan docs stored in my project directory, I'm confident that when I switch to different agents working on my project, they'll all have a clear, common and referenceable north star and can work on whatever component or feature I delegate to them with the right context.

After the first iteration of this workflow, in a matter of minutes, I had a full stack application, with a beautiful UI and I could browse through the courses, with the ability to upload notes (pdf and text files) which were stored in the database.

Hooray! Happy that it worked, but - is there anything extraordinary about that? Not really, since most current LMS can already do this.

But, here is where we step up the game.

Instead of uploading school docs and have them sit there, a file upload kicks off an ingestion pipeline to build a knowledge base that language models can reason over.

So the backend:

extracts the file content. Output: large and long text block
applies a chunking strategy to break the long text block into smaller text groups. Output: chunks of roughly 512 tokens each with a 100 token overlap for context continuation
vector embeddings generation. Output: Embeddings stored in a single db (along with my existing data) using the pgvector extension

Now with my data in a format that language models can understand, the next part involves adding an intelligent layer and we achieve this in 2 steps:

Expose API endpoints in a format that language models can use (tools),
Create an autonomous AI workflow that will handle the tool orchestration and determine when to use what.

Enter Model Context Protocol (MCP)

APIs are designed for humans as the primary users with a discovery path optimized for going through API docs to find endpoints and creating custom integrations to consume them. This doesn't work for language models which instead need a more dynamic, self-discoverable, runtime approach encapsulated in a standardized interface for AI.

This is what the Model Context Protocol provides, a standard that connects AI native apps/ agents to data and tools dynamically.

In the steps above, Copilot CLI uses this very same protocol to pull data from external sources, accessing documentation on how the MCP architecture works and how to build and connect to MCP servers, and in a single prompt, is able to extend my existing backend (API Layer) into an MCP server with tools that will allow the agent to perform actions dynamically. That is either reading course material, generating question-answer pairs from the course content for quizzes, extracting coding exercises and updating my completion progress among other functions.

The quickest way to test this MCP setup is with GitHub Copilot as the MCP client, since I'm yet to build any agentic workflows. I'm already on VS Code, so I simply (1) add the mcp server configuration to my .vscode/mcp.json and now the tools are (2) accessible within the Copilot chat window. I start testing with my (3) custom School Agent, comparing different prompts and (4) tool use accuracy to get a feel of how the agent experience would look like in the app. And of course you can use this through the Copilot CLI if you prefer working from the terminal.

That's step 1. Step 2 is building the agent itself.

Enter GitHub Copilot SDK

When it comes to building agents, there are so many Agent Development Kits and Frameworks that make it easier to create and manage agent execution loops, but a recent (and exciting) announcement from GitHub is the new GitHub Copilot SDK. I'll link to the repo in the resources section, but basically what this means is that you can let the existing infrastructure that powers today's GitHub Copilot, handle all the building blocks of an agent - tool discovery and orchestration, session management, real time streaming, multi-turn loops,etc. and just programmatically call that agent workflow in your application.

There wasn't much to go on terms of documentation as this is still very new, but from what I read in the announcement blog & SDK repo - this was mind-blowing. I had to try it!
I'll admit that when I started off with this project, I had a different idea of how to approach the agentic part of it, but luckily the SDK was announced before I got to it and decided that it was worth giving it a try. I am proud to say that I wasn't disappointed.

I jumped into a brainstorming session with my buddy Copilot CLI, who had context from the SDK repo and settled on an approach that needed an aspect of specialization capabilities. Instead of having one agent handle all tasks, let's have smaller specialized agents for each. i.e.,

I like to frequently quiz myself on topics - let's have an agent that does that one task PERFECTLY!
I'm struggling to track the completion of exercises provided in a course text pdf document - let's have an agent specialized on extracting coding exercises from the eBook, tracking my progress and helping out when I'm stuck or if I need a quick review on my code attempts.

The beauty of using the Copilot SDK is that if you have such an idea, you won't have to worry about building it from scratch because chances are, someone already thoughout it out and there is likely a feature or a copilot-native pattern ready for you to use. This case is no exception - because the idea of providing Copilot specialized capabilities for specific tasks is already implemented through Agent Skills.
So all I needed was to define a SKILL.md document for the specialized tasks I needed - flashcard generator .github/skills/flashcard-generator/SKILL.md & Java practice tracker .github/skills/java-practice-tracker/SKILL.md and pass a skill property to the agent in code, which again the Copilot CLI implemented in minutes.

In just a couple of hours, (with so many breaks in between), I ended up with School Agent that takes learning management systems to the next level, and this is just the beginning.

With tools like the Copilot CLI, SDK, and other AI dev tools, experimentation has never been easier and I have so many ideas (I'm sure you do too), of how to make this system even more useful but I'm confident that in a short while, I'll be back with the next set of features built out and working to perfection.

I'm evolving School Agent into an architecture that is program-agnostic and I hope to share it with you soon to try it out and make it your own.
Yes things are moving fast in the AI space, but at least this way I have AI working with me and for me to improve an actual real world experience (and so can you). I encourage you to not just take other people's word for it, - you saw a cool demo on YouTube/ X recently, or you enjoyed this post (I hope you did), but don't settle for that. Find an immediate problem you are having today and tinker around. Build something. Anything. Everything!

To students: Would you use School Agent? What does it need to do to be even more useful to you?
For educators: How can your students benefit from such a tool? What would you also like to see implemented to support you?

Resources

Check out this video walk-through of School Agent
Get started with Copilot CLI
Get started with the Copilot SDK
Agent Skills

If you enjoyed this post, let's connect on LinkedIn, X and Bsky

🚀 JS AI Build‑a‑thon: One Week In & Join Us Now!

Julia Muiruri — Mon, 16 Jun 2025 09:40:00 +0000

We launched the JS AI Build‑a‑thon last week — an epic learning journey crafted for JavaScript and TypeScript developers who want to step confidently into the world of AI.

If you haven’t jumped in yet, now’s the perfect moment—the journey is just getting started!

Visit 👉🏽 https://aka.ms/JSAIBuildathon to get started.

🌟 Why Join the Build-a-thon?

We’re entering a future where AI-first and agentic developer experiences will shape how we build — and you don’t want to be left behind.

This isn’t your average hackathon. It’s a hands-on, quest-driven learning experience designed for developers, packed with:

Interactive quests that guide you step by step — from your first prototype to production-ready apps
Community-powered support via our dedicated Discord and local, community-led study jams
Showcase moments to share your journey, get inspired, and celebrate what you build

Whether you're just starting your AI journey or looking to sharpen your skills with frameworks like LangChain.js, tools like GitHub Models, the Azure AI Foundry and AI Toolkit Extensions, or diving deeper into agentic app design with MCP — this is your moment to start building.

🗺️ Your Build-a-thon Roadmap

The journey is broken into milestones — each building on the last — helping you go from zero to AI engineer at your own pace.

🔥 What We've Tackled So Far

You can easily catch up!

Quest 1 – Local Gen AI Prototype

Built a GenAI prototype using GitHub Models and the AI Toolkit—running completely locally with no cloud required.

Quest 2 – Deploy prototype to Azure AI Foundry

Deployed the same local model to Azure AI Foundry using the VS Code extension. One-click cloud magic.

Quest 3 – Chat UI with Vite, Lit & Azure Developer CLI (azd)

Brought your prototype to life with a responsive chat interface using Vite + Lit, plus infra managed via Bicep and azd (Azure Developer CLI).

🎯 Today’s Quest (4): Integrate External Data with RAG

In this quest, you’ll connect your AI app to external documents (like PDFs) and allow your app to “read” and respond using your real-world content.

⏭️ What's Next in the Roadmap

Tips & Tricks to Get the Most Out of the Build-a-thon

To make the most of your experience in the JS AI Build-a-thon, here are a few pro tips to keep in mind:

Follow the Quests in Order: Each quest builds on the previous one. Completing them sequentially ensures a smooth learning curve and helps you gradually level up your AI development skills.
Dive into the Resources Section: Every quest comes with a curated list of resources — links to docs, videos, tutorials, and related tools. Take time to explore these materials to deepen your understanding of the concepts introduced.
Experiment Beyond the Instructions: Don’t be afraid to tinker! Modify code, try different tools, and explore edge cases. This is your sandbox to learn, build, and get creative.
Lean on the Community: Join discussions on our Discord and connect with other developers through study jams and community channels. It’s easier (and more fun!) when you’re not building alone.

Ready to Start Building?

Start the build-a-thon: https://aka.ms/JSAIBuild-a-thon
Join us on Discord: https://aka.ms/JSAIonDiscord (#js-ai-build-a-thon channel)
Complete study guide with timeline and weekly resources: https://aka.ms/JSAIStudyGuide
Set up guide: https://aka.ms/JSAIBuildathonSetup
Quest 1: https://aka.ms/JSAIBuildathonQuest1
Quest 2: https://aka.ms/JSAIBuildathonQuest2
Quest 3: https://aka.ms/JSAIBuildathonQuest3
Quest 4: https://aka.ms/JSAIBuildathonQuest4

Enhancing AI Integrations with MCP and Azure API Management

Julia Muiruri — Thu, 24 Apr 2025 08:29:14 +0000

As AI Agents and assistants become increasingly central to modern applications and experiences, the need for seamless, secure integration with external tools and data sources is more critical than ever. The Model Context Protocol (MCP) is emerging as a key open standard enabling these integrations - allowing AI models to interact with APIs, Databases, and other services in a consistent, scalable way.

Understanding MCP

MCP utilizes a client-host-server architecture built upon JSON-RPC 2.0 for messaging.Communication between clients and servers occurs over defined transport layers, primarily:

stdio: Standard input/output, suitable for efficient communication when the client and server run on the same machine.
HTTP with Server-Sent Events (SSE): Uses HTTP POST for client-to-server messages and SSE for server-to-client messages, enabling communication over networks, including remote servers.

Why MCP Matters

While Large Language Models (LLMs) are powerful, their utility is often limited by their inability to access real-time or proprietary data. Traditionally, integrating new data sources or tools required custom connectors/ implementations and significant engineering efforts. MCP addresses this by providing a unified protocol for connecting agents to both local and remote data sources - unifying and streamlining integrations.

Leveraging Azure API Management for remote MCP servers

Azure API Management is a fully managed platform for publishing, securing, and monitoring APIs. By treating MCP server endpoints as other backend APIs, organizations can apply familiar governance, security, and operational controls. With MCP adoption, the need for robust management of these backend services will intensify. API Management retains a vital role in governing these underlying assets by:

Applying security controls to protect the backend resources.
Ensuring reliability.
Effective monitoring and troubleshooting with tracing requests and context flow.

In this blog post, I will walk you through a practical example: hosting an MCP server behind Azure API Management, configuring credential management, and connecting with GitHub Copilot.

A Practical Example: Automating Issue Triage

To follow along with this scenario, please check out our Model Context Protocol (MCP) lab available at AI-Gateway/labs/model-context-protocol

Let's move from theory to practice by exploring how MCP, Azure API Management (APIM) and GitHub Copilot can transform a common engineering workflow. Imagine you're an engineering manager aiming to streamline your team's issue triage process - reducing manual steps and improving efficiency.

Example workflow:

Engineers log bugs/ feature requests as GitHub issues
Following a manual review, a corresponding incident ticket is generated in ServiceNow.

This manual handoff is inefficient and error prone. Let's see how we can automate this process - securely connecting GitHub and ServiceNow, enabling an AI Agent (GitHub Copilot in VS Code) to handle triage tasks on your behalf.

A significant challenge in this integration involves securely managing delegated access to backend APIs, like GitHub and ServiceNow, from your MCP Server. Azure API Management's credential manager solves this by centralizing secure credential storage and facilitating the secure creation of connections to your third-party backend APIs.

Build and deploy your MCP server(s)

We'll start by building two MCP servers:

GitHub Issues MCP Server

Provides tools to authenticate on GitHub (authorize_github), retrieve user information (get_user) and list issues for a specified repository (list_issues).

ServiceNow Incidents MCP Server

Provides tools to authenticate with ServiceNow (authorize_servicenow), list existing incidents (list_incidents) and create new incidents (create_incident).

We are using Azure API Management to secure and protect both MCP servers, which are built using Azure Container Apps. Azure API Management's credential manager centralizes secure credential storage and facilitates the secure creation of connections to your backend third-party APIs.

Client Auth:

You can leverage API Management subscriptions to generate subscription keys, enabling client access to these APIs.

Optionally, to further secure /sse and /messages endpoints, we apply the validate-jwt policy to ensure that only clients presenting a valid JWT can access these endpoints, preventing unauthorized access. (see: AI-Gateway/labs/model-context-protocol/src/github/apim-api/auth-client-policy.xml)

After registering OAuth applications in GitHub and ServiceNow, we update APIM's credential manager with the respective Client IDs and Client Secrets. This enables APIM to perform OAuth flows on behalf of users, securely storing and managing tokens for backend calls to GitHub and ServiceNow.

Connecting your MCP Server in VS Code

With your MCP servers deployed and secured behind Azure API Management, the next step is to connect them to your development workflow. Visual Studio Code now supports MCP, enabling GitHub Copilot's agent mode to connect to any MCP-compatible server and extend its capabilities.

Open Command Pallette and type in MCP: Add Server ...

Select server type as HTTP (HTTP or Server-Sent Events)

Paste in the Server URL

Provide a Server ID

This process automatically updates your settings.json with the MCP server configuration.

Once added, GitHub Copilot can connect to your MCP servers and access the defined tools, enabling agentic workflows such as issue triage and automation. You can repeat these steps to add the ServiceNow MCP Server.

Understanding Authentication and Authorization with Credential Manager

When a user initiates an authentication workflow (e.g, via the authorize_github tool), GitHub Copilot triggers the MCP server to generate an authorization request and a unique login URL. The user is redirected to a consent page, where their registered OAuth application requests permissions to access their GitHub account. Azure API Management acts as a secure intermediary, managing the OAuth flow and token storage.

Flow of authorize_github:

Step 1 - Connection initiation:

GitHub Copilot Agent invokes a sse connection to API Management via the MCP Client (VS Code)

Step 2 - Tool Discovery:

APIM forwards the request to the GitHub MCP Server, which responds with available tools.

Step 3 - Authorization Request:

GitHub Copilot selects and executes authorize_github tool. The MCP server generates an authorization_id for the chat session.

Step 4 - User Consent:

If it's the first login, APIM requests a login redirect URL from the MCP Server
The MCP Server sends the Login URL to the client, prompting the user to authenticate with GitHub
Upon successful login, GitHub redirects the client with an authorization code

Step 5 - Token Exchange and Storage:

The MCP Client sends the authorization code to API Management
APIM exchanges the code for access and refresh tokens from GitHub
APIM securely stores the token and creates an Access Control List (ACL) for the service principal.

Step 6 - Confirmation:

APIM confirms successful authentication to the MCP Client, and the user can now perform authenticated actions, such as accessing private repositories.

Check out the python logic for how to implement it: AI-Gateway/labs/model-context-protocol/src/github/mcp-server/mcp-server.py

Understanding Tool Calling with underlaying APIs in API Management

Using the list_issues tool,

Connection confirmed

APIM confirms the connection to the MCP Client Issue retrieval:
The MCP Client requests issues from the MCP server
The MCP Server attaches the authorization_id as a header and forwards the request to APIM
The list of issues is returned to the agent

You can use the same process to add the ServiceNow MCP Server. With both servers connected, GitHub Copilot Agent can extract issues from a private repo in GitHub and create new incidences in ServiceNow, automating your triage workflow. You can define additional tools such as suggest_assignee tool, assign_engineer tool, update_incident_status tool, notify_engineer tool, request_feedback tool and other to demonstrate a truly closed-loop, automated engineering workflow - from issue creation to resolution and feedback.

Take a look at this brief demo showcasing the entire end-to-end process:

Summary

Azure API Management (APIM) is an essential tool for enterprise customers looking to integrate AI models with external tools using the Model Context Protocol (MCP). In this blog, we demonstrated how Azure API Management's credential manager solves the secure creation of connections to your backend APIs. By integrating MCP servers with VS Code and leveraging APIM for OAuth flows and token management, you can enable secure, agentic automation across your engineering tools. This approach not only streamlines workflows like issues triage and incident creation but also ensures enterprise-grade security and governance for all APIs.

Additional Resources

Using Credential Manager will help with managing OAuth 2.0 tokens to backend services.

Client Auth for remote MCP servers:

AZD up: https://aka.ms/mcp-remote-apim-auth
AI lab Client Auth: AI-Gateway/labs/mcp-client-authorization/mcp-client-authorization.ipynb

If you have any questions or would like to learn more about how MCP and Azure API Management can benefit your organization, feel free to reach out to us. We are always here to help and provide further insights.

Connect with us on LinkedIn (Julia Kasper & Julia Muiruri) and follow for more updates, insights, and discussions on AI integrations and API management.

Announcing: Azure API Center Hands-on Workshop 🚀

Julia Muiruri — Tue, 25 Mar 2025 16:47:39 +0000

What is the Azure API Center Workshop?

The Azure API Center flash workshop is a resource designed to expand your understanding of how organizations can enhance and streamline their API management and governance strategies using Azure API Center. With this practical knowledge and insights, you will be able to streamline secure API integration and enforce security and compliance with tools that evolve to meet your growing business needs.

Azure API Center is a centralized inventory designed to track all your APIs, regardless of their type, lifecycle stage, or deployment location. It enhances discoverability, development, and reuse of APIs. While Azure API Management focuses on API deployment and runtime governance, Azure API Center complements it by centralizing APIs and streamlining the registration of new APIs and design-time governance.

Who can go through the workshop?

The Azure API Center workshop benefits anyone who is interested in improving their API development, at-scale governance, discovery, and consumption workflow experience.

Throughout the workshop, we reference 3 key personas heavily involved in the API ecosystem.

API Producers - Individual developers or teams who consolidate API specifications and requirements and design API architectures to fit defined goals. They also develop, secure, publish, test APIs to ensure they meet functional and performance requirements and document APIs.
API Platform Engineers/ API Admins - Establish and enforce API best practices and design standards across teams and the entire organization. They also enforce monitoring and analysis of definitions for adherence to organizational style rules, generating both individual and summary reports. This ensures timely correction of common errors and inconsistencies in your API definitions.
API consumers - Consumers of APIs to build systems/ applications that use services provided by the organization, or direct consumers using APIs to satisfy business needs.
To put these personas into perspective, we use a fictitious company, Contoso Airlines, to demonstrate how API Center integrates with existing API development, deployment, governance, and discovery workflows.

If you are passionate about teaching and skilling others on API best practices and concepts, visit the workshop's GitHub repository for session delivery resources you can use for a step-by-step presentation on API Center using this workshop. Don't forget to like and star the repo ⭐

What will you learn after going through the workshop?

The workshop is divided into three key pillars as follows:

API Inventory

Under the API Inventory pillar, you will go through guided steps to install the Azure API Center extension on VS Code, connect to your Azure account and create an API Center resource with custom API metadata/ properties defined. You will then use GitHub Copilot to register current APIs into your API Center resource, configure environments and deployments for your APIs and set up automatic synchronization as you import more sample APIs from an API Management service.

API Governance

You will then go through the API Governance experience first from an API producer's perspective, as you define and apply a custom API style ruleset on VS Code, and from an API Admin perspective to deploy the ruleset to Azure, and view API Analysis reports on Azure to determine the health and safety of all APIs across the organization.

API Discovery & Consumption

Here, you will learn how you can discover all APIs on VS Code and on the Azure portal, a key step before creating any new APIs to ensure no duplication and promote reusable APIs. You will also quickly load API Documentation and test your APIs.

Where do I go to get started with the workshop?

To get started with the workshop, you can directly go to https://aka.ms/APICenter/Workshop or go through our GitHub Repository where you can open issues, leave feedback and leave a star 😉

Kickstart projects with azd Templates

Julia Muiruri — Mon, 25 Nov 2024 11:30:04 +0000

Introduction

In a fast-paced world of software development, finding the right frameworks and services that cater to diverse needs can be challenging. Today’s development landscape demands that developers continuously adapt and evolve their skill sets, often juggling multiple tools and mastery of technologies to stay competitive.

Current and emerging developer pain-points include:

Having to make too many decisions facing an expansive selection of options during the entire development life cycle
Difficulty in identifying and implementing industry’s best practices that could lead to potential inefficiencies and technical debt
Lack of repeatability, making it difficult to deliver consistent results across different environments and development stages
Increased complexity of integrating AI technologies into applications
Lack of familiarity with deployment services to implement applications that are efficiently designed and configured to be secure and scale to meet the growing needs of users

Azure Developer CLI (azd)

The Azure Developer CLI (azd) is an open-source, developer-centric command-line (CLI) tool that is part of a wider ecosystem to help you accelerate the provisioning and deployment of applications to Azure. Long gone are the many arguments and flags typically used, Azd uses intuitive, developer-friendly commands that represent key development stages, boosting your overall productivity.

azd Templates

As part of this ecosystem, and the backbone to the CLI, azd uses blueprint project templates with:

Proof-of-concept (PoC) starter code to help you kickstart your project without starting from scratch. These templates go beyond ‘hello-world’ examples, demonstrating how to build complex systems, allowing you to customize the code, or completely replace with your own,
Everything you need to get a Fully managed end-to-end system/ application running on Azure, with configuration files to handle one-click deployments,
Reusable Infrastructure as Code (IaC) assets to provision and maintain cloud services

Azd empowers:

Every developer to focus on writing the best code and deployment infrastructure by keeping it all in one context
Every startup to quickly prototype and deploy applications, accelerating innovation
Every non-technical founder to understand and manage their projects through intuitive commands, allowing them to focus on business strategy and market growth
Every student developer to learn industry best practices and apply them in their projects, while gaining hands-on experience with Azure, one of the leading cloud platforms, enhancing their resumes and employability

Finding azd Templates

The key to identifying the azd template that is right for you is first of all knowing what your application needs to do. Once you have an idea of what your application needs to do and the services required, you can search for the right template that most closely matches your needs in one of two places.

Visit the azd Template Gallery to get started with a range of battle-tested templates that offer a range of solutions.

If you don't find your use case there, then visit the AI Template Gallery to get started and search through AI specific application templates.

(All deployment instructions are included in the respective templates).

Once you have chosen and deployed the template of your choice, the rule of thumb is:

use azd deploy if you change any of the application code
use azd provision if you change of the infrastructure Bicep or Terraform code
use azd up if you change both or want a quick re-deployment Below you can see some popular example JavaScript templates that the community have been using.

Template	Tech Stack	Architecture
Serverless AI Chat with RAG using LangChain.js	Lit Web components, TypeScript, Node.js, Langchain.js	Example use case: Customer Support Automation
ChatGPT + Enterprise data with Azure OpenAI and Azure AI Search	JavaScript, TypeScript, Node.js	Example use case: Legal Document Analysis
React Web App with C# API and Cosmos DB for NoSQL on Azure	JavaScript, TypeScript, C#/ .NET, React	Example use case: HR Management Tool
Serverless Azure OpenAI Assistant Quick Start Function Calling	JavaScript	Example use case: Customer Support ChatBot
Azure OpenAI secure UI starter	Lit Web components, TypeScript, Node.js	Example use case: E-commerce Platform Personal Shopping Assistant
Serverless Azure OpenAI Quick Start with LlamaIndex (JavaScript)	JavaScript, Node.js

What’s Coming Next?

Stay tuned for an upcoming series that will dive deeper into these templates and more, showing the end-to-end deployment experience with azd.

Resources

Join us for Hack Together: JavaScript on Azure Global Hack from Aug 16 - 31, 2023

Julia Muiruri — Mon, 14 Aug 2023 10:18:47 +0000

Are you interested in learning new skills and collaborating with other developers? Then you won't want to miss the Hack Together: JavaScript on Azure Global Hack, a unique opportunity for you to contribute to a real-world end-to-end Open-source project alongside Microsoft engineers & global developers!

youtube.com

This program is designed to help you improve your coding skills and build your network with other developers. Hack Together opens on August 16, 2023, with our live keynote. Register here and start hacking today following the guidelines on our pre-requisite page.

Join Live Streams

We will host live events throughout hack together to inspire you with ideas and provide access to learning resources to help you on your app building journey.
Add these events to your calendar using our invite so that you don’t miss out!

Aug 16: Hack Together Launch – Opening Keynote
Aug 17: Introduction to GitHub Copilot
Aug 21: Build your Frontend with Azure Static Web Apps
Aug 24: Build a Serverless Backend with Azure Functions
Aug 28: Build and connect to a Database using Azure Cosmos DB
Aug 31: Introduction to Azure OpenAI Service

Where to get started.

After you register, introduce yourself in our GitHub Discussion forum, and start networking with other developers and Microsoft Experts!

Star & Fork the Contoso Real Estate repository to go through the codebase in preparation for your contribution Hack Together.

Join our collection of resources that will help you have hands-on experience and set up developer tools to contribute to the Contoso Real Estate open-source project! Join to learn and develop essential skills to build enterprise-grade modern composable frontends and cloud-native applications.

Gear up

Activate GitHub Student Developer Pack, to access free Azure credits from Azure for Students, GitHub Copilot and GitHub Codespaces

Incentives

All participants whose contributions are accepted into the project will receive an Open-Source contributor badge from Microsoft!

See you all!

How to build Power Apps Custom Controls using TypeScript

Julia Muiruri — Mon, 28 Nov 2022 07:07:31 +0000

I recently learned about 2 exciting ways that you can use your coding skills to extend the functionality of the Power Platform. The 2 ways😁:

Using your experience of working with APIs to build custom connectors that allow Low Code Applications to connect to external and your favorite data sources

Tools & Concepts: VS Code, Power Platform CLI (pac), Postman, GitHub, APIs

[Focus for this blog] Bringing in your coding skills to build custom controls that will be deployed to the Dataverse to be accessed by citizen developers as drag-and-drop controls for their applications. Learn why you should build custom controls in this 2-minute video:

Tools & Concepts: VS Code, Power Platform CLI (pac), PowerApps Component Framework (PCF), TypeScript, Browser-debugging, Power Platform Tools Extension

Steps to get you started

Good News! Join our LinkedIn community for frequent updates on different ways to use your developer experience & skills to improve the Power Platform.

1. Get yourself a free M365 Developer Account

To access an environment on Power Platform for you to deploy your control, you would need to sign in using a work account. If you already have one, drop to step 2, but if not, click join now on the M365 Developer Program page to create a free E5 Developer Subscription, which will allow you to create your own sandbox and you will forever be able to develop solutions for the Power Platform
Step-by-step to create a free work account

2. Initialize a Custom control

Just like any other developer project, you need to initialize the control-project and you will use the power platform CLI directly on your VS Code terminal, i.e

pac pcf init --name Control'sName --namespace NameSpace --template TemplateType

Testing will be done on the PowerApps Component Framework Test Environment rendered on your browser, and you can use available browser-debugging tools as well

3. Walkthrough sample TypeScript Code to implement a simple control

Implement your control's functionality by adding TypeScript code. Watch this short video as I briefly take you through the code that renders a simple Hi [UserName] control.
Depending on your skill-level, you can build simple controls such as this one, or more complex ones

4. Deploy Control or Submit it as an Open-Source Sample

Option 1: If you would like to use the control in your own Power App, or perhaps you built the control for a specific organization to utilize for their solutions, you would ideally deploy it to the organization's environment. Note that every developer with access to that environment will be able to use your control. Watch this short video as it shows how to deploy your control to a specific Dataverse environment.

Option 2: You can build custom controls and submit them to the PCF Gallery. This way, citizen developers from across the world can find your control and import it to use in their solutions.

Resources you should check out

Check out the Build a Power Apps Component module to learn more on these concepts.
Microsoft Power Platform Developer Documentation
Power Apps Component Framework Documentation
Power Apps for developers documentation