desenvolvimento de software usando angular e node para assistência social

67 Pages·2017·1.69 MB·Portuguese

by  Douglas Junqueira

UNIVERSIDADE TECNOLÓGICA FEDERAL DO PARANÁ
DEPARTAMENTO ACADÊMICO DE INFORMÁTICA
BACHARELADO EM CIÊNCIA DA COMPUTAÇÃO
DOUGLAS JUNQUEIRA
DESENVOLVIMENTO DE SOFTWARE USANDO ANGULAR E NODE
PARA ASSISTÊNCIA SOCIAL
TRABALHO DE CONCLUSÃO DE CURSO
PONTA GROSSA
2018
DOUGLAS JUNQUEIRA
DESENVOLVIMENTO DE SOFTWARE USANDO ANGULAR E NODE
PARA ASSISTÊNCIA SOCIAL
Trabalho de Conclusão de Curso apresentado
como requisito parcial à obtenção do título de
Bacharel em Ciência da Computação, do
Departamento Acadêmico de Informática, da
Universidade Tecnológica Federal do Paraná.
Orientador: Prof. Dr. Richard Duarte Ribeiro
PONTA GROSSA
2018
Ministério da Educação

Universidade Tecnológica Federal do Paraná

Câmpus Ponta Grossa

Diretoria de Graduação e Educação Profissional
Departamento Acadêmico de Informática

Bacharelado em Ciência da Computação

TERMO DE APROVAÇÃO
DESENVOLVIMENTO DE SOFTWARE USANDO ANGULAR E NODE PARA ASSISTÊNCIA
SOCIAL

por

DOUGLAS JUNQUEIRA

Este Trabalho de Conclusão de Curso (TCC) foi apresentado em 14 de Junho de 2018 como
requisito parcial para a obtenção do título de Bacharel em Ciência da Computação. O candidato foi
arguido pela Banca Examinadora composta pelos professores abaixo assinados. Após deliberação,
a Banca Examinadora considerou o trabalho aprovado.

__________________________________
Prof. Dr. Richard Duarte Ribeiro
Orientador(a)

___________________________________
Prof. Dr. Diego Roberto Antunes
Membro titular

___________________________________
Prof. MSc. Rafael dos Passos Canteri
Membro titular

