Introducing: create-netlify-ts

#showdev #serverless #typescript #node

Atila Fassina

Atila Fassina @atila

About: making code simpler. DX + Serverless

Location:

Berlin

Joined:

Jan 31, 2017

Introducing: create-netlify-ts

Publish Date: Aug 31 '20

11 4

From my perspective, the JAMstack is specially appealing to developers with a frontend background. We can now deploy backend services without needing a deep understanding of server-side architecture, scalability, or even caching.

With that in mind, I have started a new project create-netlify-ts. My point with this project is leverage the self-documenting aspect of TypeScript to lower the barrier for Lambda-Functions even more.

How ❓

Well, by using the self-documenting aspect of TypeScript. On strongly typed code (and luckily with an IDE properly configured), your methods will whisper to you what they need.

But, adding TypeScript to a NodeJS adds a new layer of complexity. Node doesn't get types, so the simplicity of writin a .js file and pushing so it's ✨magically✨ live on Netlify goes away.

In comes netlify-lambda to add a build step to your Netlify Function. I wrote a small tutorial on getting this running.

atila

Deploy Netlify Functions with TypeScript

Atila Fassina ・ Aug 10 '20

#codenewbie #serverless #typescript #tutorial

But even if you know this setup inside-out and backwards, it is a bit annoying to make it every.single.time.

I know that feeling. So I made something.

Faster than instant noodles 🥡

With a simple command in your terminal:

# if you use Yarn
yarn create netlify-ts

# if you use NPM
npx create-netlify-ts

A new project is bootstrapped for you, ready to be deployed on Netlify Functions with another simple command.

The boilerplate is a bit more than the minimum requirements for a working Netlify Function. It can give you some opinionated coding style (very little), and also brings the request and response types, so you can easily write the logic of your service without ever alt-tabbing away from the IDE.

atilafassina / create-netlify-ts

👟 Building Netlify Functions with TypeScript has never been this easy

create-netlify-ts

👟 Building Netlify Functions with TypeScript easily

📦 Package Manager agnostic

🐾 No production footprint

🚀 Ready to deploy

❯_

npm

npx create-netlify-ts

yarn

yarn create netlify-ts

❓ Answer the questions and start coding!

🌲 File tree

 {{ package-name }}
  ├── src
  │   └── {{ your-function-name }}.ts
  ├── package.json
  ├── .babelrc
  ├── .gitignore
  └── netlify.toml

🧳 Installed dependencies

All depdendencies are installed as devDependencies, create-netlify-ts has no footprint on your production code.

Required dependencies

Package Name	Why
netlify-lambda	Adds build-step to Netlify Functions
typescript	The compiler for TypeScript (`tsc`)
@babel/preset-env	Tells Babel which JavaScript syntax to output
@babel/preset-typescript	Teach Babel to use TypeScript compiler
@types/aws-lambda	Request/Response types for AWS Lambdas†

†: Netlify Functions runs on top of AWS-Lambdas

Optional dependencies

Netlify CLI To run Netlify Functions locally
Prettier: with some opinionated configuration

🛫 Flying solo

It‘s a dangerous road out there. Take these:

📹 Write…

Features ✨

Server Rewrite to the root of your domain
Deploy setup
Optional dependencies to streamline your workflow

Requirements ❗️

There are 2 things which I have not been able to workaround if it is the first time deploying to Netlify for you.

You need to:

Manually create your Netlify account beforehand
If using Netlify CLI you need to link your account with the CLI manually as well

Help wanted 🏆

Create-Netlify-TS is on a very early stage, and I welcome any kind of contribution. For example, you can:

offer feedback on your usage
suggest improvements on existing features and configuration
add more testing coverage
automate some needed tasks (package publishing for example)
anything else you can think of, pop an issue and let's talk!

💌

If you found this project useful, please consider sharing it with your network, that would help me a lot to continue and make improvements. 😁

Comments 4 total

Anand KashyapApr 7, 2021
this is actually great - saved my time for boilerplate
- Anand KashyapApr 7, 2021
  I have got a problem - tried spinning up local server with netlify dev and netlify lamda serve. In both of them, I am not able to run the compiled functions. Can you tell what am I missing?
Jackson KasiAug 13, 2024
Why hasn't it been upgraded?
- Atila FassinaAug 24, 2024
  Netlify supports it out-of-the-box now.