Our great sponsors
-
-
terraform
Terraform enables you to safely and predictably create, change, and improve infrastructure. It is a source-available tool that codifies APIs into declarative configuration files that can be shared amongst team members, treated as code, edited, reviewed, and versioned.
-
SurveyJS
Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.
-
-
-
webpack
A bundler for javascript and friends. Packs many modules into a few bundled assets. Code Splitting allows for loading parts of the application on demand. Through "loaders", modules can be CommonJs, AMD, ES6 modules, CSS, Images, JSON, Coffeescript, LESS, ... and your custom stuff.
-
ts-jest
A Jest transformer with source map support that lets you use Jest to test projects written in TypeScript.
-
InfluxDB
Power Real-Time Data Analytics at Scale. Get real-time insights from all types of time series data with InfluxDB. Ingest, query, and analyze billions of data points in real-time with unbounded cardinality.
-
-
-
svelte-jester
A Jest transformer for Svelte - compile your components before importing them into tests.
-
-
-
-
-
serverless-application-model
The AWS Serverless Application Model (AWS SAM) transform is a AWS CloudFormation macro that transforms SAM templates into CloudFormation templates.
-
aws-lambda-java-libs
Official mirror for interface definitions and helper classes for Java code running on the AWS Lambda platform.
-
WorkOS
The modern identity platform for B2B SaaS. The APIs are flexible and easy-to-use, supporting authentication, user identity, and complex enterprise features like SSO and SCIM provisioning.
Unfortunately a few challenges remain in using Yarn 2 workspaces. Chiefly, using this approach will conflict with any packages that depend on reading files directly from their node_modules folder. But there are also issues with ESM modules that are not yet supported in Yarn 2. Note there is a workaround for this by defining a different node linker.
Most solutions presented so far for the JavaScript/TypeScript monorepo have taken advantage of common JavaScript tools, frameworks and libraries. Unfortunately, I was not able to find a framework that met my requirements for setting up infrastructure and deployment. Very important to me was being able to use Terraform, which I believe provides the most āstandardā way to define infrastructure as code. Almost any kind of infrastructure that can be deployed on any of the popular cloud platforms can be defined in Terraform, and there are plenty of examples and documentation available. Alternatives such as the Serverless framework or AWS SAM in comparison more lean towards being special purpose tools. Pulumi is also a great option but I am not yet convinced that the additional magic it provides on top of basic infrastructure definition (which is based on Terraform) is required over vanialla Terraform.
When installing the Prettier and ESLint extensions for VSCode, formatting and linting will also work within VSCode for any files in the monorepo. Only tweak required to make this work is to configure the Prettier plugin for ESLint (see example .eslintrc.json). Otherwise Prettier and ESLint will get in each otherās way and make for a poor editing experience. To make this work, the following two settings will also need to be configured in a .vscode/settings.json configuration (see settings.json):
Most solutions presented so far for the JavaScript/TypeScript monorepo have taken advantage of common JavaScript tools, frameworks and libraries. Unfortunately, I was not able to find a framework that met my requirements for setting up infrastructure and deployment. Very important to me was being able to use Terraform, which I believe provides the most āstandardā way to define infrastructure as code. Almost any kind of infrastructure that can be deployed on any of the popular cloud platforms can be defined in Terraform, and there are plenty of examples and documentation available. Alternatives such as the Serverless framework or AWS SAM in comparison more lean towards being special purpose tools. Pulumi is also a great option but I am not yet convinced that the additional magic it provides on top of basic infrastructure definition (which is based on Terraform) is required over vanialla Terraform.
When installing the Prettier and ESLint extensions for VSCode, formatting and linting will also work within VSCode for any files in the monorepo. Only tweak required to make this work is to configure the Prettier plugin for ESLint (see example .eslintrc.json). Otherwise Prettier and ESLint will get in each otherās way and make for a poor editing experience. To make this work, the following two settings will also need to be configured in a .vscode/settings.json configuration (see settings.json):
Similar to Jest, it is very easy to use Webpack in a monorepo configured to use TypeScript project references. We can simply use the ts-loader loader, and everything should work automatically.
Thankfully using TypeScript and TypeScript project references makes the intricate problem of using Jest easier since we can make use of the excellent ts-jest Jest transformer. All we need to do it point ts-jest to the respective tsconfig.json file for each package (see example jest.config.js). Since we have configured TypeScript to be composite and incremental, we do not need to recompile TypeScript for dependencies of a package we want to test, which significantly reduces the runtime for unit tests. ts-jest will also ensure that any error message will reference the line numbers in the source TypeScript files.
React/Next.js for UI development
Likewise it is easy to use esbuild. esbuild supports TypeScript by default and will automatically resolve all local references since we have TypeScript project references configured. Only additional configuration we need to provide is to use the plugin [@yarnpkg/esbuild-plugin-pnp](https://github.com/yarnpkg/berry/tree/master/packages/esbuild-plugin-pnp) so that esbuild can resolve external dependencies from the local Yarn cache. Find below an example script ( build.ts) to bundle code for a AWS lambda:
Prettier is a great tool for maintaining consistent formatting in a project. Prettier works quite well for a monorepo. One can simply define a .prettierrc file in the root of the monorepo and run Prettier using that configuration file. It will automatically apply to all packages in the monorepo.
While I mentioned in the beginning of the article that I am relatively happy with the current state of my reference TypeScript monorepo template, I still think there are a couple of things that can be improved. Chiefly I think that Yarn 2 (āBerryā) is still not as mature as I would like it to be. Support for ESM for instance would be awesome, the lack of which caused me some problems in trying to make Svelte work within the monorepo. However, I think it is very worthwhile what the Yarn team attempts to achieve with Yarn 2 and I am happy to support it by trying to make it work in the monorepo template.
Next.js is a very powerful framework for React development and it is not too difficult to make this framework work in a TypeScript monorepo. Again, thanks to Next.js native support for both Yarn 2 workspaces and TypeScript project references there is not much we need to configure in this monorepo. We can simply define a tsconfig.json that references all local dependencies and Next.js will pick that up automatically.
Jest is a great tool for running Unit tests within a JavaScript or TypeScript project. Unfortunately, running tests in Jest is often more difficult than one wishes it to be due to the somewhat fragmented nature of the JavaScript ecosystem. For instance, when using TypeScript and/or React, we need to ensure that source files are transpiled into JavaScript before running tests. When using Yarn workspaces, we also need to ensure that Jest is able to resolve local dependencies.
There are many ways to develop, deploy and test Node.js lambda functions. In my reference template, I provide an example that uses an Express.js server. That is not necessarily the optimal way to deploy lambdas, chiefly because this results in deploying one lambda function that handles multiple routes. The most āserverlessā way to deploy a backend using functions would be to use different functions for different endpoints.
ESLint provides sophisticated analysis of JavaScript or TypeScript sourcecode. Thankfully it can be configured as easy as Prettier for a monorepo. We can define an .eslintrc.json file in the project root and that will apply to all files in the Monorepo.
Most solutions presented so far for the JavaScript/TypeScript monorepo have taken advantage of common JavaScript tools, frameworks and libraries. Unfortunately, I was not able to find a framework that met my requirements for setting up infrastructure and deployment. Very important to me was being able to use Terraform, which I believe provides the most āstandardā way to define infrastructure as code. Almost any kind of infrastructure that can be deployed on any of the popular cloud platforms can be defined in Terraform, and there are plenty of examples and documentation available. Alternatives such as the Serverless framework or AWS SAM in comparison more lean towards being special purpose tools. Pulumi is also a great option but I am not yet convinced that the additional magic it provides on top of basic infrastructure definition (which is based on Terraform) is required over vanialla Terraform.
AWS Lambda for backend development