Skip to main content

Building MCP with TypeScript

[PLACEHOLDER]
Image

MCP servers are popular these days. We’ve been researching and exploring a few code repos, some where missing modularity, others just not having pieces that we were looking for… therefore we decided to build our own, simple and foundational that could be a starting point for those trying to solve for the similar things we were… and we decided to share it with the community, via our public github.

mcp-server-host-datasource
MCP host, server,data sources 

 

 Before we start. 

Using Typescript and NodeJS was one of our requirements. This proved somewhat challenging because I don't code as frequently these days due to my leadership responsibilities, and I typically prefer working with C# or Python.

Colleagues in my tech community have been working with their teams on some of their MCPs going the Python route. Therefore, I said, “I guess we are trying the other route” 😊. One of our reasons to go with TypeScript was due to the need of the integration with APIs, and based on the research, it seems that with TS things can be done smoother. 

Before presenting our findings and sharing the code, we would like to acknowledge ServerAvatar. Although we are not deeply familiar with their operations, we appreciate the informative article authored by Suresh Ramani on their website. The article can be found at: Suresh article about MCP via ServerAvatar.

His article and repo provide a good starting point. We'll focus on sharing our findings and skip some explanations, so read their work if you want an introductory overview.

 The findings and code sharing.

At the end of this section, you will find our version of the code. 

Key considerations:

  1. Code easy to read. Instead of putting all in one main file (i.e. server.ts), I placed the tools into separate files (the tools folder) as definitions. They are pulled into the server file, which is the main. 
  2. Test your code. I left one example of a test (leveraging jest). You will see it in the tests folder.
  3. Bring security into your code. Do not place API keys in your code, but in environment variables. In this case you will see the package.json has a dependency of the dotenv. Which then gets called in the server file (code: dotenv.config()), which then can be used within the tools (see how in the weather tools the API key is pulled into it).
  4. I would like to call out (and give some appreciation to) weatherAPI (link here). We used their API to have the weathertool.js call to display the weather info. 
  5. Select the IDE and code assistant that best fit your needs. We use Microsoft Visual Code along with Copilot, which is integrated with Claude and Gemini. These tools are particularly helpful for users who may not be experts in TS.
Hint/learning: A challenging aspect was using the mcp.json file placed in the .vscode folder; when you try to add the MCP in your IDE through the tools, its name does not appear as expected.  There is a trick for it, but I will leave it to you all as part of your own journey 😊.

Finally, here is the code repo. We hope you find it useful and leverage it.  
typescript-mcp repo in github

Trending posts

Apple's App Tracking Transparency sealing Meta's fate

Anonymous
If you have been following the recent news on Meta (formerly Facebook) you may have read that Meta recently projected their ad revenue will be cut by a staggering $10 billion in 2022 due to Apple’s new App Tracking Transparency feature (also known as ATT). This has resulted in Meta’s stock to plummet by over 20%. Photo by julien Tromeur on Unsplash - modified by Beolle So what is Apple’s ATT and how does it impact ad revenue? Apple has been releasing multiple privacy features for the last few years. This included Apple’s Mail Privacy Protection and Apple’s App Tracking Transparency feature. You can learn more about Apple’s Mail Privacy Protection in our earlier post by clicking here .  Apple’s App Tracking Transparency (ATT) was launched in iOS 14.5 and iPadOS 14.5 where it prompted users to select if they wanted the app to track their activities across other apps on the device. The prompt is displayed when the user opens an app like Facebook or Instagram for the first time o...
Read more

SLA-SLO-SLI and DevOps metrics

Companies are in need of the metrics that will allow them to stay in business by making sure they meet the expectations of their customers. The name of the game is higher customer satisfaction by winning their trust and loyalty. To do so, you want to provide good products and services. Therefore you need to find ways to monitor performance, drive continuous improvements and deliver the quality expected by the consumer in this highly competitive market. Photos from AlphaTradeZone via Pexel and Spacejoy via Unsplash SLAs, SLOs and SLIs are a good way to achieve the above. They allow clients and vendors to be on the same page when it comes to expected system performance. If we go one level deeper, vendors/providers work on NFRs (Non-Functional Requirements) when working on their solutions. NFRs define the quality attributes of a system. I bring them up because the relationship between them and the SLAs is that they provide, in a way, foundational aspects for the SLA-SLO-SL...
Read more

SRE, DevOps and ITOps

 If you are wondering what the differences between the SRE and DevOps are, as well as how these roles work with ITOps within an organisation then you are not alone; and best of all you are on the right blog post. Often enough business units in a company get confused, assigning the ServiceNow or Jira tickets or any other ticketing system of your preference, to the wrong group, and even having the incorrect expectations when doing resourcing. Let us go through definitions, insights and scenarios that will help you understand the difference. DevOps software development operations - AI Generated When it comes to DevOps and SRE, then you might be wondering which practice came first. While SRE may have originated a bit earlier, internally at Google, DevOps came first publicly as a practice and started to be used by companies. A few years later was when Google decided to open SRE to the world after the publication of the "Site Reliability Engineering" book. Therefore, technically sp...
Read more

Assembling MLOps practice - part 2

 Part I of this series, published in May, discussed the definition of MLOps and outlined the requirements for implementing this practice within an organisation. It also addressed some of the roles necessary within the team to support MLOps. Lego Alike data assembly - Generated with Gemini   This time, we move forward by exploring part of the technical stack that could be an option for implementing MLOps.  Before proceeding, below is a CTA to the first part of the article for reference. Assembling an MLOps Practice - Part 1 ML components are key parts of the ecosystem, supporting the solutions provided to clients. As a result, DevOps and MLOps have become part of the "secret sauce" for success... Take me there Components of your MLOps stack. The MLOps stack optimises the machine learning life-cycle by fostering collaboration across teams, delivering continuous integration and depl...
Read more

This blog uses cookies to improve your browsing experience. Simple analytics might be in place for pageviews purposes. They are harmless and never personally identify you.

Agreed