________________________________ _____________________________
Prof(a). Dra. Helyane Bronoski Borges Prof. MSc. Saulo Jorge Beltrão de Queiroz
Responsável pelo Trabalho de Conclusão de Coordenador do curso
Curso
RESUMO
JUNQUEIRA, D. Desenvolvimento de software usando Angular e Node para assistência
social. 2018. 65 f. Trabalho de Conclusão de Curso (Bacharelado em Ciência da Computação)
—UniversidadeTecnológicaFederaldoParaná.PontaGrossa,2018.
O desenvolvimento de sistemas para web, que sejam escaláveis e eficientes não é apenas uma
tarefa difícil, mas um desafio a medida que a demanda, disponibilidade por funções e recursos
aumenta. Além do desafio de desenvolvimento, existem muitas organizações que ainda atuam
com base em papel e caneta devido ao custo desses sistemas para construção e manutenção.
Assim, este trabalho visa apresentar os conceitos usados no mercado, para o desenvolvimento
dearquiteturasvoltadasaweb,desdeossistemasclássicosàorientaçãoaeventos,alémdacons-
trução desenvolvido em Angular para a aplicação cliente, Node para servidor e SQL Server,
atravésdalicençafornecida,comobancodedadosoferecemumasoluçãopoderosaecompleta.
Os resultados avaliados não apresentam o cenário ideal, mas demonstram a viabilidade do uso
em redes locais. Através deste trabalho conclui-se que o sistema pode ser usado para atender o
objetivoprincipaleadicionaisprevistosnotrabalho.
Palavras-chaves:Framework.Node.Angular.SQLServer.Social.Assistência.
ABSTRACT
JUNQUEIRA, D. Software development using Angular and Node framework for Social
Assistance.2018.65f.WorkofConclusionCourse(UndergraduationinComputerScience)—
FederalUniversityofTechnology-Paraná.PontaGrossa,2018.
Developing web-based systems that are scalable and efficient is not an easy task but rather a
challenge as demand of access, data availability, and functions increases. In addition to the de-
velopmentchallenge,therearemanyorganizationsthatactonpenandpaperbecauseofthecost
for constructionandmaintenance ofweb systems.Thus, thiswork aimsto presentthe concepts
used in the market, for the development of web-oriented architectures, from classic methods to
event-drivensystems,inadditiontothedevelopedinAngularforapplicationclient,Nodeforthe
serverandSQLServer,throughaprovidedlicense,asadatabaseoffersapowerfulandcomplete
solution, but easy to develop and maintain, as an accessible solution to social assistance orga-
nizations. The results do not represent the ideal scenario, but demonstrate a viability of the use
inlocalnetworks.Asresult,thesystemcanbeusedtomeetthemainandadditionallyprovided
objectivesofthisarticle.
Key-words:Node.Angular.SQLServer.Social.Assistance.
LISTADEILUSTRAÇÕES
Figura1 – Diagramadosrequisitosfuncionais. ........................................... 13
Figura2 – Arquiteturascliente-servidorsegundoSommerville(2011)................... 18
Figura3 – Exemplodearquiteturasn-camadas............................................ 19
Figura4 – Exemplodesistemadeviagensmonolítico .................................... 20
Figura5 – Exemplodesistemadeviagensusandomicroservices ........................ 21
Figura6 – Exemplodecomunicaçãosíncrona............................................. 23
Figura7 – Exemplodecomunicaçãoassíncrona........................................... 24
Figura8 – Exemplodethreads paralelas................................................... 25
Figura9 – Event-LoopnoNode.js.......................................................... 29
Figura10 – Popularidadedosframeworks PHPem2013. ................................ 30
Figura11 – Aplicaçãodomodelorelacionalparausuários. .............................. 35
Figura12 – InformaçõesdeumusuárioapresentadascomoJSON....................... 36
Figura13 – ConstruçãodoservidoremNode.js........................................... 38
Figura14 – Chamadadarotadeusuárionoservidor. ..................................... 39
Figura15 – Tratamentodasrotasreferentesaousuário. .................................. 40
Figura16 – Modelodeusuário. ............................................................ 41
Figura17 – Estabelecimentodeconexãocombancodedados ........................... 43
Figura18 – Fluxodeexecuçãoparaoperaçõescombancodedados..................... 44
Figura19 – Recursosdisponíveisparausuárionoservidor............................... 45
Figura20 – Exemplodeaplicaçãodadiretivaeditável.................................... 47
Figura21 – Exemplo de tela de acesso, com a Figura 21(a) representando o estado
padrãoeaFigura21(b)representandoasalteraçõesdinâmicas................. 48
Figura22 – Exemplodeconfiguraçãoparateladinâmicacomdiretivas. ................ 48
Figura23 – Exemplodetelaconstruídacomautoform.................................... 49
Figura24 – Exemplodaorganizaçãoemcardsdoscamposcomautoform. ............. 49
Figura25 – Chamadadasdiretivasderelaçãoeautoform emtela........................ 50
Figura26 – Exemplodetelaconstruídacomdiretivarelação............................. 50
Figura27 – Exemplodemensagemdeerrodosistema.................................... 51
Figura28 – Estadospossíveisparaview deusuários. ..................................... 53
Figura29 – Exemplodecontroladorsimples. ............................................. 54
Figura30 – Gráficodetempoderespostacomsistemanamáquina3.................... 56
Figura31 – Gráficodelatênciacomsistemanamáquina3. .............................. 57
Figura32 – Gráficodetempoderespostacomsistemanamáquina1.................... 58
Figura33 – Gráficodelatênciacomsistemanamáquina1. .............................. 58
LISTADEQUADROS
Quadro1 – Requisitosnãofuncionais...................................................... 14
Quadro2 – Ciclosdedesenvolvimento..................................................... 15
Quadro3 – QuatroprincípiosdoAngular.................................................. 33
LISTADEABREVIATURASESIGLAS
API ApplicationProgrammingInterface
CPU UnidadeCentraldeProcessamento
CRUD Create,Read,UpdateeDelete
DOM ModelodeObjetodeDocumento
E/S EntradaseSaídas
EV Event-Loop
HTML LinguagemdeMarcaçãodeHipertexto
HTTP ProtocolodeTransferênciadeHipertextoSeguro
Jocum JovenscomUmaMissão
JocumPG JocumPontaGrossa
JSON JavaScriptObjectNotation
MVC ModelViewController
Node Node.js
RAM RandomAccessMemory
REST TransferênciadeEstadoRepresentacional
SGBD SistemaGerenciadordeBancodeDados
SO SistemaOperacional
SSD Unidadedeestadosólido
SUAS SistemaÚnicodeAssistênciaSocial
TI TecnologiadaInformação
URL LocalizadorPadrãodeRecursos
SUMÁRIO
1 INTRODUÇÃO............................................................................ 9
1.1 OBJETIVOS .............................................................................. 10
1.1.1 ObjetivoGeral .......................................................................... 10
1.1.2 ObjetivosEspecíficos................................................................... 10
1.2 JUSTIFICATIVA ......................................................................... 10
1.3 ORGANIZAÇÃODOTRABALHO..................................................... 11
2 ANÁLISEDEPROJETO ................................................................ 12
2.1 LEVANTAMENTODEREQUISITOS................................................. 12
2.1.1 Definiçãodoescopo.................................................................... 14
2.1.2 ModeloIterativoeIncremental ........................................................ 14
3 ARQUITETURAS ........................................................................ 17
3.1 CLIENTEESERVIDOR ................................................................ 17
3.2 MULTICAMADAS ...................................................................... 18
3.3 MICROSERVIÇOS....................................................................... 19
3.4 EFICIÊNCIAEESCALABILIDADE................................................... 22
3.5 COMUNICAÇÃOSíNCRONAOUBLOQUEANTE.................................. 22
3.6 COMUNICAÇÃOASSíNCRONAOUNÃO-BLOQUEANTE ....................... 24
3.7 THREADS................................................................................. 25
3.8 CONCLUSÕES........................................................................... 25
4 TECNOLOGIAS .......................................................................... 27
4.1 SERVIDOR............................................................................... 27
4.1.1 Node..................................................................................... 27
4.1.2 Laravel .................................................................................. 29
4.1.2.1 ReactPHP ............................................................................. 31
4.1.3 Comparação............................................................................. 31
4.2 CLIENTE ................................................................................. 32
4.2.1 Angular ................................................................................. 32
4.2.2 React .................................................................................... 33
4.2.3 ComparaçãoAngulareReact.......................................................... 34
4.3 BANCODEDADOS..................................................................... 35
4.3.1 SQLServer ............................................................................. 36
4.3.2 MongoDB............................................................................... 37
4.3.3 DefiniçãoSGBD........................................................................ 37
5 DESENVOLVIMENTODOSISTEMAEMODELOBÁSICO ..................... 38
5.1 SERVIDORNODE.JS ................................................................... 38
5.1.1 package.json ............................................................................ 38
5.1.2 Arquivoorigem......................................................................... 39
5.1.3 Rotas .................................................................................... 39
5.1.4 Modelos................................................................................. 40
5.1.4.1 conectaDB ............................................................................ 42
5.1.4.2 modelo ................................................................................ 43
5.1.5 ArquivosConf .......................................................................... 45
5.1.6 OpçõesAdicionais...................................................................... 45
5.2 FRONT-END COMANGULAR......................................................... 46
5.2.1 Templates ............................................................................... 46
5.2.2 Diretivas ................................................................................ 46
5.2.2.1 Editável ............................................................................... 46
5.2.2.2 Autoform.............................................................................. 48
5.2.2.3 Relação................................................................................ 50
5.2.2.4 Outros................................................................................. 51
5.2.3 ServiçosJS.............................................................................. 51
5.2.3.1 Security,Messages eConfigurações................................................. 51
5.2.4 Serviçosdeconfiguração............................................................... 52
5.2.5 Controladores........................................................................... 52
6 RESULTADOS ............................................................................ 55
7 CONCLUSÃO ............................................................................. 60
7.1 TRABALHOSFUTUROS............................................................... 61
Referências...................................................................................... 62