COMPARATIVE BETWEEN CSS FRAMEWORKS BOOTSTRAP AND BULMA FOR WEB PROJECT DEVELOPMENT

Authors

  • Leonardo Patrocinio Souza Faculdade de Tecnologia de Taquaritinga (Fatec) – Taquaritinga – São Paulo – Brasil
  • Felipe do Espírito Santo Faculdade de Tecnologia de Taquaritinga (Fatec) – Taquaritinga – São Paulo – Brasil https://orcid.org/0000-0002-0576-614X

DOI:

https://doi.org/10.31510/infa.v17i1.785

Keywords:

Frameworks de CSS, Bootstrap, Bulma, Responsividade

Abstract

Web development is always in constant progress: developers create new tools to assist in the process of building projects for the web and there are countless tools and the most diverse purposes. This article aims to approach the CSS frameworks Bootstrap and Bulma, tools that help in the development of web projects in general. Observing the current technology, it is very important that the developer analyzes some points about this development process, such as, security, accessibility, responsiveness and, mainly, the experience that the user will have in using this application. Responsiveness is an extremely important requirement. Having an application that works well on any mobile device (cell phones, tablets, among others) is essential, as it makes access easier on these devices, making the user quickly locate their searches. Based on a bibliographic search to present the concepts of frameworks and analyze the two proposed options, it was found that there are several different characteristics in each one, however, the article highlighted the introduction to the concept, the similarities, the main resources, strengths and weaknesses. Both frameworks showed advantages and disadvantages and can be good in different web applications, but in certain points, the study demonstrated the reasons for choosing one of them.

Downloads

Download data is not yet available.

Metrics

Metrics Loading ...

References

AMORIM, Simone. Você precisa de um Framework CSS?: Leia primeiro e conte-me depois. 2017. Disponível em: https://medium.com/@simoneas02/voc%C3%AA-precisa-de-um-framework-css-922c02ade6a5. Acesso em: 29 nov. 2019.

ARTY, David. Manual de Web Design Responsivo: Projete para Todos Dispositivos. São Paulo: [s. n.], 2015. 39 p. Disponível em: https://www.chiefofdesign.com.br/ebook-web-design-responsivo/. Acesso em: 2 abr. 2020.

BOOTSTRAP. Migration: guidance on how to upgrade from bootstrap v3.x to v4.x with emphasis on major changes, what's new, and what's been removed. 2015. Disponível em: https://v4-alpha.getbootstrap.com/migration/. Acesso em: 04 abr. 2020.

BOOTSTRAP. Bootstrap é o mais popular framework HTML, CSS, e JS para desenvolvimento de projetos responsivo e focado para dispositivos móveis na web. Disponível em: https://getbootstrap.com.br/docs/3.3/. Acesso em: 03 abr. 2020.

BOOTSTRAP. Bootstrap. Disponível em: https://getbootstrap.com.br/. Acesso em: 03 abr. 2020.

BULMA. Bulma. 2020. Disponível em: https://bulma.io/. Acesso em: 03 abr. 2020.

BULMA. Coming from Bootstrap: See how Bulma is an alternative to Bootstrap. Disponível em: https://bulma.io/alternative-to-bootstrap/. Acesso em: 03 abr. 2020.

CONFIGR. O que são frameworks para desenvolvimento WEB. (Conheça os melhores para PHP, Python e Ruby). 31 julho 2019. Disponível em: <https://configr.com/blog/frameworks-para-desenvolvimento-web/>. Acesso em: 20 nov. 2019.
DEVMEDIA. Bate papo sobre Frameworks. Rio de Janeiro. Disponível em: https://www.devmedia.com.br/frameworks-uma-visao-inicial/37477. Acesso em: 20 nov. 2019.
DAITYARI, Shaumik. Bootstrap vs Foundation vs Bulma vs Semantic vs UIkit. 2020. Disponível em: https://www.codeinwp.com/blog/bootstrap-vs-foundation-vs-bulma-vs-semantic-vs-uikit/. Acesso em: 04 abr. 2020.

ESCUDELARIO, Bruna de Freitas. Conhecendo o framework Bulma. 2019. Disponível em: https://imasters.com.br/css/conhecendo-o-framework-bulma. Acesso em: 03 abr. 2020.

