Abstracted in

Table of Contents

apollo-graphql-typescript

Template for serverless Apollo + GraphQL + TypeScript app deployed on Netlify.
Star Fork

If you have ever seen a post on the internet about a framework that is almost exactly what you wanted but then you tried to add that last missing piece to it. And it falls to the ground, shatters, and sends you into a deep depression where you question whether your existence is a waste? Then you will relate to me on this journey of mine.

cards crumbling

Image taken from Tenor

What happened?

I recently started working with Apollo GraphQL and wanted to do a small side project on it. I also wanted to host it for others to see but didn’t want to pull up a new docker stack on my already overloaded server. Luckily, I found this post describing exactly how to do that. The only problem is that there is no typescript included in the bundle. I thought ‘No problem, I can add TypeScript to the bundle. How hard could it be?‘.

Never have I ever been so wrong in my entire life. You see Netlify has a cli package. which helps in replicating a production-like environment on your local system without you having to set up a proxy between your client and Netlify’s lambda functions. And since the apollo server, in this case, runs a lambda function, it helped a lot. The only problem is that the cli package doesn’t work with TypeScript.

So, like a professional developer, I opened a new tab and searched ‘how to add TypeScript to netlify-cli’ on Google. 50 tabs later I figured out that someway you have to make netlify dev command work with netlify-lambda. Doing that landed me into some dependency issue and the author of the issue closed it stating that he gave up on this issue.

Then?

Two days into this rabbit hole, I was also about to give up. But then I thought of dropping netlify-lambda and manually transpiling TypeScript files to JavaScript and then send those files to Netlify’s CLI. It worked! So, I did what any developer who had a Eureka moment will do. Sleep! And so I slept peacefully at last. But when I woke up, I did some cleanup and pushed it GitHub so that anyone can use this as a template.

You can just visit my GitHub repository, click on the ‘Deploy to Netlify’ button to try this out.


Pushkar Anand
Written by Pushkar Anand.
developer in India.