Configuração de NestJS e Graphql

Feb 01 2023
Aprenda back-end com seu conhecimento de front-end Olá a todos, bem-vindos de volta ao meu blog . Espero que todos estejam bem e que este blog os encontre com boa saúde ❤️.

Aprenda Backend com seu conhecimento de frontend

Olá a todos, bem-vindos de volta ao meu blog .
Espero que estejam bem e que este blog vos encontre de boa saúde ❤️.

Índice
·
Introdução
·
Instalação e configuração do seu projeto
·
Gerando recursos
·
Tipos de arquivos e sua importância
∘
module.ts
∘
entity/entity.ts
∘
resolver.ts / controller.ts
∘
service.ts
∘
graphql
∘
dto/input .ts

Introdução

Antes de começar com nosso tópico principal, vamos conhecer o NestJS.
NestJS é um framework Node que suporta Typescript e Javascript.
As pessoas que vêm do Backend podem achá-lo semelhante ao framework Spring.
Para pessoas de front-end como nós, criar APIs com uma estrutura que pode ser escrita em JS/TS é fascinante e eu realmente aprendi muito em minha exploração dessa estrutura.

Configuração de NestJS e Graphql

Não é como se não pudéssemos criar APIs usando o Node, mas o NestJS facilita a criação de APIs em Typescript e Javascript.

Esses blogs podem ser tratados como um iniciador do NestJS e da criação de APIs com o Graphql.

Instalação e configuração do seu projeto

# Step 1: Install NestJs globally in your local machine
npm i -g @nestjs/cli

# Step 2: Create a new Project
nest new project-name

# Step 3: Choose your Package Manager
? Which package manager would you ❤️  to use? (Use arrow keys)
❯ npm
  yarn
  pnpm

# Step 4: Wait for the packages to get installed in your machine.

Note: NestJS application starts from main.ts

Instalando bibliotecas GraphQL

# Step 5: Install Graphql libraries
npm i @nestjs/graphql @nestjs/apollo graphql apollo-server-express

import { ApolloDriver } from '@nestjs/apollo';
import { Module } from '@nestjs/common';
import { GraphQLModule } from '@nestjs/graphql';
import { join } from 'path';

@Module({
  imports: [
    GraphQLModule.forRoot({
      driver: ApolloDriver,
      typePaths: ['./**/*.graphql'],
      definitions: {
        path: join(process.cwd(), 'src/graphql.schema.ts'),
      },
    }),
  ],
  controllers: [],
  providers: [],
})
export class AppModule {}

NestJS e Angular compartilham uma estrutura de projeto semelhante. Podemos gerar Recursos de 2 formas

  • Criar manualmente os arquivos, como módulo, resolvedor, dto, controladores, etc.
  • Criando o módulo usando o comando
  • # Creating modules using command
    nest generate resource resource-name
    (OR)
    nest g resource resource-name
    
    # Choose your transport layer e.g. as we are using graphql go with either 2 or 3
    ? What transport layer do you use? (Use arrow keys)
    ❯ REST API 
      GraphQL (code first) 
      GraphQL (schema first) 
      Microservice (non-HTTP) 
      WebSockets 
    
    # Prompts to generate CRUD Operations for your resource
    ? Would you like to generate CRUD entry points? (Y/n)
    
    

    Code First: 
      Our code drives our development, Schema gets created later based on our code.
    
    Schema First: 
      Based on Schema, code is developed.
    

Outras formas de gerar arquivos

# Generating the module file of your resource
nest g mo module-name

# Generating controllers, resources, etc
nest g co controller-name

# Generating service file
nest g s service-name

Agora que temos nossos recursos gerados, vamos entender o que são esses arquivos e porque precisamos deles.

módulo.ts

Como temos main.js como uma entrada para nosso aplicativo, também temos um ponto de entrada para nosso recurso, que é module.ts. Todos os outros arquivos no recurso são definidos aqui.

# Example module.ts
import { Module } from '@nestjs/common';
import { CarService } from './car.service';
import { CarResolver } from './car.resolver';

@Module({
  providers: [CarResolver, CarService]
})
export class CarModule {}

Esta pasta é específica para as tabelas que devem ser geradas em nosso banco de dados. Digamos que você queira que uma tabela seja gerada em seu banco de dados Postgres, poderíamos especificar quais colunas, seus tipos e também chaves primárias podem ser definidas neste arquivo específico.

import { Entity, PrimaryGeneratedColumn, Column } from 'typeorm';

@Entity('car-table')
export class Car {
  @PrimaryGeneratedColumn('uuid')
  id: string;

  @Column('varchar', { length: 500 })
  name: string;
}

Este arquivo é específico para nossos endpoints de API.
resolver.ts - When we use graphql as transport layer.
controller.ts- When we use REST as transport layer.

import { Resolver, Query, Mutation, Args } from '@nestjs/graphql';
import { CarService } from './car.service';
import { CreateCarInput } from './dto/create-car.input';
import { UpdateCarInput } from './dto/update-car.input';

@Resolver('Car')
export class CarResolver {
  constructor(private readonly carService: CarService) {}

  @Mutation('createCar')
  create(@Args('createCarInput') createCarInput: CreateCarInput) {
    return this.carService.create(createCarInput);
  }

  @Query('car')
  findAll() {
    return this.carService.findAll();
  }

  @Mutation('updateCar')
  update(@Args('updateCarInput') updateCarInput: UpdateCarInput) {
    return this.carService.update(updateCarInput.id, updateCarInput);
  }
}

A conexão real do banco de dados e a lógica de negócios são colocadas aqui. isso será conectado com resolvedores.

import { Injectable } from '@nestjs/common';
import { CreateCarInput } from './dto/create-car.input';

@Injectable()
export class CarService {
  create(createCarInput: CreateCarInput) {
    return 'This action adds a new car';
  }

  findAll() {
    return `This action returns all car`;
  }
}

Este arquivo contém o esquema do nosso módulo como qual é o tipo de solicitação e qual será o tipo de resposta que retornará.

type Car {
  id: ID
  name: String
}

input CreateCarInput {
  name: String!
}
type Query {
  car: [Car]!
  car(id: Int!): Car
}

type Mutation {
  createCar(createCarInput: CreateCarInput!): Car!
}

Aí vem nosso último arquivo, esse arquivo é específico para as entradas utilizadas no recurso.

import { Field, ObjectType } from '@nestjs/graphql';

@ObjectType()
export class CreateCarDto {
  @Field() readonly id?: string;
  @Field() readonly name: string;
}

Aqui vamos nós, é isso pessoal para este blog.
Espero que todos tenham gostado deste blog.
Se gostou, bata palmas ,
e compartilhe com seu amigo.

Em meu próximo blog, vamos explorar conexões de banco de dados e também criar APIs.
Por favor, fique atento para o mesmo…

Para mais conteúdo emocionante no Frontend, por favor, siga-me .

Muito obrigado a todos .
Até a próxima,
bom aprendizado ✍️

Abhishek Kovuri , desenvolvedor de interface do usuário