GASPAROTTO, Henrique Machado. Bootstrap ou Materialize: Conheça as principais diferenças. 2017. Colaborador DEVMEDIA. Disponível em: https://www.devmedia.com.br/bootstrap-ou-materialize-conheca-as-principais-diferencas/37830. Acesso em: 04 abr. 2020.

GITHUB. Twbs / bootstrap: The most popular html, css, and javascript framework for developing responsive, mobile first projects on the web. 2020. Disponível em: https://github.com/twbs/bootstrap. Acesso em: 05 abr. 2020.

GITHUB. Jgthms / bulma: modern css framework based on flexbox. Modern CSS framework based on Flexbox. 2020. Disponível em: https://github.com/jgthms/bulma. Acesso em: 05 abr. 2020.

JAIN, Nilesh. REVIEW OF DIFFERENT RESPONSIVE CSS FRONT-END FRAMEWORKS. Journal Of Global Research In Computer Science. Mandsaur, p. 1-6. 11 nov. 2014. Disponível em: http://www.jgrcs.info/index.php/jgrcs. Acesso em: 20 nov. 2019.

KNIGHT, Kayla. Responsive Web Design: What It Is and How To Use It. In: Smashing Magazine. 2011. Disponível em: https://www.smashingmagazine.com/2011/01/guidelines-for-responsive-web-design/. Acesso em abril de 2020.

LEONE, Leonello de. Bootstrap: o que é, porque usar e como começar com o framework. 2018. Editor do BECODE. Disponível em: https://becode.com.br/bootstrap-o-que-e-porque-usar-e-como-comecar/. Acesso em: 04 abr. 2020.

MULLER, Nicolas. Framework, o que é e para que serve? 2008. Disponível em: https://www.oficinadanet.com.br/artigo/1294/framework_o_que_e_e_para_que_serve. Acesso em: 11 nov. 2019.

MARCOTTE, Ethan. 2010. Responsive Web Design. Disponível em: https://alistapart.com/article/responsive-web-design/, Acesso em: 2 de abril. 2020.

PAGANI, Talita. Quando utilizar (ou não) frameworks CSS: A utilização de frameworks HTML e/ou CSS ainda é um assunto que divide a opinião dos desenvolvedores. 2011. Disponível em: https://tableless.com.br/quando-utilizar-ou-nao-frameworks-css/, Acesso em: 29 nov. 2019.

SILVA, Arthur de Almeida Pereira da. DESIGN RESPONSIVO: TÉCNICAS, FRAMEWORKS E FERRAMENTAS. 2014. 86 f. TCC (Graduação) - Curso de Sistemas de Informação, Centro de Ciências Exatas e Tecnologia, Universidade Federal do Estado do Rio de Janeiro (unirio), Rio de Janeiro, 2014.

STACKSHARE. JavaScript: lightweight, interpreted, object-oriented language with first-class functions developer.mozilla.org. 2019. Disponível em: https://www.stackshare.io/javascript. Acesso em: 05 abr. 2020.

STACKSHARE. Bootstrap vs Bulma. 2020. Disponível em: https://stackshare.io/stackups/bootstrap-vs-bulma. Acesso em: 03 abr. 2020.

VYAS, Deep. Bootstrap vs. Bulma. 2019. Disponível em: https://aspiresoftware.in/blog/bootstrap-vs-bulma/. Acesso em: 03 abr. 2020.

W3SCHOOLS. Bootstrap 4 Get Started. 2019. Disponível em: https://www.w3schools.com/bootstrap4/bootstrap_get_started.asp. Acesso em: 03 abr. 2020.

Published

2020-08-04

How to Cite

SOUZA, L. P.; ESPÍRITO SANTO, F. do. COMPARATIVE BETWEEN CSS FRAMEWORKS BOOTSTRAP AND BULMA FOR WEB PROJECT DEVELOPMENT. Revista Interface Tecnológica, [S. l.], v. 17, n. 1, p. 140–152, 2020. DOI: 10.31510/infa.v17i1.785. Disponível em: https://revista.fatectq.edu.br/interfacetecnologica/article/view/785. Acesso em: 22 jul. 2024.

Issue

Section

Tecnologia em Informática

Metrics

Views
  • Abstract 3438
  • PDF (Português (Brasil)) 2228
Métricas