https://github.com/lukeautry/ts-app

Boilerplate project for a TypeScript API (Express, tsoa) + UI (React/TSX)
https://github.com/lukeautry/ts-app

express node postgresql react redis typescript webpack

Last synced: 3 days ago
JSON representation

Boilerplate project for a TypeScript API (Express, tsoa) + UI (React/TSX)

• Host: GitHub
• URL: https://github.com/lukeautry/ts-app
• Owner: lukeautry
• Created: 2018-11-21T04:44:34.000Z (almost 6 years ago)
• Default Branch: master
• Last Pushed: 2023-01-23T22:29:20.000Z (almost 2 years ago)
• Last Synced: 2024-10-25T20:20:21.343Z (9 days ago)
• Topics: express, node, postgresql, react, redis, typescript, webpack
• Language: TypeScript
• Size: 2.16 MB
• Stars: 270
• Watchers: 8
• Forks: 52
• Open Issues: 22
• Metadata Files:
  • Readme: README.MD

Awesome Lists containing this project

README

        
![ci](https://github.com/lukeautry/ts-app/workflows/ci/badge.svg?branch=master)

# ts-app: Full-stack TypeScript Development Framework

This project is a starting point for developing an API-first application using TypeScript, Node.js, and React.

This project aims to support a "domain driven" approach. A client library is automatically generated from the API, providing a statically typed interface with which to interact with the API from the React UI. The goal is to provide a type-safe and productive developer experience for rapid web application development.

** **Check out the new [SaaS branch](https://github.com/lukeautry/ts-app/tree/saas)!** Includes login flow, password reset, routing, emails and email previews, component library development via Cosmos, and more **

## Getting started

- `yarn` to install dependencies

- `yarn build` to build from source

- `yarn cli start` to start developer environment

- `yarn cli` to use developer CLI

    - Includes dev environment setup, docker management, database management, and more

    - [Full CLI docs](./src/cli)

## Developer experience

![alt text](.docs/shell.png "Developer experience")

## Project structure

This project uses [TypeScript Project References](https://www.typescriptlang.org/docs/handbook/project-references.html) to organize modules. This gives us:

- Faster builds

- Formal project dependencies; subprojects can't import from other subprojects unless the dependency is configured

### Packages

- [cli](./src/cli) - Developer CLI tool

- [client](./src/client) - Front-end React App

- [common](./src/common) - Modules used by either browser or node environments

- [node](./src/node) - Modules used by node environments

- [server](./src/server) - Express server w/ tsoa API

- [openapi-client](./src/openapi-client) - Autogenerated TypeScript client; used to communicate with OpenAPI REST API from [client](./src/client)

- [cypress](./src/cypress) - Cypress tests

## System Requirements

- [Node.js 14+](https://nodejs.org/en/download/)

- [docker](https://www.docker.com) and [docker-compose](https://docs.docker.com/compose)

- [yarn](https://yarnpkg.com/en)

## Technologies Used

- [TypeScript](http://www.typescriptlang.org/)

- Backend

    - [Node.js](https://nodejs.org)

    - [Express](https://expressjs.com/)

    - [tsoa](https://github.com/lukeautry/tsoa)

        - Generates Express Routes from TypeScript controllers

        - Generates [OpenAPI ("Swagger")](https://swagger.io/docs/specification/about) specification, enabling automatic documentation and client library generation

    - [PostgreSQL](https://www.postgresql.org/) as RDBMS

        - [TypeORM](http://typeorm.io) for code-first database migrations

            - Optional: ORM-like queries

    - [Redis](https://redis.io/) for caching/messaging

- Frontend

    - [react](https://reactjs.org/)

    - [openapi-typescript-codegen](https://github.com/ferdikoomen/openapi-typescript-codegen) for API client generation

    - [styled-components](https://styled-components.com/) for styling/css

    - [webpack](https://webpack.js.org) for bundling static assets

- Developer environment

    - [docker](https://www.docker.com/) and [docker-compose](https://docs.docker.com/compose) for non-Node.js project dependencies

    - Single `start` script that live reloads the API, UI, and related services

    - VSCode [launch.json](./.vscode/launch.json) settings have been included to support debugging

- Testing

    - [jest](https://jestjs.io) test runner/assertions/utilities

    - [supertest](https://github.com/visionmedia/supertest) for API endpoint tests

    - [cypress](https://www.cypress.io/) for end-to-end testing

    - [react-testing-library](https://testing-library.com/docs/react-testing-library/intro) for component testing

## Running Tests

### Jest Tests

Includes server node.js tests and front-end react-testing-library tests.

```

yarn cli test jest

```

### Cypress Tests

End to end tests that touch everything and hit a running version of the application

```

yarn cli test cypress

```

## Contributing

- Features and bug fixes welcome