Giter Site home page Giter Site logo

graphql-template's Introduction

πŸ˜Œγ€€generated from tuanlc/graphql_clean-architecture_boilerplate

GraphQL + Clean Architectire boilerplate

I wrote an article about this boilerplate at:

Discussion & Comments are warmly welcomed!

Feel free to send PRs to improve this repository. I hope this work will save time for you and the people in the community who are considering to adopt Graphql + Typescript + Clean Architeture.

Inspiration

The Clean Architecture is an awesome guide for developers who desire to build a clean, structured and maintainable projects. The letter L in SOLID principal allows us to make depended components are easily replaced without touch to the business and the core of systems. For example of the web server where there are many frameworks out there (Expressjs, GraphQL, etc) and the chosen decision depends on the purpose of the business and the context.

In this boilerplate guide scope we will go throght how to make the core business immune with the change of the detailed technologies. Let's go!

Boilerplate

Code structure

.
β”œβ”€β”€ package.json
β”œβ”€β”€ package-lock.json
β”œβ”€β”€ README.md
β”œβ”€β”€ src
β”‚   β”œβ”€β”€ application
β”‚   β”‚   β”œβ”€β”€ auth
β”‚   β”‚   β”‚   └── index.ts
β”‚   β”‚   β”œβ”€β”€ graphql
β”‚   β”‚   β”‚   β”œβ”€β”€ index.ts
β”‚   β”‚   β”‚   β”œβ”€β”€ schemaShards
β”‚   β”‚   β”‚   β”‚   β”œβ”€β”€ index.ts
β”‚   β”‚   β”‚   β”‚   └── users.ts
β”‚   β”‚   β”‚   β”œβ”€β”€ subscriptionManager.ts
β”‚   β”‚   β”‚   └── utils
β”‚   β”‚   β”‚       └── mergeRawSchemas.ts
β”‚   β”‚   └── index.ts
β”‚   β”œβ”€β”€ dto
β”‚   β”‚   └── user.dto.ts
β”‚   β”œβ”€β”€ entities
β”‚   β”‚   └── user.entity.ts
β”‚   β”œβ”€β”€ index.ts
β”‚   β”œβ”€β”€ IoC
β”‚   β”‚   β”œβ”€β”€ container.ts
β”‚   β”‚   β”œβ”€β”€ icradle.interface.ts
β”‚   β”‚   └── providers
β”‚   β”‚       β”œβ”€β”€ auth.provider.ts
β”‚   β”‚       └── user.provider.ts
β”‚   β”œβ”€β”€ persistence
β”‚   β”‚   β”œβ”€β”€ auth.repository.ts
β”‚   β”‚   β”œβ”€β”€ constants.ts
β”‚   β”‚   β”œβ”€β”€ password.ts
β”‚   β”‚   └── user.repository.ts
β”‚   β”œβ”€β”€ services
β”‚   β”‚   β”œβ”€β”€ auth.repository.interface.ts
β”‚   β”‚   β”œβ”€β”€ auth.service.ts
β”‚   β”‚   β”œβ”€β”€ user.repository.interface.ts
β”‚   β”‚   └── user.service.ts
β”‚   └── __typedefs
β”‚       β”œβ”€β”€ graphqlTypes.d.ts
β”‚       └── schema.graphql
└── tsconfig.json

The main folder is src where contains the implementation:

  • application: Application layer where we can use a backend web application framework. In this boilerplate is GraphQL
  • service: The business service layer where we defined the logic to handle application usecases. This layers also contains adapters that abstract the detailed actions, for example, access to database.
  • entities: This is the corest component of the application where we define the application entities.
  • persistence: This is another detailed layer where we specify actions to communicate to database, message queue, etc.
  • dto: (stand for Data Transfer Object) defines communication contracts between layers. For example, what type of input params or returned value that is used in methods of layers
  • IoC: (stand for Iversion of Control) is an implementation of the Dependency Injection, the letter D in the SOLID principal. Everytime you create a new Service class, or a new repository class, or a new controller, you need to register them in this container. This boilerplate uses Awilix library to achieve the factor.

Communication Policies

The communication policies between layers and domains compliant with the Clean Architecture. The directions of arrows in the following diagrams show the relation between components. For example, if an arrow direction from component X to component Y, it means component X depends on the component Y.

  1. Dependency diagram Dependency diagram

As you can see in the diagram the dependency flow among layers:

  • Entity is the core layer and does not depend on any component
  • To inverse the dependency from the domain business layer to the repository layer, there is a repository interface in the domain business. This allows us to be able to implement and update this layer with the detailed technologies
  • Application Controller depends in the services
  • IoC container depends on services, repositories and application controllers because we need to register all of them to the container
  • Application router depends on the IoC container that allows us to use registered application controllers to handle client requests
  1. Dependency between domains Dependency between domains diagram

In real-life projects, of course, there is not merely 1 domain. So, we need to define the communication rules between layers of them.

Getting Started

There are some beginning available commandlines is defined the scripts part of the package.json file.

  1. Install dependencies
npm i
  1. Run the application under the dev mode with the hot reload feature
npm run dev
  1. Compile the application
npm run build
  1. Run the applicatino under the production mode. You need to compile the application before
npm run start
  1. Generate types for GraphQL schema. This action must be done each time you update the GraphQL schema to allow typescript compiler understand your schema:
npm run generate-typedefs

References

graphql-template's People

Contributors

codemountains avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    πŸ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. πŸ“ŠπŸ“ˆπŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❀️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.