All Projects → th0th → nextjs-typescript-yarn-workspaces

th0th / nextjs-typescript-yarn-workspaces

Licence: MIT license
A simple example to help you get started with Next.js + typescript + yarn workspaces.

Programming Languages

typescript
32286 projects
javascript
184084 projects - #8 most used programming language
CSS
56736 projects

Projects that are alternatives of or similar to nextjs-typescript-yarn-workspaces

yarn-workspaces-electron
🧶 Yarn workspaces with electron, for fun and profit
Stars: ✭ 25 (-66.67%)
Mutual labels:  yarn-workspaces
zsh-yarn-completions
Yarn completions for Z-shell that supports yarn workspaces
Stars: ✭ 35 (-53.33%)
Mutual labels:  yarn-workspaces
Puppeteer Extra
💯 Teach puppeteer new tricks through plugins.
Stars: ✭ 3,397 (+4429.33%)
Mutual labels:  yarn-workspaces
mono.ts
A minimal example of a typescript mono repo with pre-build support (tests, vscode).
Stars: ✭ 58 (-22.67%)
Mutual labels:  yarn-workspaces
React-Native-Web-TypeScript-Prettier-Boilerplate
A starterkit to work with nextjs, react-native, storybook… all with prettified typescript and in a monorepo
Stars: ✭ 16 (-78.67%)
Mutual labels:  yarn-workspaces
tangerine-monorepo
A "fast" TypeScript-based Node.js monorepo setup powered by esbuild & turborepo
Stars: ✭ 191 (+154.67%)
Mutual labels:  yarn-workspaces
mock-spy-module-import
JavaScript import/require module testing do's and don'ts with Jest
Stars: ✭ 40 (-46.67%)
Mutual labels:  yarn-workspaces
vscode-monorepo-workspace
📦✨Manage monorepos with multi-root workspaces. Supports Lerna, Yarn, Pnpm, Rushjs and recursive package directories.
Stars: ✭ 93 (+24%)
Mutual labels:  yarn-workspaces
yarn-workspaces-simple-monorepo
Yarn Workspaces basic monorepo management without Lerna for coding examples
Stars: ✭ 31 (-58.67%)
Mutual labels:  yarn-workspaces
perseus
An Apollo GraphQL Server & React Client in a Yarn Workspace deployed with Zeit 2.0
Stars: ✭ 35 (-53.33%)
Mutual labels:  yarn-workspaces
react-monorepo
a simple monorepo setup for react & react-native using yarn workspaces.
Stars: ✭ 40 (-46.67%)
Mutual labels:  yarn-workspaces
nest-react
Simple NestJS + React boilerplate using the Yarn workspaces - Full on TS!
Stars: ✭ 40 (-46.67%)
Mutual labels:  yarn-workspaces
devto-monorepo
Source code for the Dev.to article - Next.js, Apollo Client and Server on a single Express app
Stars: ✭ 33 (-56%)
Mutual labels:  yarn-workspaces
cra-monorepo-demo
Monorepo example using create-react-app and common component library structure with yarn workspaces
Stars: ✭ 37 (-50.67%)
Mutual labels:  yarn-workspaces

Next.js (with typescript and yarn workspaces)

Next.js (with typescript and yarn workspaces)

A simple example to help you get started with Next.js + typescript + yarn workspaces.

Getting started

$ cd nextjs-typescript-yarn-workspaces
$ yarn install
$ yarn workspace @project/web-app dev

Renaming for your project

I named the example workspace packages @project/components and @project/web-app. You can safely rename it to @my-awesome-project/components or something like that.

Custom types

The @types directory is for your custom global types. Since each Next.js application has to own a tsconfig.json of its own, these types are also included in packages/web-app/tsconfig.json.

"Where should I add custom @types packages?"

Since multiple packages can use the same typings, and it is very unlikely for different packages to depend on different versions of those typings, @types packages should go into devDependencies of the base package.json.

Running

Development

  1. Install dependencies

    $ yarn
  2. Start the web-app next.js application

    $ yarn workspace @project/web-app dev

    Then the application should be accessible on http://localhost:3000.

Shameless plug

I am an indie hacker, and I am running two services that might be useful for your business. Check them out :)

WebGazer

WebGazer

WebGazer is a monitoring service that checks your website, cron jobs, or scheduled tasks on a regular basis. It notifies you with instant alerts in case of a problem. That way, you have peace of mind about the status of your service without manually checking it.

PoeticMetric

PoeticMetric

PoeticMetric is a privacy-first, regulation-compliant, blazingly fast analytics tool.

No cookies or personal data collection. So you don't have to worry about cookie banners or GDPR, CCPA, and PECR compliance.

License

Copyright © 2020, Gökhan Sarı. Released under the MIT License.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].