{"id":22083764,"url":"https://github.com/unlyed/next-typescript-api-vercel-boilerplate","last_synced_at":"2025-07-24T16:31:10.147Z","repository":{"id":38008125,"uuid":"222560320","full_name":"UnlyEd/next-typescript-api-vercel-boilerplate","owner":"UnlyEd","description":"Production-ready app using Next.js 12 with TypeScript, powered by Vercel for building universal apps, with backend-focused configuration","archived":false,"fork":false,"pushed_at":"2022-06-12T17:16:07.000Z","size":286,"stargazers_count":30,"open_issues_count":0,"forks_count":5,"subscribers_count":3,"default_branch":"master","last_synced_at":"2024-11-12T03:34:54.616Z","etag":null,"topics":["boilerplate-template","codeclimate","eslint","jest","nextjs","quickstart","react","sentry","typescript","universal-react","zeit-now-integration"],"latest_commit_sha":null,"homepage":"https://next-typescript-api-vercel-boilerplate.vercel.app/","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/UnlyEd.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null},"funding":{"liberapay":"unlyEd","github":["UnlyEd","Vadorequest"]}},"created_at":"2019-11-18T22:51:36.000Z","updated_at":"2023-05-24T15:28:42.000Z","dependencies_parsed_at":"2022-08-26T06:13:21.418Z","dependency_job_id":null,"html_url":"https://github.com/UnlyEd/next-typescript-api-vercel-boilerplate","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/UnlyEd%2Fnext-typescript-api-vercel-boilerplate","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/UnlyEd%2Fnext-typescript-api-vercel-boilerplate/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/UnlyEd%2Fnext-typescript-api-vercel-boilerplate/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/UnlyEd%2Fnext-typescript-api-vercel-boilerplate/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/UnlyEd","download_url":"https://codeload.github.com/UnlyEd/next-typescript-api-vercel-boilerplate/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":227457126,"owners_count":17777944,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["boilerplate-template","codeclimate","eslint","jest","nextjs","quickstart","react","sentry","typescript","universal-react","zeit-now-integration"],"created_at":"2024-12-01T00:17:37.575Z","updated_at":"2024-12-01T00:17:38.136Z","avatar_url":"https://github.com/UnlyEd.png","language":"TypeScript","funding_links":["https://liberapay.com/unlyEd","https://github.com/sponsors/UnlyEd","https://github.com/sponsors/Vadorequest"],"categories":[],"sub_categories":[],"readme":"\u003ca href=\"https://unly.org\"\u003e\u003cimg src=\"https://storage.googleapis.com/unly/images/ICON_UNLY.png\" align=\"right\" height=\"20\" alt=\"Unly logo\" title=\"Unly logo\" /\u003e\u003c/a\u003e\n[![Maintainability](https://api.codeclimate.com/v1/badges/8eb12b795ca757dbc07d/maintainability)](https://codeclimate.com/github/UnlyEd/next-typescript-api-vercel-boilerplate/maintainability)\n[![Test Coverage](https://api.codeclimate.com/v1/badges/8eb12b795ca757dbc07d/test_coverage)](https://codeclimate.com/github/UnlyEd/next-typescript-api-vercel-boilerplate/test_coverage)\n[![Known Vulnerabilities](https://snyk.io/test/github/UnlyEd/next-typescript-api-vercel-boilerplate/badge.svg?targetFile=package.json)](https://snyk.io/test/github/UnlyEd/next-typescript-api-vercel-boilerplate?targetFile=package.json)\n\n# Next.js with TypeScript, powered by Vercel Now for building APIs\n\n\u003e This is a more detailed example of a universal [Next.js](https://nextjs.org) app that can be deployed with Vercel and zero configuration.\n\u003e\n\u003e **The default configuration is focused on backend development** (APIs), yet uses Next.js framework (universal framework) in case rendering UI becomes necessary later on.\n\u003e **But you can use this to quick start a frontend + backend project as well.** _(we will release another OSS boilerplate with a very complete boilerplate for a rock-solid production app with Next/Vercel/TypeScript before 2020!)_\n\u003e\n\u003e This boilerplate uses Sentry for tracking errors that happens on the server, but feel free to use another tool, it's merely used as an example.\n\n## Other alternatives\n\n\u003e **We released in February 2020 our [\"Next Right Now\" boilerplate](https://github.com/UnlyEd/next-right-now), which is similar to this project, except it is a universal/isomorphic boilerplate that isn't solely focused on the backend/api, unlike this one.** Make sure to check it out!\n\n\n---\n\n\u003c!-- toc --\u003e\n\n- [Deploy Your Own project (ultimate quick start)](#deploy-your-own-project-ultimate-quick-start)\n- [TODO (after generating a project from this boilerplate)](#todo-after-generating-a-project-from-this-boilerplate)\n- [Getting started](#getting-started)\n- [Deploying From Your Terminal](#deploying-from-your-terminal)\n- [Deploying through Vercel \u003c\u003e GitHub CI/CD (official way, not recommended)](#deploying-through-vercel--github-cicd-official-way-not-recommended)\n- [Deploying through Vercel \u003c\u003e GitHub Actions CI/CD (our way)](#deploying-through-vercel--github-actions-cicd-our-way)\n- [API](#api)\n- [Test](#test)\n- [CodeClimate](#codeclimate)\n- [EsLint](#eslint)\n- [Sentry](#sentry)\n  * [Configuring secret SENTRY_DSN in Vercel](#configuring-secret-sentry_dsn-in-vercel)\n- [Vulnerability disclosure](#vulnerability-disclosure)\n- [Contributors and maintainers](#contributors-and-maintainers)\n- [**[ABOUT UNLY]**](#about-unly-)\n\n\u003c!-- tocstop --\u003e\n\n## Deploy Your Own project (ultimate quick start)\n\nDeploy your own Next.js project based on this template with Vercel. ([free](https://vercel.com/pricing))\n\n[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/project?template=https://github.com/UnlyEd/next-typescript-api-vercel-boilerplate)\n\n**Pro tip**: If you allow Vercel to access your GitHub account, it will even create the GitHub repository for you and automatically link it to your Vercel project and enable Vercel \u003c\u003e GitHub integration (automated CI/CD).\n**[Though, beware this](#deploying-through-vercel--github-cicd-official-way-not-recommended).**\n\n_Live Example: [https://next-typescript-api-vercel-boilerplate.unly.vercel.shapp/](https://next-typescript-api-vercel-boilerplate.unly.vercel.app/)_\n\n**Play around with the API:**\n- [`/status` with metadata](https://next-typescript-api-vercel-boilerplate.unly.vercel.app/api/status)\n- [`/date` used by the frontend](https://next-typescript-api-vercel-boilerplate.unly.vercel.app/api/date)\n- [`/error` to test your Sentry integration](https://next-typescript-api-vercel-boilerplate.unly.vercel.app/api/error)\n\n\n## TODO (after generating a project from this boilerplate)\n\n- Duplicate `.env.local.example` into `.env.local`\n- Define your `SENTRY_DSN` in `.env.local`, if not set then errors won't be sent to Sentry (but the app will run fine) - See [Configuring secret SENTRY_DSN in Vercel](#configuring-secret-sentry_dsn-in-vercel)\n\n## Getting started\n\nInstall:\n\n```\nyarn install\n```\n\nStart the project locally:\n\n```\nyarn start\n```\n\nGo to [`http://localhost:9999`](http://localhost:9999) once running.\n\n---\n\n## Deploying From Your Terminal\n\nYou can deploy your new Next.js project with a single command from your terminal using [Now CLI](https://vercel.com/download):\n\n```shell\nyarn deploy # Deploy a staging/preview deployment (use vercel.staging.json)\nyarn deploy:production # Deploy a production deployment (use vercel.production.json)\n```\n\n---\n\n## Deploying through Vercel \u003c\u003e GitHub CI/CD (official way, not recommended)\n\nIf you link your GitHub repository to a Vercel project, you'll benefit from automated CI/CD.\n\nEvery time you push something to the GitHub remote, it'll get deployed.\n\n\u003e **N.B: Be careful about when you merge a branch into the `master` branch though, as it will automatically deploy the `vercel.staging.json` configuration and not the production!**\n\nDue to this reason, we recommend to disable the GitHub integration for your Vercel project, **if you need to deploy a different configuration based on the stage**.\nVercel does not allow any kind of configuration to customise this behaviour at this time, it will therefore always deploy CI/CD using the `now.json` configuration **(which is a symbolic link to `now.staging.json`)**\n\n## Deploying through Vercel \u003c\u003e GitHub Actions CI/CD (our way)\n\n\u003e Because we believe only very simple projects/POC can rely on the same staging/production configuration, we've built our own Vercel \u003c\u003e GitHub Actions integration.\n\nAnd we encourage you to rather take advantage of [it](./.github/workflows).\n\nTo make it work, you need to:\n- Disable Vercel \u003c\u003e GitHub integration (just opt-out from it from your Vercel project's page)\n- Generate a Vercel personal token and add it to GitHub secrets\n    1. Go to your **[personal settings](https://vercel.com/account/tokens)** *(not your team's!)*\n    1. Create a new token, I usually name it `GitHub Actions`\n    1. Go to your GitHub project's settings page then `Secrets`, would be `https://github.com/UnlyEd/boilerplates-generator/settings/secrets` for this project\n    1. Add the new secret, named `VERCEL_TOKEN` (the same as the one in your)\n\n---\n\n## API\n\nThis project aims at providing a quick start with TypeScript and focused on the API abilities.\n\nThe API lives at [src/pages/api](./src/pages/api). The boilerplate comes with few files and test to showcase how it can be done.\n\nThe paths are automatically linked to the filesystem, read [https://nextjs.org/docs#dynamic-routing](https://nextjs.org/docs#dynamic-routing).\n\n---\n\n## Test\n\nTest are compatible with TypeScript and TSX files (`.tsx`) used for React components\n\n```\nyarn test # Watch mode, for development\nyarn test:once # Useful for CI integration\nyarn test:coverage\n```\n\n---\n\n## CodeClimate\n\nThis boilerplate comes with a Code Climate [configuration](.codeclimate.yml). We recommend using it for OSS projects, as it's free in this case.\n\nYou will need to manually [register your project to Code Climate](https://codeclimate.com/dashboard) (Quality, not Velocity), until then it'll have no effect.\n\nThere are many things CC does for you, one of them is check that the license you use are OSS, for instance. (kinda handy, even if it gets mistaken sometimes)\n\n\n---\n\n## EsLint\n\nThis boilerplate comes with an ESLint [configuration](.eslintrc.yml). Feel free to change the rules at your convenience,\nbut it was difficult to make it work with TypeScript so we recommend keeping it around even if you don't use it immediately.\n\n```\nyarn lint # Watch mode, for development\nyarn lint:once # Useful for CI integration\nyarn lint:fix # Auto fix of rules - Pro tip: Commit your changes before doing that, that can be nasty\nyarn lint:fix:preview # Handy for previewing the result of the auto fix, but not apply it\n```\n\n\n---\n\n## Sentry\n\nThis boilerplate comes with [Sentry](https://sentry.io/) reporting, very handy.\n\nSentry works for both server and browser usage, the boilerplate comes with basic meta data tracking for debugging purposes.\n\nWe usually link Sentry to our Slack channels to get notifications in real time about what's wrong on our production environment.\n\nFeel free to replace it by another similar tooling of your choice!\n\nYou'll need to provide your `SENTRY_DSN` in `.env.local` file. You can get it at https://sentry.io/settings/unly/projects/YOUR_PROJECT/keys/\n\n### Configuring secret SENTRY_DSN in Vercel\n\nIn order to allow Vercel to access your SENTRY_DSN sensitive key, we use [Now secrets](https://vercel.com/docs/v2/environment-variables-and-secrets).\n\n- `vercel secrets add ntazb-sentry-dsn YOUR_DSN`\n\nThis ensures this secret is not git-tracked if you consider it's too sensitive.\nWe recommend using secrets for all sensitive information.\n\n**N.B**: You still need to have it in your `.env.local` file for local development. _(yeah, that sucks)_\n\n# Vulnerability disclosure\n\n[See our policy](https://github.com/UnlyEd/Unly).\n\n---\n\n# Contributors and maintainers\n\nThis project is being maintained by:\n- [Unly] Ambroise Dhenain ([Vadorequest](https://github.com/vadorequest)) **(active)**\n\n---\n\n# **[ABOUT UNLY]** \u003ca href=\"https://unly.org\"\u003e\u003cimg src=\"https://storage.googleapis.com/unly/images/ICON_UNLY.png\" height=\"40\" align=\"right\" alt=\"Unly logo\" title=\"Unly logo\" /\u003e\u003c/a\u003e\n\n\u003e [Unly](https://unly.org) is a socially responsible company, fighting inequality and facilitating access to higher education.\n\u003e Unly is committed to making education more inclusive, through responsible funding for students.\nWe provide technological solutions to help students find the necessary funding for their studies.\n\nWe proudly participate in many TechForGood initiatives. To support and learn more about our actions to make education accessible, visit :\n- https://twitter.com/UnlyEd\n- https://www.facebook.com/UnlyEd/\n- https://www.linkedin.com/company/unly\n- [Interested to work with us?](https://jobs.zenploy.io/unly/about)\n\nTech tips and tricks from our CTO on our [Medium page](https://medium.com/unly-org/tech/home)!\n\n#TECHFORGOOD #EDUCATIONFORALL\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Funlyed%2Fnext-typescript-api-vercel-boilerplate","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Funlyed%2Fnext-typescript-api-vercel-boilerplate","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Funlyed%2Fnext-typescript-api-vercel-boilerplate/lists"}