Proto2Code: uma ferramenta para geração de código front-end a partir de protótipos de telas

Detalhes bibliográficos
Autor(a) principal: Farias, Mailton Viana
Data de Publicação: 2022
Tipo de documento: Trabalho de conclusão de curso
Idioma: por
Título da fonte: Repositório Institucional da UFAM
Texto Completo: http://riu.ufam.edu.br/handle/prefix/6163
Resumo: Front-End developers nowadays have several frameworks and software that help them develop their applications. During software development, some common activities require time and effort from the developers, such as the creation of basic registrations with routines for creating, reading, changing, and deleting data. More specifically, in the case of interface development, a lot of time is invested in the front-end implementation of these systems. Therefore, tools can be used to reduce this effort for developers. This work presents the Proto2Code tool, which can speed up the development process by generating front-end code (HTML and CSS) from interface prototypes. For this, a methodology was adopted which is divided into six steps for the construction of a code generator. To validate this version of the tool, a pilot study was conducted with two web developers who participated, in two stages, in the use of the tool. As a result, we found that the tool helps less experienced developers who use more traditional development tools, depending also on the type of prototype used.
id UFAM-1_6f7e078c310f4aafcdebf1b44f1160be
oai_identifier_str oai:localhost:prefix/6163
network_acronym_str UFAM-1
network_name_str Repositório Institucional da UFAM
repository_id_str
spelling Proto2Code: uma ferramenta para geração de código front-end a partir de protótipos de telasEngenharia de software com reusoPrototipaçãoGeração de códigoFront-endCIENCIAS EXATAS E DA TERRA: CIENCIA DA COMPUTACAODesenvolvimento ágil de softwareSoftware - DesenvolvimentoFront-End developers nowadays have several frameworks and software that help them develop their applications. During software development, some common activities require time and effort from the developers, such as the creation of basic registrations with routines for creating, reading, changing, and deleting data. More specifically, in the case of interface development, a lot of time is invested in the front-end implementation of these systems. Therefore, tools can be used to reduce this effort for developers. This work presents the Proto2Code tool, which can speed up the development process by generating front-end code (HTML and CSS) from interface prototypes. For this, a methodology was adopted which is divided into six steps for the construction of a code generator. To validate this version of the tool, a pilot study was conducted with two web developers who participated, in two stages, in the use of the tool. As a result, we found that the tool helps less experienced developers who use more traditional development tools, depending also on the type of prototype used.Desenvolvedores Front-End hoje em dia dispõem de vários frameworks e softwares que os auxiliam no desenvolvimento de suas aplicações. Durante o desenvolvimento de software, algumas atividades comuns requerem tempo e esforço dos desenvolvedores como por exemplo criação de cadastros básicos com rotinas de criação, leitura, alteração e exclusão de dado. Mais especificamente, no caso de desenvolvimento de interfaces, muito tempo é investido na implementação front-end desses sistemas. Com isso, ferra- mentas podem ser utilizadas para diminuir esse esfoço de desenvolvimento ou para os desenvolvedores. Este trabalho apresenta a ferramenta Proto2Code, que visa acelerar o processo de desenvolvimento de aplicações através de geração de código front-end (HTML e CSS) a partir de protótipos de interface. Para isso, foi adotada uma metodo- logia que é dividida em seis etapas para a construção de um gerador de código. Para validar essa versão da ferramenta, realizou-se um estudo piloto com dois desenvolve- dores webs que participaram, em duas etapas, no uso da ferramenta. Como resultado, verificou-se que a ferramenta auxilia desenvolvedores menos experientes que utilizam ferramentas mais tradicionais de desenvolvimento, dependendo também, do tipo de protótipo utilizado.3NãoBrasilFT - Faculdade de TecnologiaManaus (AM)Engenharia da Computação - Bacharelado - ManausGadelha, Bruno Freitashttp://lattes.cnpq.br/4987487225451219Macedo, Gretchen Torres deFernandes, DavidOran, Ana CarolinaFarias, Mailton Viana2022-05-04T02:26:27Z2022-05-012022-05-04T02:26:27Z2022-04-19info:eu-repo/semantics/publishedVersioninfo:eu-repo/semantics/bachelorThesishttp://riu.ufam.edu.br/handle/prefix/6163porinfo:eu-repo/semantics/openAccessreponame:Repositório Institucional da UFAMinstname:Universidade Federal do Amazonas (UFAM)instacron:UFAM2025-03-10T20:37:26Zoai:localhost:prefix/6163Repositório InstitucionalPUBhttp://riu.ufam.edu.br/oai/requestopendoar:2025-03-10T20:37:26Repositório Institucional da UFAM - Universidade Federal do Amazonas (UFAM)false
dc.title.none.fl_str_mv Proto2Code: uma ferramenta para geração de código front-end a partir de protótipos de telas
title Proto2Code: uma ferramenta para geração de código front-end a partir de protótipos de telas
spellingShingle Proto2Code: uma ferramenta para geração de código front-end a partir de protótipos de telas
Farias, Mailton Viana
Engenharia de software com reuso
Prototipação
Geração de código
Front-end
CIENCIAS EXATAS E DA TERRA: CIENCIA DA COMPUTACAO
Desenvolvimento ágil de software
Software - Desenvolvimento
title_short Proto2Code: uma ferramenta para geração de código front-end a partir de protótipos de telas
title_full Proto2Code: uma ferramenta para geração de código front-end a partir de protótipos de telas
title_fullStr Proto2Code: uma ferramenta para geração de código front-end a partir de protótipos de telas
title_full_unstemmed Proto2Code: uma ferramenta para geração de código front-end a partir de protótipos de telas
title_sort Proto2Code: uma ferramenta para geração de código front-end a partir de protótipos de telas
author Farias, Mailton Viana
author_facet Farias, Mailton Viana
author_role author
dc.contributor.none.fl_str_mv Gadelha, Bruno Freitas
http://lattes.cnpq.br/4987487225451219
Macedo, Gretchen Torres de
Fernandes, David
Oran, Ana Carolina
dc.contributor.author.fl_str_mv Farias, Mailton Viana
dc.subject.por.fl_str_mv Engenharia de software com reuso
Prototipação
Geração de código
Front-end
CIENCIAS EXATAS E DA TERRA: CIENCIA DA COMPUTACAO
Desenvolvimento ágil de software
Software - Desenvolvimento
topic Engenharia de software com reuso
Prototipação
Geração de código
Front-end
CIENCIAS EXATAS E DA TERRA: CIENCIA DA COMPUTACAO
Desenvolvimento ágil de software
Software - Desenvolvimento
description Front-End developers nowadays have several frameworks and software that help them develop their applications. During software development, some common activities require time and effort from the developers, such as the creation of basic registrations with routines for creating, reading, changing, and deleting data. More specifically, in the case of interface development, a lot of time is invested in the front-end implementation of these systems. Therefore, tools can be used to reduce this effort for developers. This work presents the Proto2Code tool, which can speed up the development process by generating front-end code (HTML and CSS) from interface prototypes. For this, a methodology was adopted which is divided into six steps for the construction of a code generator. To validate this version of the tool, a pilot study was conducted with two web developers who participated, in two stages, in the use of the tool. As a result, we found that the tool helps less experienced developers who use more traditional development tools, depending also on the type of prototype used.
publishDate 2022
dc.date.none.fl_str_mv 2022-05-04T02:26:27Z
2022-05-01
2022-05-04T02:26:27Z
2022-04-19
dc.type.status.fl_str_mv info:eu-repo/semantics/publishedVersion
dc.type.driver.fl_str_mv info:eu-repo/semantics/bachelorThesis
format bachelorThesis
status_str publishedVersion
dc.identifier.uri.fl_str_mv http://riu.ufam.edu.br/handle/prefix/6163
url http://riu.ufam.edu.br/handle/prefix/6163
dc.language.iso.fl_str_mv por
language por
dc.rights.driver.fl_str_mv info:eu-repo/semantics/openAccess
eu_rights_str_mv openAccess
dc.publisher.none.fl_str_mv Brasil
FT - Faculdade de Tecnologia
Manaus (AM)
Engenharia da Computação - Bacharelado - Manaus
publisher.none.fl_str_mv Brasil
FT - Faculdade de Tecnologia
Manaus (AM)
Engenharia da Computação - Bacharelado - Manaus
dc.source.none.fl_str_mv reponame:Repositório Institucional da UFAM
instname:Universidade Federal do Amazonas (UFAM)
instacron:UFAM
instname_str Universidade Federal do Amazonas (UFAM)
instacron_str UFAM
institution UFAM
reponame_str Repositório Institucional da UFAM
collection Repositório Institucional da UFAM
repository.name.fl_str_mv Repositório Institucional da UFAM - Universidade Federal do Amazonas (UFAM)
repository.mail.fl_str_mv
_version_ 1827784306289803264