Angular Schematics: Criando geradores de código

Slide 1

Slide 1 text

Slide 2

Slide 2 text

2 Ricardo Mello Lead Front-End Engineer at TOTVS Community Manager at Angular Rio

Slide 3

Slide 3 text

Slide 4

Slide 4 text

Slide 5

Slide 5 text

5 Tarefas Repetitivas 01 Quantas tarefas você já faz no modo automático?

Slide 6

Slide 6 text

6 Tarefas Repetitivas - CRUD • Gerar um módulo • Importar o SharedModule • Setar as Rotas • Gerar os componentes • Layoutar a lista • Layoutar o form

Slide 7

Slide 7 text

7 E se? • Gerar um módulo • Importar o SharedModule • Setar as Rotas • Gerar os componentes • Layoutar a lista • Layoutar o form

Slide 8

Slide 8 text

Slide 9

Slide 9 text

9 O que fazem, onde vivem? O que são Schematics 02

Slide 10

Slide 10 text

10 O que são Schematics Um gerador de código baseado em templates que suporta lógica complexa.

Slide 11

Slide 11 text

11 O que são Schematics É um conjunto de instruções para modificar um software gerando ou modificando código.

Slide 12

Slide 12 text

12 Como funciona 03

Slide 13

Slide 13 text

13 Como funciona

Slide 14

Slide 14 text

14 Gerando um projeto npx schematics blank --name=my-schematics

Slide 15

Slide 15 text

15 Collections Uma coleção de Schematics. Ex.: @schematics/angular

Slide 16

Slide 16 text

16 Collections

Slide 17

Slide 17 text

17 RuleFactory RuleFactory é uma função que define uma Rule. A Rule recebe uma Tree, e a retorna modificada.

Slide 18

Slide 18 text

18 RuleFactory

Slide 19

Slide 19 text

19 Compilando npm run build

Slide 20

Slide 20 text

20 Executando schematics .:my-schematics --name=awesome

Slide 21

Slide 21 text

21 Mãos a obra 04

Slide 22

Slide 22 text

22 Exemplos http://bit.ly/tdc-sp-2020-schematics

Slide 23

Slide 23 text

23 Perguntas? 05

Slide 24

Slide 24 text

#SOMOSTOTVERS • Tecnologia + Conhecimento são nosso DNA. • O sucesso do cliente é o nosso sucesso. • Valorizamos gente boa que é boa gente. totvs.com @totvs /totvs company/totvs totvs.store @totvs OBRIGADO Ricardo Mello Lead Front-End Engineer http://github.com/ricardo-mello https://www.linkedin.com/in/ricardomello1