ambiente virtual para suporte a ...monografias.poli.ufrj.br/monografias/monopoli10022782.pdfambiente...
TRANSCRIPT
AMBIENTE VIRTUAL PARA SUPORTE A
DESENVOLVEDORES NA LINGUAGEM DE
PROGRAMAÇÃO WITTY
Felipe Maia Batista Vasques da Cruz
Projeto de Graduação apresentado ao Curso de
Engenharia Eletrônica e de Computação da Escola
Politécnica, Universidade Federal do Rio de
Janeiro, como parte dos requisitos necessários à
obtenção do título de Engenheiro.
Orientador: Flávio Luis de Mello
Rio de Janeiro
Julho de 2017
4
UNIVERSIDADE FEDERAL DO RIO DE JANEIRO
Escola Politécnica – Departamento de Eletrônica e de Computação
Centro de Tecnologia, bloco H, sala H-217, Cidade Universitária
Rio de Janeiro – RJ CEP 21949-900
Este exemplar é de propriedade da Universidade Federal do Rio de Janeiro, que
poderá incluí-lo em base de dados, armazenar em computador, microfilmar ou adotar
qualquer forma de arquivamento.
É permitida a menção, reprodução parcial ou integral e a transmissão entre
bibliotecas deste trabalho, sem modificação de seu texto, em qualquer meio que esteja
ou venha a ser fixado, para pesquisa acadêmica, comentários e citações, desde que sem
finalidade comercial e que seja feita a referência bibliográfica completa.
Os conceitos expressos neste trabalho são de responsabilidade do(s) autor(es).
5
DEDICATÓRIA
Dedico este trabalho à minha família e à comunidade acadêmica, como forma de
contribuir com uma pequena parcela para o conhecimento nacional.
6
AGRADECIMENTO
Pela oportunidade de alcançar mais este objetivo em minha vida, agradeço
primeiramente à minha família, pelo suporte e estrutura fornecidos, pelo apoio nos
momentos fáceis e difíceis que permearam todos esses anos de graduação. Agradeço
também aos amigos e pessoas próximas que contribuíram e contribuem para fazer de
mim quem eu sou. Sem dúvida, este foi o estágio que me permitiu e causou maior
desenvolvimento como ser humano e cidadão. Pelos bons e maus momentos, por tudo
que foi vivido, sou plenamente grato.
7
RESUMO
O presente trabalho tem como objetivo desenvolver um ambiente virtual para
desenvolvedores da linguagem de programação Witty. Esta linguagem foi desenvolvida
para implementar sistemas baseados em conhecimento, uma categoria que se distingue
de sistemas de computação convencionais por possuir uma máquina de inferência e ser
capaz de gerar informação e tirar conclusões a partir de conhecimentos incompletos. Por
se tratar de uma linguagem ainda não difundida amplamente, este projeto se propõe a
desenvolver um manual de referência online para a linguagem, assim como uma
plataforma de fórum de discussão para que usuários possam trocar conhecimento e
permanecer ainda mais engajados com a linguagem, dando maior velocidade à evolução
da mesma. Foram abordados tópicos a respeito do que são sistemas baseados em
conhecimento, sobre formas de documentação de linguagens de programação, assim
como seções que tratam de tecnologias web amplamente utilizadas no mundo atual. Por
fim, será descrito o processo de construção do trabalho e apresentadas conclusões a
respeito dos resultados obtidos, assim como do processo de desenvolvimento
percorrido.
Palavras-Chave: sistemas baseados em conhecimento, linguagem de programação,
documentação de linguagem de programação, fórum online, desenvolvimento web,
tecnologias web, linguagem de programação witty.
8
ABSTRACT
The present work aims to develop a virtual environment targeted at developers
of the Witty language. Witty was developed to implement knowledge-based systems, an
approach different from traditional computing systems because it contains an inference
machine mechanism which can generate information and take conclusions based on
incomplete knowledge. Since the language is not yet widely known, this project
proposes the development of an online reference manual, as well as a forum platform in
which users are able to exchange information and become more engaged with the
language. It is discussed topics related to knowledge-based systems, forms of
programming languages documentation, as well as web technologies that are most used
today. Finally, the development process of this project will be described and it will be
presented conclusions about the results.
Key-words: knowledge-based systems, programming language, programming language
documentation, online forum, web development, web technologies, witty programming
language.
9
SIGLAS
CSS – Cascading StyleSheets
GUI – Graphical User Interface
HTML – HyperText Markup Language
ID – Identifier
UFRJ – Universidade Federal do Rio de Janeiro
URL – Uniform Resource Locator
10
Sumário
1 Introdução 14
1.1 - Tema . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14
1.2 - Delimitação . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14
1.3 - Justificativa . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14
1.4 - Objetivos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 15
1.5 - Metodologia . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 16
1.6 - Descrição . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 16
2 Linguagem de programação para sistemas baseados em
conhecimento
18
2.1 - Introdução a sistemas baseados em conhecimento . . . . . . . 18
2.2 - Linguagem de programação Witty . . . . . . . . . . . . . . . . . . . 21
2.3 - Documentação de linguagens de programação . . . . . . . . . . 24
3 Tecnologias Web 28
3.1 - HTML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 28
3.2 - CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 30
3.3 - JavaScript . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 33
3.4 - PHP . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 36
3.5 - Páginas estáticas versus páginas dinâmicas . . . . . . . . . . . . 40
3.6 - Registro, hospedagem e manutenção de páginas web . . . . . 42
11
4 Softwares de fórum online 44
4.1 - Aplicações web . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 44
4.2 - Comparação entre os softwares de fórum . . . . . . . . . . . . . 45
5 Implementação 48
5.1 - Descrição do problema . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 48
5.2 - Metodologia do trabalho . . . . . . . . . . . . . . . . . . . . . . . . . . . . 48
5.3 - Implementação . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 49
5.4 - Atividades administrativas do fórum . . . . . . . . . . . . . . . . . . . 62
6 Conclusão 67
6.1 - Conclusões . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 67
6.2 - Trabalhos futuros . . . . . . . . . . . . . 68
7 Bibliografia 69
12
Lista de Figuras
2.1 – Estrutura de um sistema baseado em conhecimento. . . . . . . . . . . . . . . . . . . 20
2.2 – GUI (Graphic User Interface) da ferramenta Witty . . . . . . . . . . . . . . . . . . . 22
2.3 – Exemplo de uso de função que modifica internamente o sistema de
conhecimento. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
23
2.4 – Trecho do documento de especificação da linguagem PHP que define a
sintaxe de comentários para a linguagem. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
25
2.5 – Dois exemplos de documentação de referência de linguagem. À direita é
exibida uma página da documentação que se objetiva implementar neste projeto.
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
26
3.1 – Código HTML simples exibido à esquerda. À direita é exibido o resultado
da renderização do código. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
28
3.2 – Exemplo de código com marcação de Título e página renderizada à direita. 29
3.3 – Exemplo simples de código CSS estilizando uma página HTML. . . . . . . . 31
3.4 – Exemplo ilustrando uso de identificadores e classes no CSS. . . . . . . . . . . . 32
3.5 – Funcionalidade básica do JavaScript, realizar uma ação quando ocorre um
evento (ex. clique no botão) na página. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
34
3.6 – Diagrama simplificado do modelo cliente-servidor. . . . . . . . . . . . . . . . . . . 36
3.7 – Olá, mundo em PHP. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 38
3.8 – Exemplo de código de conexão com banco de dados MySQL. . . . . . . . . . . 39
4.1 – Comparativo de características entre diversas soluções de fórum online. . . 47
5.1 – Página do manual em formato para telas grandes (display 1760x1025) . . 51
5.2 – Página do manual em formato responsivo (display 375x667) . . . . . . . . . 51
5.3 – Página oficial para download da plataforma. . . . . . . . . . . . . . . . . . . . . . . 53
5.4 – Página de pré-configuração do sistema Vanilla. . . . . . . . . . . . . . . . . . . . . 54
5.5 – Tela principal do painel de administração do fórum Vanilla. . . . . . . . . . . 54
5.6 – Exemplo de uso da funcionalidade Perguntas e Respostas do plugin
adicional Q&A. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
58
13
5.7 – Interface de cadastro no fórum com opção a ser ocultada. . . . . . . . . . . . . 59
5.8 – Resultado da alteração no código. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 60
5.9 – Comportamentos padrão e desejado para a exibição de tags em nova
discussão. Permissões padrão para o usuário tipo moderador . . . . . . . . . . . . . . .
61
5.10 – Permissões padrão para o usuário tipo moderador . . . . . . . . . . . . . . . . . . 63
5.11 – Opção de remoção de resposta de uma discussão. . . . . . . . . . . . . . . . . . . 64
5.12 – Interfaces possíveis para gestão de discussão . . . . . . . . . . . . . . . . . . . . . . 65
5.13 – Tela de acesso ao menu de gerenciamento de usuário, onde é possível
editar, banir, ou excluir o conteúdo postado pelo mesmo. . . . . . . . . . . . . . . . . . .
66
14
Capítulo 1
Introdução
1.1 – Tema
O tema do presente trabalho é o desenvolvimento de um ambiente de
documentação de uma linguagem de programação para sistemas baseados em
conhecimento. Neste sentido, o problema a ser resolvido é criar um fórum de discussão
para a referida linguagem de programação, bem como realizar a documentação de toda
esta linguagem.
1.2 – Delimitação
O escopo do trabalho não envolve desenvolver um sistema baseado em
conhecimento, mas sim desenvolver e implementar o ambiente de documentação
necessário para que exista um local (ainda que virtual) onde usuários interessados
consigam obter conhecimento técnico para implementação desses sistemas. O ambiente
de documentação será restrito a um website onde haverá uma seção para
desenvolvedores. Nesta seção haverá páginas compondo um manual de referência de
comandos da linguagem assim como um sistema de fórum para troca de conhecimento
entre os desenvolvedores que usam a linguagem.
1.3 – Justificativa
Sistemas baseados em conhecimento são resultados da aplicação da Engenharia
do Conhecimento, um subconjunto da área de Inteligência Artificial que vem mostrando
cada vez mais relevância no campo da Ciência da Computação. As possibilidades de
aplicação desses sistemas são vastas e as vantagens de usar esse tipo de sistema como
15
alternativa a sistemas computacionais convencionais ou mesmo ao empenho de trabalho
humano justificam o investimento intelectual e financeiro nessa área.
Estes sistemas diferem dos sistemas computacionais convencionais no sentido
de necessitarem uma abordagem baseada em símbolos e abstrações. Dessa forma, a
documentação de uma linguagem para desenvolvimento desses sistemas se justifica para
que usuários interessados obtenham o know-how necessário para usar a linguagem a fim
de usar tais sistemas.
A existência de um manual online é extremamente importante nesse contexto já
que, por se encontrar virtualizado e disponibilizado na Internet, pode ser acessado de
qualquer lugar do planeta que tenha acesso à rede. Assim, o alcance do material é
estendido de tal forma que um manual físico não seria capaz de alcançar. Além disso,
um manual online garante uma origem centralizada da informação, de tal modo que
qualquer atualização do material será instantaneamente publicada e vista por todos.
Em adição ao manual, o fórum se mostra, também, extremamente relevante,
sendo um meio de capturar, registrar e propagar o conhecimento tácito obtido
espontaneamente a partir do uso da linguagem. É muito importante que o conhecimento
tácito de uma linguagem seja capturado. Ele surge espontaneamente através do processo
de desenvolvimento de diferentes aplicações por diferentes usuários e traz uma riqueza
de informações que na maioria das vezes não estão explícitas na documentação formal
da linguagem. É possível olhar para o caso de sucesso do website StackOverflow, uma
plataforma e comunidade global que permite que os usuários publiquem e respondam
dúvidas relacionadas a uma ampla variedade de linguagens de programação.
Atualmente, pode-se dizer com segurança que um fórum de discussão se tornou vital
para a continuidade de uma linguagem de programação.
Dessa forma, tratar com devida atenção a linguagem de programação se torna
um trabalho indispensável para que se tenha o melhor uso da tecnologia. Portanto,
construir um ambiente para documentação da linguagem se faz essencial.
1.4 – Objetivos
O objetivo do presente trabalho, é, portanto, projetar, desenvolver e implementar
o ambiente de documentação para a linguagem Witty. Espera-se que ao final do projeto
tenha-se um manual completo dos comandos da linguagem formalizado em páginas de
16
um website, assim como um sistema completo e funcional de fórum para interação entre
usuários desenvolvedores ou entusiastas da mesma.
1.5 – Metodologia
A metodologia utilizada no trabalho foi estruturar o projeto em fases distintas
com escopos bem definidos. Antes de escrever código e desenvolver aplicações, foi
necessário projetar o caminho pelo qual a solução seria construída. A primeira etapa do
trabalho foi, portanto, 1. Projeto. Nessa fase, os objetivos foram 1.1. Entender o
objetivo principal que se deseja alcançar com o trabalho; 1.2. Obter uma visão
macroscópica e completa do cenário e 1.3. Traçar o caminho que melhor leva ao
resultado desejado. Dando a necessária ênfase à fase de Projeto, passou-se à fase
seguinte, Desenvolvimento. Essa etapa pode ser entendida como a fase de construção do
produto, isto é, o desenvolvimento do código para as páginas da web que compõem o
Manual de Referência da Linguagem Witty e para o sistema de fórum online. A terceira
fase foi uma extensão natural da segunda, de forma que foi chamada Implementação.
Esta fase foi o momento da implementação da solução no ambiente final do cliente. Esta
fase começou após o desenvolvimento e a validação do produto terem sido realizados
com sucesso.
1.6 – Descrição
No capítulo 2 será introduzido o conceito de sistemas baseados em
conhecimento, fazendo uma caracterização específica de sua definição e distinguindo
seu tipo dos sistemas de computação tradicionais; a linguagem de programação Witty
será apresentada, para que se tenha um exemplo visível de uso da linguagem, associado
aos sistemas anteriormente apresentados; e será tratada a perspectiva sobre a
necessidade de documentação de linguagens de programação, apontando sua
importância vital para a sobrevivência das mesmas.
O capítulo 3 apresenta os fundamentos teóricos a partir dos quais constroem-se
as tecnologias e soluções desenvolvidas no presente trabalho. Será iniciado com os
fundamentos de uma página da Internet, com as linguagens base para qualquer
17
documento web, incrementando-se gradualmente a complexidade de conhecimento de
forma a construir um caminho lógico até a apresentação de tecnologias que compõem
aplicações web completas, como plataformas de fórum online e outros exemplos.
O capítulo 4 trata especificamente de softwares de fórum online. Nele será
primeiro comentado a respeito da ideia de aplicações web, de forma a clarear o conceito
de plataformas integradas em oposição à simples geração de páginas dinamicamente.
Depois disso, será falado sobre as soluções atuais para plataformas de fórum e serão
apresentadas características que definem este tipo de aplicação. Estas serão
consideradas de acordo com os requisitos levantados para o projeto – de forma que o
processo decisório que levou à escolha da plataforma esteve de acordo com as
necessidades apresentadas.
O capítulo 5 será o momento de explanação do ciclo de vida do trabalho,
detalhando desde a descrição do problema, passando pela fase inicial de design da
solução, do desenvolvimento da mesma, até a fase de implantação das soluções e sua
posterior conclusão.
Na conclusão serão apresentados os resultados obtidos, assim como comentários
a respeito dos processos que deram certo e obstáculos encontrados ao longo do
desenvolvimento.
18
Capítulo 2
Linguagem de programação para
sistemas baseados em conhecimento
2.1 – Introdução a sistemas baseados em conhecimento
Sistemas baseados em conhecimento são uma categoria de sistemas
computacionais que se distinguem de sistemas de computação convencionais em
diversos aspectos. Tais sistemas originaram-se da aplicação da Engenharia do
Conhecimento no campo da Computação, usando técnicas de Inteligência Artificial e
conhecimentos de domínios específicos para simular a atuação de especialistas
humanos. O objetivo da aplicação desses sistemas em determinado contexto é auxiliar o
profissional humano. Uma característica importante é que sua eficácia está intimamente
relacionada com a quantidade de conhecimento armazenada dentro dele.
É possível imaginar a aplicação de sistemas baseados em conhecimento em uma
ampla variedade de cenários, como, por exemplo, onde podem facilmente solucionar
problemas de rotina, liberando o profissional especialista para tarefas mais complexas
que exigem características inerentemente humanas (criatividade, intuição); também
podem levar conhecimento especializado a locais onde os profissionais capacitados não
estejam disponíveis, assim como podem servir como “banco de memória” para
organizações que queiram se assegurar de que todo conhecimento obtido pelos
colaboradores, tácito ou explícito, sejam devidamente registrados, garantindo-se contra
altos índices de rotatividade de membros e altos custos de retreinamento.
Diferentemente de sistemas computacionais convencionais, sistemas baseados
em conhecimento conseguem resolver problemas que necessitam de julgamento, da
mesma forma que pessoas fazem em trabalhos diários. Alguns desses possuem,
inclusive, capacidade de explicar seus resultados, oferecendo maior racionalidade e
credibilidade no output gerado.
19
Para entender como funciona um sistema baseado em conhecimento, é
necessário elucidar as diferenças básicas entre estes e os sistemas convencionais.
Provavelmente a diferença mais marcante é o fato de os primeiros simularem o
raciocínio humano, de modo que são capazes de inferir e fazer julgamentos,
frequentemente com informações incompletas, enquanto os últimos necessitam de
estruturas e dados completos, para que possam processar e computar mecanicamente as
informações de saída. Além disso, os sistemas baseados em conhecimento derivam suas
conclusões e soluções de heurísticas, baseadas em um domínio específico de
conhecimento, enquanto os programas convencionais dependem de algoritmos fixos.
Também é importante mencionar que, em vez de trabalhar com números e caracteres,
sistemas baseados em conhecimento trabalham com símbolos e conceitos, que serão
abordados mais adiante.
De forma simplificada, programas convencionais são, basicamente, constituídos
de algoritmos, onde o programador define todos os passos que os programas devem
executar, e de uma grande massa de dados, especialmente numéricos. Por sua vez,
sistemas baseados em conhecimento introduziram uma importante mudança no que diz
respeito à filosofia de programação, sendo constituídos, basicamente, de uma grande
massa de conhecimento e de processos de inferências (Teive apud Flávio). Assim, tem-
se:
• Dado + Algoritmo = Processo Computacional Convencional
• Conhecimento + Inferência = Sistema Baseado Em Conhecimento
Em um sistema baseado em conhecimento, o conhecimento do domínio do
problema fica organizado separadamente dos outros tipos de conhecimento, como por
exemplo, conhecimentos sobre os procedimentos de resolução de problemas ou
interação com o usuário. Esse conjunto de conhecimento relacionado ao domínio de
aplicação é chamado base de conhecimento, e os procedimentos gerais relativos ao
sistema, de máquina de inferência. Essa ideia pode ser representada pela seguinte figura:
20
Figura 2.1 - Estrutura de um sistema baseado em conhecimento
Aqui, fatos são os conhecimentos que sabemos a priori. Eles são conhecimentos
obtidos em domínio público, por exemplo a partir de manuais, revistas, livros,
publicações científicas, e até mesmo, resultados de experimentos ou constatação de
fatos.
As regras representam conhecimentos específicos do assunto tratado, buscando
expressar a forma de pensar do especialista humano (chamada heurística). A heurística
pode ser entendida como uma simplificação desenvolvida pelo profissional especialista
a fim de otimizar a busca pela solução de um problema.
Uma das características mais poderosas de um sistema baseado em
conhecimento é seu processo dedutivo. Este processo, com frequência, acontece através
das chamadas regras de produção, que são uma forma de representação do
conhecimento adequada às aplicações dos tipos situação-ação, premissa-conclusão,
antecedente-consequente, causa-efeito. As regras de produção representam o
conhecimento de um domínio pela estrutura “Se... então...”, envolvendo relações entre
tipos de objetos, classes e indivíduos, determinando quais propriedades de um se
aplicam a outros. Para se fazer mais claro este processo, é útil apresentar um exemplo.
Considerando o caso de um sistema que resolve problemas de acentuação de
palavras em língua portuguesa, tem-se, primeiramente, a descrição das informações
deste domínio:
1) São acentuadas as palavras cuja sílaba tônica for a antepenúltima;
2) As palavras cuja sílaba tônica for a penúltima e não terminar em ‘a’, ‘e’, ‘o’
(seguidos ou não de ‘s’), ‘m’, ‘ns’, serão acentuadas;
21
3) Se uma palavra tem a tônica na última sílaba e terminar em ‘a’, ‘e’, ‘o’
(seguidos ou não de ‘s’), ‘m’, ‘ns’, então será acentuada;
4) Se a sílaba tônica da palavra for terminada em ‘i’ ou ‘u’, seguido ou não de
‘s’, e forma hiato com a vogal anterior, então será acentuada.
Traduzindo este conhecimento para a representação da forma “Se... então...”,
tem-se as seguintes expressões (sendo 1-4 regras, 5 e 6 fatos):
1) Se sílaba_tônica(*palavra,antepenúltima) então acentuada(*palavra);
2) Se sílaba_tônica(*palavra, penúltima) e não final(*palavra) então
acentuada(*palavra);
3) Se sílaba_tônica(*palavra, última) e final(*palavra) então
acentuada(*palavra);
4) Se sílaba_tônica(*palavra, vogal-fraca) e hiato(vogal_fraca) então
acentuada(*palavra);
5) final (a | e | o | m | as | es | os | ns);
6) vogal_fraca (i | u | is | us).
Com estas entradas definidas em uma base de conhecimento, a máquina de
inferência do sistema tem a tarefa de selecionar e então aplicar a regra mais apropriada
em cada passo de execução. Isto contrasta diretamente com sistemas de computação
convencionais, sendo uma das principais qualidades de um sistema baseado em
conhecimento. Nos programas convencionais, os algoritmos têm uma ordem de
execução predefinida e fixada por algoritmos.
Vale ainda destacar que existem duas formas possíveis de inferência para
sistemas baseados em conhecimento, quais sejam, o “caminhamento para a frente”,
através do qual o sistema parte de peças elementares de informação e chega a uma
conclusão a respeito do todo, e o “caminhamento retrospectivo”, o qual parte do
conjunto e pesquisa a rede de premissas de todos os fatos envolvidos para tirar
conclusões a respeito das partes individuais de informação.
2.2 – Linguagem de programação Witty
A linguagem de programação Witty é a linguagem utilizada para desenvolver
programas na ferramenta Mentor. Antes de apresentar a linguagem, porém, convém
introduzir a ferramenta em questão para que se tenha uma percepção mais abrangente
22
do processo envolvido no desenvolvimento de programas para sistemas baseados em
conhecimento.
A ferramenta Mentor é um ambiente de desenvolvimento de sistemas baseados
em conhecimento. Ela permite a confecção de aplicações de amplo espectro, em
especial sistemas voltados ao aprendizado, organização de informações e aquisição de
conhecimento [1].
Para ser possível trabalhar com tais artefatos, a ferramenta dispõe de um sistema
de máquina de inferência que permite realizar deduções sobre bases de conhecimento,
de acordo com a concepção dos sistemas apresentados na seção anterior.
O ambiente de desenvolvimento que a ferramenta proporciona possui interface
gráfica (GUI), ilustrada na Figura 2.2, e é através desta que a programação e o setup dos
sistemas baseados em conhecimento acontece.
Figura 2.2 - GUI (Graphical User Interface) da ferramenta Witty
Para programar um sistema baseado em conhecimento na ferramenta Mentor é
necessário utilizar a linguagem devidamente nomeada Witty. A linguagem é dita “não-
tipada”, pois suas variáveis não têm tipo conhecido.
Os programas na linguagem Witty podem possuir um amplo espectro de
complexidade, variando desde programas de uma única linha a estruturas elaboradas
que envolvem chamadas externas, comunicação TCP/IP ou outros recursos avançados.
23
Eles são enquadrados, em geral, em três categorias: Primitivos, Sequenciais e de
Alternativas.
Um exemplo de programa simples que faz uso da linguagem é o comando de
uma linha “msg(“Olá, mundo”, 400, 270)”. Este programa tem por base o comando
“msg(<mensagem>,<pos-x>,<pos-y>)” que é responsável por gerar uma caixa de
mensagem pop-up, de dimensões definidas pelos dois últimos argumentos da função,
com o conteúdo definido pela passagem de uma cadeia de caracteres no primeiro
argumento. A interface para a codificação desse programa é vista também na Figura 2.2,
onde se tem o campo “linha de comando”. Para executar o programa, basta apertar a
tecla “Enter” ou clicar o triângulo verde à esquerda da linha.
O tipo de programa apresentado caracteriza-se por realizar uma função que
processa informações externamente ao ambiente Witty. Contudo, funções de uso muito
frequente existem para realizar modificações internas no Witty, como por exemplo a
função “assert(<base>,<fato>|<regra>)”.
Para se ter uma ideia clara do funcionamento da linguagem em conjunto com o
ambiente global Mentor, considere o programa de uma linha “assert(chaos,
é_mineiro(Pelé))”. Este programa irá acrescentar o fato ou regra, passado no segundo
argumento da função, à base de conhecimento especificada no primeiro parâmetro. No
caso ilustrado, o programa adiciona o fato “é_mineiro(Pelé)” à base de conhecimento
“chaos” pré-existente no sistema.
Figura 2.3 – Exemplo de uso de função que modifica internamente o sistema de
conhecimento.
24
A Figura 2.3 exibe o programa conforme codificado no campo “linha de
comando”, e a subsequente verificação de que este foi executado corretamente,
conforme visto na janela do sistema que detalha as informações das bases de
conhecimento existentes.
Conforme se pode imaginar, existe uma variedade de comandos, também
denominados primitivas, pré-existentes na linguagem Witty, que executam funções de
grande utilidade para se lidar com os sistemas baseados em conhecimento. Para o
usuário iniciante, torna-se fácil confundir-se e até mesmo desconhecer diversas funções
imprescindíveis para o desenvolvimento de aplicações mais extensas, fato de ocorrência
comum.
Para que se evite tal dificuldade e aumente-se ainda mais o potencial de
aplicação da linguagem, a documentação online da linguagem Witty mostra-se de suma
importância, oferecendo-se como caso principal de motivação para o presente trabalho.
A contextualização para o desenvolvimento de documentação é feita na próxima seção.
2.3 – Documentação de linguagens de programação
Partindo-se do princípio de que qualquer produto, material ou imaterial,
desenvolvido com o intuito de ser disponibilizado publicamente, deve vir acompanhado
de um manual de utilização, é de se esperar que uma linguagem de programação
também necessite ser atrelada a uma forma de documentação. A ideia por trás desse
princípio é que qualquer novo usuário de tal produto necessita se familiarizar e entender
“como” e “para que” este foi concebido, assim como aprender a utilizar o mesmo de
maneira adequada ou pretendida por seu criador. Assim, é possível enxergar a
documentação de uma linguagem de programação como parte integrante do produto
maior composto pela mesma.
Uma documentação de linguagem para computadores pode assumir diversas
formas, sendo três delas apontadas a seguir. A primeira é a “especificação”. Serão
abordadas também a documentação chamada “referência de linguagem de
programação” e a documentação indireta através de fórum de discussão.
O primeiro artefato que se pode interpretar como documentação válida de uma
linguagem de programação é sua especificação. A especificação de uma linguagem é
25
composta de registros, descritos em linguagem natural ou seguindo padrões específicos
de semântica, que permitem que seus utilizadores e implementadores cheguem a um
acordo explícito sobre se determinado trecho de código é válido em tal linguagem e
sobre qual seu comportamento deve ser uma vez que este apresenta sintaxe correta. Um
exemplo de tópico abordado numa especificação de linguagem é a descrição da sintaxe
para comentários. A Figura 2.4 mostra o trecho do documento de especificação da
linguagem PHP que descreve o exemplo citado.
Figura 2.4 - Trecho do documento de especificação da linguagem PHP que define a
sintaxe de comentários para a linguagem. [2]
26
É interessante notar que a linguagem PHP foi utilizada por mais de uma década
sem possuir um documento de especificação, e que, desde 2014, há um esforço de
desenvolvimento deste artefato. [3].
Como se pode perceber, a especificação de uma linguagem não é
necessariamente vital para a existência e sobrevivência da mesma, ao contrário do que
será visto com a documentação de referência, exposta a seguir.
A referência de uma linguagem de programação se distingue da especificação da
linguagem no sentido de servir mais propriamente ao uso e implementação direta desta,
em vez de formalizar questões sintáticas. A referência da linguagem pode ser
comparada a um manual de instruções de um produto físico, seguindo a ideia de “use ou
faça x para realizar y”. Esta distinção entre os objetivos de cada artefato é ponto
favorável à argumentação de que a referência possa ser considerada mais importante à
sobrevivência e ao uso disseminado da linguagem que sua especificação.
A forma com que uma referência de linguagem se apresenta é variada, porém
sempre se objetiva explicar o uso de determinado recurso que a linguagem oferece. Para
exemplificar, a Figura 2.5 mostra dois exemplos de referência de linguagem – sendo
que o segundo é um exemplo do trabalho que se propõe ser desenvolvido neste projeto.
Figura 2.5 - Dois exemplos de documentação de referência de linguagem. À direita é
exibida uma página da documentação que se objetiva implementar neste projeto.
É imediato perceber que a função da documentação de referência é auxiliar o
usuário que implementa um programa nesta linguagem a executar determinado
comando. Vê-se que, em geral, é apresentado o título do comando ou função que se está
explicando, com sua sintaxe, incluindo os parâmetros que devem ser passados no
27
código, e descrição do que o comando ou função realiza ou como este opera.
Geralmente, também, há um ou mais exemplos associados, ilustrando casos de uso.
Fica fácil perceber a importância deste tipo de documentação para um usuário
que queira aprender nova linguagem. Para o caso da Witty, torna-se vital possuir tal
documentação online para que se possibilite o uso disseminado da mesma.
O terceiro tipo de documentação que será abordado é uma forma indireta de se
documentar uma linguagem. Por se considerar que quaisquer informações, desde que
auxiliem usuários a desenvolver programas em determinada linguagem, podem ser
chamadas, em conjunto, de “documentação”, o fórum online de discussão será
percebido como mais um artefato possível e necessário de se haver.
A justificativa para tal passa pelo entendimento de que o fórum é um meio onde
é possível capturar, registrar e propagar o conhecimento tácito obtido espontaneamente
a partir do uso de determinada linguagem de programação. É muito importante que o
conhecimento tácito de uma linguagem seja capturado. Ele surge a partir do processo de
desenvolvimento de diferentes aplicações por diferentes usuários e traz uma riqueza de
informações que na maioria das vezes não estão explícitas na documentação formal da
linguagem.
Fóruns de discussão geralmente não possuem regras explícitas a respeito dos
modos de se escrever perguntas e respostas. Sendo assim, seus registros possuem
características informais e individuais de escrita. O conhecimento documental pode ser
extraído a partir da leitura da descrição do caso específico de determinado usuário, esta
feita de acordo com o estilo próprio do indivíduo. Por essa razão, é esperado que
algumas vezes determinado tópico não seja de grande valia para o usuário que busca
informação, sendo necessário navegar através dos demais tópicos até que se encontre
um registro adequado às suas especificidades.
De modo geral, quando se considera os sistemas de fórum, percebe-se o grande
valor que estes possuem. Por isso, será tratada como indispensável a existência desta no
atual trabalho.
28
Capítulo 3
Tecnologias Web
3.1 – HTML
Para introduzir o tópico a respeito de tecnologias web, é praxe falar inicialmente
da linguagem mais básica desse ambiente, HTML. HTML significa HyperText Markup
Language, que, traduzindo para o português, significa “Linguagem de Marcação de
Hipertexto”. Toda e qualquer página da web renderizada para um usuário em um
ambiente de navegador conterá um trecho escrito em HTML. Essa linguagem difere de
uma linguagem de programação típica no sentido de ser uma linguagem de marcação.
Assim, ao escrever o código o desenvolvedor utiliza tags de marcação para informar ao
browser de que forma ele deve renderizar o conteúdo antes de exibí-lo ao usuário final,
isto é, as tags servem para distinguir sintaticamente cada pedaço de código de modo que
o navegador entenda como exibir a informação para o usuário. Um exemplo simples de
uso típico da linguagem HTML numa página da web é ilustrado na Figura 3.1.
Figura 3.1 - Código HTML simples exibido à esquerda. À direita é exibido o resultado
da renderização do código.
29
Como é possível ver na figura, a tag “<p>” engloba o conteúdo “Exemplo de
página da web simples.”. Repare que no final é necessário fechar a tag com o caractere
‘/’, ficando o fechamento do código “</p>”.
A letra ‘p’ especifica que o trecho entre as tags deve ser interpretada como um
parágrafo. Como foi dito, a linguagem HTML fornece um modelo de marcação de
conteúdo que tem significado sintático relevante para o navegador. Veja na Figura 3.2
um exemplo típico de marcação para um conteúdo que necessita destaque numa página.
Figura 3.2 - Exemplo de código com marcação de Título e página renderizada à
direita.
Neste exemplo, a tag <h1> e seu correspondente fechamento </h1> delimitam
um conteúdo de título de primeira importância. A letra ‘h’ vem do inglês heading.
Existem seis níveis de destaque para títulos, sendo eles o intervalo de <h1> a <h6>.
Em relação à estrutura do código HTML, é importante mencionar que o
navegador só irá processar o que estiver delimitado entre tags válidas. Para pular linhas
na página da web, por exemplo, não basta pular linhas no código. É necessário inserir a
tag especial “<br>”, significando line break, ou “quebra de linha”. Esta tag é diferente
no sentido de que não existe um fechamento para ela. Seu uso, portanto, basta-se do
código “<br>”. O navegador interpreta esse trecho como um pulo para nova linha.
30
Estes são apenas exemplos típicos de uso da linguagem de marcação de
hipertexto numa página da web. A especificação completa da linguagem pode ser
encontrada facilmente com uma pesquisa na Internet, porém uma excelente referência é
o site W3Schools. [4]
HTML é uma linguagem client-side, significando que é processada no
computador do usuário, pelo programa navegador da Internet que ele possuir. Ela só
trata o aspecto estrutural e de conteúdo da página, sendo absolutamente estático e
carente de formatações estéticas. Para complementar o ambiente de construção da web
no que tange à aparência, existe a especificação da linguagem CSS, como será visto a
seguir.
3.2 – CSS
O nome CSS é uma abreviação para o termo Cascading Style Sheets, ou “Folhas
de Estilo em Cascata”. Este nome é adequado porque a função do padrão dessa
linguagem é justamente aplicar estilos gráficos ao código HTML, visto anteriormente.
O termo “em cascata” indica que o arquivo é processado em cascata, ou seja, do topo ao
fundo, de forma que redefinições de estilos já definidos, quando feitas no fim da folha
de estilo, sobrescrevem as primeiras definições.
Uma página da web pode existir sem código CSS, porém não sem código
HTML. Exemplos de páginas com HTML puro foram vistos na seção anterior. Nesta,
será tratada a forma como o CSS auxilia na construção de páginas esteticamente mais
atraentes.
Diferentemente do HTML, o CSS não é uma linguagem de marcação. Assim, a
sintaxe dela é composta de seletores que terão atributos e seus respectivos valores. Um
exemplo inicial é apresentado na Figura 3.3.
31
Figura 3.3 - Exemplo simples de código CSS estilizando uma página HTML.
O exemplo da Figura 3.3 ilustra com clareza como o CSS atua no código
HTML. Como se pode observar no código do quadro à esquerda, o conteúdo da página
definido pelo HTML é composto de um título, definido pela tag <h1>, e um parágrafo,
definido pela tag <p>. O código CSS introduzido está definido dentro das tag <style>.
O primeiro seletor encontrado é o “h1”. Ele seleciona todos o conteúdo HTML definido
com tags <h1>. No exemplo, ele irá selecionar o conteúdo correspondente a “Um título
para a página”. Após o seletor “h1”, devemos abrir um conjunto de chaves “{ }” que
delimitarão a região para definirmos os atributos que queremos modificar, em conjunto
com seus valores. Neste exemplo estamos definindo que o atributo “cor” (representado
pela palavra-chave em inglês “color”) do conteúdo dos elementos “h1” deverá ter o
valor “vermelho” (definido pelo valor “red” ou equivalente em código RGB
hexadecimal). Seguindo o mesmo raciocínio, o segundo seletor CSS seleciona o
conteúdo definido pelas tags <p> do HTML e modifica seus atributos “cor de fundo”
(background-color) e “cor” (color) para as cores “azul” e “branco”, respectivamente.
Da forma como estão definidos, os seletores irão selecionar todo o conteúdo
definido por todos os elementos <h1> e <p> da página. Como com frequência se deseja
variar o estilo dos elementos exibidos na página para melhorar sua apresentação
estética, há no CSS formas de especificar com maior precisão os seletores que
selecionam quais elementos devem ser estilizados no código HTML.
32
O exemplo da Figura 3.4 é rico e mostra uma forma comum de usar CSS em
páginas típicas vistas na Internet. Nele é introduzido o conceito de identificadores e
classes. Atenção para o fato de estes serem atributos de tags HTML. Apesar disso, é
preferível introduzir estes aqui pois fazem sentido quando usados no código HTML em
conjunto com linguagens complementares, como CSS e JavaScript (como será visto
mais à frente).
Figura 3.4 - Exemplo ilustrando uso de identificadores e classes no CSS.
Basicamente, um identificador no elemento HTML define um valor especial
para outras linguagens encontrarem o elemento especificado. O atributo identificador é
o “id” e, no exemplo da Figura 3.4, no caso da tag <h1>, tem o valor igual a “primeiro-
titulo”. Já a tag <p> imediatamente abaixo tem seu identificador definido como
“primeiro-paragrafo”. Os identificadores são únicos e recomendados para distinguir
elementos que devem ser tratados individualmente e aparecem uma única vez na página.
Numa página típica, o elemento que define o menu de navegação da página poderia ter
seu atributo “id” definido com o valor “menu”, pois é comum só haver um destes numa
página.
Olhando para o lado do CSS, é possível definir o seletor com base no
identificador do elemento HTML. Ele irá selecionar apenas o conteúdo do elemento
HTML que possui o atributo “id” igual ao descrito. No CSS, o seletor de identificador
deve ser precedido de ‘#’. No exemplo que estamos tratando, vemos que o CSS definido
33
pelo seletor “#primeiro-titulo” só é aplicado ao conteúdo definido pelo código HTML
que tem o atributo “id” com valor “primeiro-titulo”. O efeito aplicado é cor de texto
vermelho (#F00 em RGB hexadecimal). De forma similar, o seletor “#primeiro-
paragrafo” é aplicado apenas ao conteúdo da tag <p> que possui o atributo “id” igual a
“primeiro-paragrafo”.
Quanto às classes, estas são muito poderosas pois permitem reutilização de
códigos gerados. O atributo HTML que define uma classe é o “class”. É possível definir
diversas classes separando-as por um espaço em branco no campo de valor. Se olharmos
no exemplo acima, o terceiro elemento <h1> do código HTML possui duas classes, a
saber, “titulo-generico” e “texto-destacado”. Imediatamente é possível perceber a
utilidade das classes ao olharmos para o CSS e ver que aproveitamos duas definições
diferentes a serem aplicadas no mesmo elemento. O seletor de classe deve ser precedido
por um ponto ‘.’ seguido do valor da classe. Podemos então perceber que estamos
aplicando dois estilos, text-align e text-shadow, definidos respectivamente pelos
seletores “.titulo-generico” e “.texto-destacado”, ao elemento que possui ambas as
classes, ou seja, ao terceiro elemento <h1>, que tem atributo “class” igual a “titulo-
generico texto-destacado”.
Existem muitos atributos definidos na especificação do CSS, e assim como no
caso do HTML, o site W3Schools [4].
3.3 – JavaScript
Complementando a tríade das linguagens de desenvolvimento para a web do
lado do cliente, isto é, linguagens que são processadas no computador do usuário que
visualiza a página da web, está o JavaScript. Trata-se de uma linguagem de
programação típica interpretada e não deve ser confundida com a linguagem Java,
também muito popular. Sua função no desenvolvimento web é garantir a interatividade
dos elementos exibidos, para trazer ainda mais riqueza ao conteúdo apresentado. Todos
os navegadores atuais possuem suporte nativo às especificações da linguagem e,
portanto, esta pode também ser considerada um dos padrões da web.
O JavaScript é uma linguagem multi-paradigma, possuindo suporte aos estilos
de programação orientada a objetos, imperativa e funcional. É capaz de monitorar
eventos que acontecem durante uma sessão de navegação num browser, tais como
34
cliques do mouse, rolagem da página, carregamento de recursos externos (arquivos
externos necessários à funcionalidade da página), assim como também é capaz de
manipular qualquer elemento HTML da página. O exemplo da Figura 3.5 ilustra um uso
clássico.
Figura 3.5 - Funcionalidade básica do JavaScript, realizar uma ação quando ocorre
um evento (ex. clique no botão) na página.
Repare que na Figura 3.5 o código JavaScript inserido foi inline, o que significa
dizer que foi inserido dentro da tag HTML na forma do atributo “onclick”. Há outras
formas de acoplar o script de código JavaScript a uma página HTML, conforme será
visto mais à frente.
O primeiro trecho que se deve observar, portanto, é o próprio atributo “onclick”.
Este atributo indica que se deseja monitorar o evento “clique do mouse” quando este
acontecer no elemento em questão. Em seguida, deve-se indicar que o interesse é
manipular um elemento da página. Para isso, a primeira informação a ser passada é a
palavra especial “document” – ela significa que o navegador deve se preparar para
manipular algum elemento do documento atual, ou seja, do documento HTML em que
estamos atuando. A segunda função é “getElementById( )”, que, como o próprio nome
indica, é usada para pegar um elemento por meio do seu atributo HTML “id”. O valor
desse atributo é passado como argumento para essa função. É interessante notar que se
35
está inserindo código no elemento “button” da página, porém também se está atuando
sobre o elemento “p” de id “vazio”, que inicialmente não possui conteúdo algum. Esse
fato por si só fornece uma flexibilidade de manipulação do ambiente do documento da
web. O terceiro ponto que deve ser observado é o método “innerHTML( )”, que tem
como funcionalidade alterar o conteúdo HTML interno (ou seja, ele não atua nas tags,
mas sim no que se encontra delimitado entre estas). Por fim, o lado direito do código
informa que o navegador deve executar a função pré-definida “Date( )” no momento em
que o evento ocorrer. O que se dá em seguida é que o JavaScript pega o elemento <p>
que corresponde ao id “vazio”, executa a função “Date( )” para coletar as informações
de data e hora atuais, e em seguida aplica o retorno dessa função no conteúdo interno do
elemento selecionado.
É possível imaginar a magnitude do potencial que a linguagem JavaScript
oferece para documentos web só de analisar este pequeno exemplo. De fato, JavaScript
tornou-se um padrão e é suportado atualmente em todos os browsers modernos (e na
maioria dos antigos também).
Observando com cautela o exemplo da Figura 3.5 e olhando para o que já foi
discutido nas seções anteriores de HTML e CSS, é razoável questionar sobre a
legibilidade do código ao se inserir muitas informações de competências distintas na
mesma tag ou elemento da página. Para resolver essa questão, existem tags especiais
HTML que definem regiões específicas para código CSS e JavaScript. Elas são
<style></style> e <script></script>, respectivamente. A primeira deve ser incluída na
seção <head></head> do documento, enquanto a segunda deve ser incluída
preferencialmente imediatamente antes da tag de fechamento </body>. Além disso, é
considerada uma boa prática separar estes códigos em arquivos externos (tipicamente
nas extensões “.css” e “.js”), e carregar os recursos conforme a própria página HTML é
carregada. Para isso, usa-se a tag <link rel=“stylesheet” type=“text/css”
href=“caminho_para_arquivo.css”> dentro da seção <head></head>, e a tag <script
type=“text/javascript” src=“caminho_para_arquivo.js”></script> logo acima do
fechamento </body> ($ inserir referência URL NCE).
Assim como nos casos de HTML e CSS, o website W3Schools [4] é uma das
maiores referências e pode ser consultado para tutoriais e referência ao código. O editor
interativo TryIt permite testar e prototipar rapidamente trechos de código para verificar
seu funcionamento. O editor é o mesmo usado para gerar as figuras que ilustram este
trabalho.
36
Com esta apresentação breve do JavaScript e as seções anteriores, já é possível
ter uma boa base e referência dos padrões front-end do cenário atual de
desenvolvimento para web. O termo front-end é abrangente e gera diferentes
interpretações na literatura. Há referências ao termo usadas para significar somente o
tratamento estético da página, abarcando somente aquilo que o usuário vê de fato. Por
outro lado, também existe uma visão que define front-end como toda a parte que é
processada no lado cliente de uma típica transação web, não necessariamente
envolvendo apenas o visível da página, mas também todo o cálculo interno que o
JavaScript costumeiramente realiza, já que este consegue definir variáveis, processar
funções e exercer manipulações que não necessariamente são exibidas para o usuário.
Para efeitos de entendimento e clarificação das próximas seções, pode-se adotar o
segundo significado para melhor contrastar com a linguagem server-side.
3.4 – PHP
Diferentemente das tecnologias anteriores, PHP é uma linguagem que roda no
lado do servidor de um ambiente conectado à Internet. Para entender melhor a ideia, a
figura 3.6 mostra como funciona a comunicação entre nossos computadores e servidores
espalhados pelo mundo quando estamos navegando em nossos dispositivos através de
do programa navegador.
Figura 3.6 - Diagrama simplificado do modelo cliente-servidor.
Basicamente, o que acontece numa transação web com modelo cliente-servidor é
o lado cliente solicitar recursos (estes podem ser arquivos HTML, arquivos CSS e JS
externos ou quaisquer outras dependências necessárias à navegação adequada) e o
computador servidor, o qual vai servir os arquivos, processar a solicitação, verificando
se os protocolos necessários estão sendo atendidos. O servidor irá também processar
37
quaisquer códigos adicionais necessários ao atendimento da requisição e, por fim, servir
os arquivos, enviando-os de volta ao computador cliente que iniciou o pedido.
Sendo assim, afirmar que PHP é uma linguagem server-side significa dizer que
todo o código escrito definido para rodar numa página deve primeiro ser processado na
máquina que irá servir o documento da web ao computador do usuário. A linguagem,
assim como o JavaScript, é interpretada, o que significa que não é necessário compilar o
código fonte em arquivo executável, bastando possuir o interpretador instalado na
máquina.
Ser uma linguagem do lado do servidor contribui para aumentar o potencial de
funcionalidades oferecido pela linguagem. Atualmente é possível encontrar uma
variedade de aplicações e soluções completas desenvolvidas em PHP, que atendem uma
demanda sempre crescente no setor web.
Entre estas aplicações, destacam-se: WordPress – plataforma de gerenciamento
de conteúdo (CMS) – que permite a gestão completa de websites em formato de blog ou
páginas estáticas e que, segundo dados da W3Techs [5], é usado em surpreendentes
28.1% de todos os sites da Internet; Magento – plataforma open source de e-commerce
– que permite o desenvolvimento de lojas virtuais para comércio de produtos e serviços;
Vanilla Forums – plataforma open source de fórum online – que permite criação e
gestão de sistemas de fórum de discussão, a ser apresentado em detalhes adiante no
presente trabalho; e até mesmo a famosa rede social Facebook tem sua base em PHP,
adaptando o código desde então para acompanhar o crescimento do site e garantir
escalabilidade. [6]
Pelos exemplos mostrados é possível perceber que o PHP permite um nível mais
elevado de desenvolvimento, o que não é atendido pelo JavaScript em seu escopo front-
end delimitado. A capacidade de atuar em harmonia com bancos de dados é, se não, o
maior trunfo das linguagens server-side.
Para efeitos de demonstração da linguagem, os exemplos a seguir limitam-se a
exibir apenas usos básicos.
38
Figura 3.7 - Olá, mundo em PHP.
A Figura 3.7 mostra uma página simples exibindo código PHP. Repare que esta
é uma página HTML, com todas as suas tags válidas, que também exibe código PHP. O
que acontece neste exemplo, é que esta página é enviada ao servidor – uma máquina
remota que hospeda o domínio www.w3schools.com e possui ambiente PHP instalado –
este servidor recebe a requisição e processa o script PHP inserido na página. O script é
demarcado pelas chaves inicial “<?php” e final “?>”, então o interpretador sabe qual
código deve ser executado. Em seguida, com a resposta da requisição, o servidor envia
de volta o recurso e este é finalmente renderizado pelo navegador do computador
cliente, assim tendo o resultado final exibido do lado direito.
A análise desse simples código PHP é rápida, pois é somente uma chamada da
função pré-definida “echo”, que deve ser seguida de uma especificação de cadeia de
caracteres (string) a ser “ecoada”, ou mais naturalmente, “exibida”, na tela do usuário.
Por fim, todo comando PHP deve ser finalizado com “;”.
Outro exemplo, mostrado na Figura 3.8, exemplifica uma conexão genérica a
um banco de dados e a execução de uma inserção de informações através de query em
linguagem SQL.
39
Figura 3.8 - Exemplo de código de conexão com banco de dados MySQL.
A análise do código se dá comando por comando, conforme explanado a seguir.
A primeira instrução do PHP é a função “mysqli_connect”, que recebe em seus
argumentos, respectivamente, o endereço de host do banco de dados, o nome do usuário
do banco de dados, a senha do usuário correspondente e o nome do próprio banco.
Em seguida, é necessário tratar a eventualidade de a conexão não ser realizada
com sucesso. O comando “die()” termina a aplicação, com argumento opcional em
formato string para ser retornado para o usuário.
Havendo sucesso na conexão, é necessário criar uma variável para armazenar o
código da consulta, em linguagem SQL, a ser processado posteriormente. Para isso,
devemos passar o comando desejado da query, nesse caso, “INSERT INTO” trata de
uma inserção de dados em dada tabela. Os valores que seguem são correspondentes ao
exemplo ilustrativo, numa tabela fictícia ‘user_data’ com campos ‘name’, ‘email’ e
‘date’. Os valores que se deseja inserir na tabela são oriundos de uma submissão de
formulário web, no formato POST (não abordado aqui). Para todos os efeitos, é possível
assumir que informações inseridas por um usuário em um formulário padrão de página
web foram trazidos até o código em questão, e que estão armazenados na variável
“$_POST[]”. O importante é perceber que, através de um tratamento de segurança, por
meio da função ‘mysqli_real_escape_string($link, “variavel”)’, os campos de valores
serão inseridos correta e seguramente na variável “$query”, que será usada para realizar,
40
de fato, a consulta de inserção no banco de dados, na linha seguinte, especificamente o
trecho “$result = mysqli_query($link, $query)”. O que se segue no código é um simples
tratamento de “SE...SE NÃO...” para retornar códigos correspondentes ao sucesso ou
insucesso da operação.
Com os exemplos apresentados, é possível vislumbrar uma diversidade de
aplicações possíveis através do uso de PHP, complementado pelo que foi apresentado
de HTML, CSS e JavaScript. Com razão, estas linguagens (ou linguagens alternativas
equivalentes) compõem a fundação de qualquer aplicação ou sistema web, sendo
possível construir uma variedade de sistemas.
3.5 – Páginas estáticas versus páginas dinâmicas
Quando se estuda páginas da Internet, existe uma distinção que pode ser feita
quanto à natureza de seu conteúdo. Ela leva em consideração a forma de geração da
informação apresentada ao usuário e divide-se em páginas estáticas e páginas
dinâmicas.
O tipo estático é caracterizado por conter toda a informação diretamente no
código daquela página, isto é, todo o conteúdo de títulos, corpos de texto, listas e menus
está fixado no código fonte daquela página. Pode-se criar uma página estática a partir de
um código HTML simples.
Já o tipo dinâmico é definido pela geração dinâmica de conteúdo, fazendo uso de
templates e extraindo informações de alguma fonte externa ao código. Os templates têm
a função de fornecer a estrutura básica da página, podendo ser um código HTML básico
contendo apenas tags sem conteúdo, com variáveis especiais em seu lugar e cuja sintaxe
varia de acordo com a linguagem utilizada. Um código de página template pode também
ser composto apenas de includes, isto é, chamadas de inclusão de outros códigos, que,
de toda maneira, devem ser inevitavelmente especificados em HTML.
A obtenção de dados extrínsecos de uma página dinâmica pode ser feita de uma
variedade de maneiras. Uma das mais comuns e frequentemente usadas é a obtenção de
dados por via de um banco de dados. Conforme tratado no fim da seção anterior, com a
linguagem PHP (uma linguagem do lado do servidor) é possível fazer queries
(consultas) a bancos de dados utilizando-se da linguagem de consulta SQL. Dessa
41
forma, é simples exibir informações específicas a determinado usuário a cada vez que o
mesmo acessa a página dinâmica.
Um exemplo de fácil entendimento é uma página de login onde o usuário, desde
que tenha se cadastrado anteriormente, entra com suas credenciais (tipicamente e-mail e
senha) e o sistema web autentica os dados, levando-o a uma nova página onde suas
informações específicas são exibidas – nome de usuário, e-mail cadastrado, última vez
que o usuário logou, ou quaisquer outras informações específicas relevantes.
Claramente, imagina-se que a página de usuário autenticado possui apenas um código
gerador. Seria impraticável projetar um novo código fonte para cada usuário que fizesse
cadastro em um sistema. Além disso, verifica-se que determinadas informações
apresentadas são obtidas por meio de variáveis que, de alguma forma, buscam os
valores corretos para cada situação. Neste cenário, a fonte de informação é um banco de
dados. Além desta, existem algumas outras maneiras de se obter dados de forma que
cada usuário veja uma página da web com conteúdo diferente, mesmo que acessem o
mesmo endereço. Uma delas é o sistema do cliente. Outra fonte é composta pelas
próprias entradas do usuário da aplicação.
Para exemplificar a primeira, considere o simples modelo de requisição web
apresentado na seção anterior, conforme figura 3.6. A cada clique ou interação que o
usuário realiza, o computador do cliente envia um pedido de recurso para o computador
servidor. Nesse transporte de informações, são enviados mais dados do que o simples
pedido que o usuário fez. Considere, por exemplo, que enviar o endereço IP (Internet
Protocol) – responsável por identificar cada dispositivo conectado na Internet, é
indispensável para que o servidor saiba para qual computador retornar sua resposta.
Assim como o IP, a requisição envia algumas outras informações para o servidor, as
quais dependerão do protocolo usado, e o servidor, por sua vez, traz outras informações
adicionais com a resposta do pedido. Dessa forma, este “cabeçalho” que acompanha
cada comunicação por Internet pode ser uma fonte de informação a ser apresentada
dinamicamente para o usuário. O exemplo mais claro que se pode mencionar são sites
que retornam o IP do usuário. Estas páginas não consultam um banco de dados
contendo todos os IPs de todas as máquinas, mas sim consultam as informações que o
computador cliente envia automaticamente ao servidor quando acessam suas páginas.
Outra fonte possível para obtenção de informação para se gerar páginas
dinâmicas, além das já citadas bancos de dados e requisições de sistemas clientes, são
entradas fornecidas pelos próprios usuários. Considere uma aplicação web (será
42
definido o conceito em seção futura) simples que exerce a função de calculadora. Para
retornar o resultado ao usuário, este precisa primeiro fornecer os dados para cálculo.
Com linguagens que podem ser tanto do lado cliente (i.e. JavaScript) ou lado servidor
(i.e. PHP), a página consegue fornecer campos de entrada que terão seus valores
armazenados em variáveis, que por sua vez serão manipulados em funções e métodos
para se obter um resultado, para então retorná-lo ao usuário. Repare que, neste caso, a
página não consulta nem bancos de dados nem quaisquer informações de sistema
passadas por vias de comunicação da Internet. Dessa maneira, a cada usuário será
apresentado um conteúdo de página distinto, mesmo que se acessem o mesmo endereço
web.
3.6 – Registro, hospedagem e manutenção de páginas web
Mudando o foco de funcionalidades e características de páginas da Internet para
sua arquitetura organizacional, esta seção aborda os conceitos de registro, hospedagem e
manutenção de páginas web, conhecimentos fundamentais para gerenciamento de
qualquer website.
Quando se deseja possuir um endereço na Internet, como por exemplo
“www.meunome.com.br”, é necessário realizar três processos distintos. O primeiro é o
Registro. O segundo é a Hospedagem. Por fim é necessário realizar a Manutenção. Será
explicada cada uma dessas etapas a seguir.
Para começar, a primeira coisa que o interessado necessita fazer é registrar o
endereço, ou, em linguagem precisa, o domínio que se deseja. Registrar o domínio
envolve verificar sua disponibilidade (pois é possível que o domínio que se deseja já foi
comprado por outra pessoa e por isso está reservado) e, caso esteja disponível, comprar
o domínio. O processo é simples e direto. As empresas registradoras, registrars,
oferecem o serviço que verifica a disponibilidade do domínio desejado e o processo de
compra é realizado como uma compra virtual normal. No caso brasileiro, isto é feito
pela Registro.br.
De posse do domínio, a segunda etapa é conseguir um serviço de hospedagem.
Hospedar um domínio significa ter um servidor, geralmente de uma empresa terceira,
que irá hospedar os arquivos do site. O processo de compra do serviço de hospedagem
também é bastante simples, porém com um detalhe importante no final. O primeiro
43
passo é escolher a empresa de hospedagem, seu host. Os planos oferecidos variam em
aspectos técnicos do servidor – podendo ser, por exemplo, máquinas Linux ou
Windows, servidores Apache ou Nginx, máquinas com processador e memória
dedicados ou compartilhados, quantidade de RAM e armazenamento em disco
disponíveis, tipo de armazenamento (HDD ou SSD), tipos de bancos de dados
oferecidos, dentre outras características.
Tendo feito a escolha do plano, o usuário realiza a compra do serviço e isto lhe
garante o direito de uso do servidor (ou parte deste) contratado. Depois de comprado o
serviço, é necessário, então, vincular seu domínio comprado no registrador com o
servidor comprado no host. Isto é feito através do apontamento do DNS (Domain Name
System), que é, em linhas gerais, um sistema que irá traduzir seu endereço da web, por
exemplo, “www.meunome.com.br”, para o endereço de IP correspondente ao servidor
contratado no serviço de hospedagem, por exemplo, 93.188.160.xxx. Este sistema é uma
forma de permitir que se use nomes, que são de mais fácil lembrança, em vez de uma
sequência de números para acessar um endereço da web.
A última etapa do processo de gestão de um website é a Manutenção. Ela é uma
fase que existirá durante todo o tempo em que um indivíduo ou empresa possuir um
endereço na Internet. O mais importante nesta etapa se trata da gestão da renovação,
tanto do domínio, quanto da hospedagem, pois, primeiramente, domínios não são, de
fato, adquiridos e apropriados, e, em segundo lugar, a maioria dos serviços de
hospedagem não oferece planos vitalícios.
Um caso interessante que ilustra a importância da fase de manutenção é o da
Microsoft, que, em 2003, perdeu o domínio “hotmail.co.uk” por esquecer-se de renovar
o registro. Por sorte, o indivíduo que conseguiu obter o registro do domínio teve boa fé
e contatou a empresa para que este pudesse ser novamente transferido. É interessante
notar que o artigo usa a expressão “this vital piece of administration” (traduzido como
“essa peça vital de administração”) para se referir à gestão de domínios. Esta é, de fato,
uma parte do processo frequente e indevidamente negligenciada. [7]
44
Capítulo 4
Softwares de fórum online
4.1 – Aplicações web
Na Computação, o termo “aplicação web” é usado para se referir a aplicações de
software cliente-servidor baseada em serviços HTTP, isto é, aplicações que executem
processos e rotinas tanto do lado do cliente quanto do lado servidor em um ambiente
web. Este conceito não possui distinção clara do conceito de páginas web dinâmicas,
apresentado anteriormente neste trabalho. Ainda assim, o termo “aplicação web” é
preferível quando o comportamento do sistema se assemelha ao de aplicações desktop
ou de aplicativos móveis.
Alguns exemplos de aplicação web são clientes de webmail, lojas de e-
commerce, serviços de mensagem instantânea e jogos online. Há uma diferença
perceptível entre suas formas de utilização, ainda que o processo de geração do
conteúdo das páginas destas aplicações seja semelhante ao de uma página de blog, por
exemplo.
Softwares de fórum se encaixam na definição de aplicação web, visto que
fornecem uma plataforma completa para a gestão de painéis de discussão e troca de
informações entre usuários, fazendo uso de linguagens do lado cliente e do lado
servidor, além de utilizarem bancos de dados.
Existem determinadas características que definem genericamente essa categoria
de aplicação, algumas das quais serão comentadas posteriormente. Além disso, existem
diversas formas de distribuição destes softwares. Alguns são fornecidos como serviço
web, o que significa que o administrador não faz download da aplicação, mas sim acessa
um endereço onde será apresentado às possibilidades de configuração e utilização da
mesma. Outras formas de distribuição são fornecidas gratuitamente, o que implica na
necessidade de o administrador baixar o pacote do software, hospedá-lo e configurá-lo
em algum servidor por conta própria. Este servidor, na maioria das ocasiões, pode ser
próprio ou pertencente a uma empresa de hospedagem terceira.
45
4.2 – Comparação entre os softwares de fórum
Por serem um tipo de aplicação muito popular e de grande utilidade, os fóruns
online existem há bastante tempo e possuem tecnologia em estágio bastante
amadurecido. Como será visto, é possível encontrar uma grande variedade destas
aplicações, cada qual oferecendo uma combinação de funcionalidades de modo a se
diferenciar de suas alternativas.
Para este projeto, a primeira grande distinção que teve de ser feita foi quanto à
licença da aplicação. Foi levantada uma restrição que demandava que o software de
fórum tivesse licença open source, sendo uma solução gratuita, em oposição a diversas
soluções de mercado que possuem tecnologia proprietária e cobram pelo seu uso. Seria
de se imaginar que as escolhas ficariam restritas, porém, ainda assim, foi possível ter
um leque de opções bastante variado, graças à popularidade destas plataformas.
As características que serão avaliadas para chegar à opção mais adequada de
solução de fórum para o projeto são: (1) Flat vs Threaded (2) Duplicate Thread
Prevention (3) User-Selectable Themes (4) Calendar (5) Image Attachments (6) Unread
Message Tracking (7) Export (8) Single Sign-On (9) Spam Defenses (10) User-friendly
URLs. A seguir, cada uma delas é explicada.
Flat vs Threaded: Esta característica diz respeito à organização das respostas em
um tópico de discussão. Flat é a opção em que todas as mensagens de resposta entram
no fim da lista, enquanto Threaded apresenta a possibilidade de adicionar respostas a
outras respostas já existentes, exibindo mensagens indentadas.
Duplicate Thread Prevention indica se haverá ou não um mecanismo de
prevenção de duplicação de tópicos. Este mecanismo se manifesta comumente através
de uma barra de resultados que exibe conteúdo já existente que se relacione ao tópico
que o usuário pretende adicionar, ajudando-o, assim, a verificar se postagens
semelhantes já foram feitas por outros membros da comunidade.
User-Selectable Themes é uma característica que trata da existência de
possibilidade de customizar temas (pacote de recursos estéticos) para personalizar a
interface do fórum, dando assim uma aparência mais individual a cada sistema.
Calendar é simplesmente a característica que indica se existe ou não um sistema
de calendário com o qual é possível interagir, adicionando e gerindo uma agenda de
eventos.
46
Image Attachments: esta opção permitirá o usuário fazer upload de imagens em
suas postagens, enriquecendo, assim, a troca de informações e facilitando a
comunicação entre os usuários da plataforma.
Unread Message Tracking é um sistema que permite rastreamento de mensagens
não lidas, assim como fornece notificação para as mesmas em cada conta de usuário,
individualmente.
Export é uma função que se refere à própria estrutura da aplicação e permite
exportação dos dados (configurações do painel de administrador e dados do banco de
dados) para facilitar uma possível migração ou replicação da plataforma em seu estado
atual.
Single Sign-On é a característica que se refere ao sistema de autenticação de
usuários na plataforma, permitindo que esta seja feita através de padrões estabelecidos
como OAuth ou OpenID, garantindo maior segurança às aplicações.
Spam Defenses: Spam é uma preocupação muito comum na Internet e deve ser
considerada em qualquer projeto. Como plataformas de fórum são bastante conhecidas e
envolvem grande quantidade de usuários, frequentemente se tornam alvo de usuários
maliciosos. A característica Spam Defenses indica se a plataforma possui algum
mecanismo de proteção contra este tipo de ataque, e é indispensável a qualquer
aplicação que se proponha a alcançar larga escala.
User-Friendly URLs: esta opção se refere à forma com que o sistema do fórum
gera os links de suas páginas e novos tópicos. Caso este possua URLs amigáveis, os
haverá permalinks (links permanentes para acesso direto à página desejada) com nomes
– frequentemente levando o título do tópico em consideração, ao invés de números,
como, por exemplo, IDs, correspondentes àquela informação no banco de dados.
A seguir, a figura 4.1 mostra um comparativo de diversas plataformas de fórum
levando em conta as características apresentadas.
47
Figura 4.1 - Comparativo de características entre diversas soluções de fórum online.[8]
Para este projeto, a demanda para as características apresentadas foram:
(1) Flat vs Threaded: Threaded
(2) Duplicate Thread Prevention: Preferivelmente
(3) User-Selectable Themes: Deve ser responsivo para dispositivos móveis.
(4) Calendar: Não necessário
(5) Image Attachments: Não necessário
(6) Unread Message Tracking: Não necessário
(7) Export: Não necessário
(8) Single Sign-On: Preferivelmente
(9) Spam Defenses: Necessário
(10) User-friendly URLs: Preferivelmente
Conforme levantados tais requisitos, sobraram algumas alternativas que, por fim,
levaram à escolha da solução Vanilla Forums. No capítulo 5 é apresentado em mais
detalhes o processo de decisão que levou à escolha definitiva.
48
Capítulo 5
Implementação
5.1 – Descrição do problema
A necessidade deste trabalho é a existência de um ambiente de documentação
para uma linguagem de programação de forma que esta possa ser disseminada, além de
possibilitar o engajamento de uma base de usuários para a troca de informações e
conhecimento a respeito de seu uso, garantindo sua constante evolução e
amadurecimento.
A existência de um manual online é de suma importância nesse contexto, já que,
por se encontrar publicado na Internet, pode ser acessado de qualquer lugar com
conexão à Internet. Assim, a linguagem não se restringe ao uso e desenvolvimento
somente por usuários locais como uma documentação física implicaria. Além disso, um
manual online garante uma fonte única de informação, de forma que qualquer alteração
de conteúdo é instantaneamente atualizada e vista por todos.
Além do manual, o fórum também se mostra de grande relevância, sendo um
meio de registro espontâneo e indireto da linguagem. É muito importante que este
conhecimento tácito seja capturado, pois ele surge de usos não previstos pelo
idealizador da linguagem e, certamente, encobre situações que se repetem durante o
desenvolvimento de uma variedade de sistemas.
Dessa forma, tratar com devida atenção a linguagem de programação e seu
ambiente de documentação se torna um trabalho indispensável para que se aproveite o
melhor uso da tecnologia.
5.2 – Metodologia do trabalho
Conforme foi visto que se seguiu uma forma bem estruturada de processos para
o desenvolvimento do presente trabalho, faz-se relevante abordar a metodologia que
49
permitiu obter grande eficiência na definição das atividades e tarefas necessárias ao
projeto.
Ainda que o produto desenvolvido não tenha sido um software propriamente
dito, as diretrizes e métodos sugeridos pela Engenharia de Software foram de grande
valia para a definição dos processos do projeto. Particularmente, o modelo em cascata
foi seguido. Este modelo tem uma abordagem sequencial (também chamada “top-
down”) que o distingue dos demais – ela prega que o desenvolvimento deve ser visto
como um fluxo constante para frente (analogamente ao fluxo de uma cascata), passando
pelas fases de análise de requisitos, projeto, implementação, testes (validação),
integração, e manutenção. De forma que o presente trabalho não se trata de software,
mas sim de um manual e um fórum online, as etapas “testes” e “integração” não se
fazem necessárias.
Como resultado da aplicação do modelo no processo de desenvolvimento do
produto, o principal artefato produzido na etapa inicial foram os requisitos, ainda que
não registrados em documentação formal. Nas fases de implementação e
desenvolvimento, a principal construção foram as plataformas objetivos deste projeto.
Por fim, a fase de manutenção não possui um artefato específico a se produzir, sendo
composta por atividades de correções, moderação e melhoria dos produtos enquanto
estes existirem.
5.3 – Implementação
A implementação foi dividida em duas etapas distintas. A primeira diz respeito à
implementação do manual online da linguagem Witty, enquanto a segunda trata da
implementação do fórum de discussões. Estas etapas serão apresentadas a seguir.
Para a implementação do manual de referência do usuário da linguagem Witty,
foi necessário considerar aspectos no design da solução que levavam em conta os
requisitos levantados para o projeto.
Em primeiro lugar, havia a necessidade de o manual ser online, de forma que o
registro de referências da linguagem não seria suficiente em arquivos locais ou
dispositivos de memória removíveis. Para isso, considerou-se a disposição do conteúdo
em formato de páginas da web.
50
Partindo desse critério, a escolha a respeito da tecnologia utilizada teve de ser
feita entre o desenvolvimento de páginas dinâmicas ou estáticas, optando-se pela
segunda alternativa. Essa opção implicou no fato de que qualquer futura atualização de
conteúdo deveria ser feita através da alteração do próprio código fonte da página, que
tem por base a linguagem HTML. Uma vez decidido a respeito do conteúdo e forma de
distribuição do material, o próximo item a ser discutido foi a disposição estética da
página.
Tendo em vista o estágio atual de maturidade dos dispositivos móveis e o
constante aumento do uso destes para o consumo de conteúdo na Internet através de
seus aplicativos navegadores, a responsividade se tornou um critério indispensável para
todo website que deseja atrair a maior quantidade de visitantes sem se restringir ao
dispositivo do usuário. Responsividade é o conceito que indica se uma página da web
está adaptada para ser exibida de forma igualmente intuitiva e agradável tanto em telas
grandes (tipicamente desktops) quanto em telas menores, variando desde o meio termo
encontrado em tablets até as telas dos smartphones que estão restritas a algumas poucas
polegadas.
Para atender este critério, optou-se por utilizar um layout de página que
aproveita as vantagens oferecidas pela biblioteca Bootstrap – um conjunto de arquivos
HTML, CSS e JavaScript pré-produzidos com componentes reutilizáveis que agiliza o
desenvolvimento de páginas web. Dessa forma, itens de página como menus de
navegação, botões de ação e colunas e linhas que compõem o sistema de grade (grid) do
website puderam ser facilmente produzidos, estilizados e até customizados de acordo
com as predefinições da biblioteca. É importante mencionar que todos os componentes
Bootstrap são responsivos por padrão, o que aumenta as vantagens de se utilizar este
framework web e foi determinante na escolha do mesmo. As figuras 5.1 e 5.2 mostram,
respectivamente, a disposição de páginas do manual em versão desktop e versão mobile.
51
Figura 5.1 – Página do manual em formato para telas grandes (display 1760x1025)
Figura 5.2 – Página do manual em formato responsivo (display 375x667)
52
Como se pode ver, em ambas formatações as páginas ficam agradavelmente
dispostas e garantem uma boa experiência de navegação e fácil entendimento para o
usuário.
A partir da definição estética das páginas que comporiam o manual de
referência, deu-se início à produção de seu conteúdo. De forma que já havia
documentação prévia registrada em língua portuguesa, foi necessário um trabalho de
tradução do material para a língua inglesa – outro requisito apresentado para o projeto.
Durante o processo de tradução, um ponto de observação foi que, devido à
natureza das linguagens, determinados trechos de descrição dos comandos tiveram sua
estrutura sintática ligeiramente alterada, de modo a respeitar a arquitetura e modo de
construção da linguagem alvo. Este fato, contudo, não causou problemas às
propriedades semânticas do material.
Pelo restante do processo de desenvolvimento do manual, não houve demais
nuances e fatores que interferissem com o percurso previsto para a tarefa.
A fase de implementação do fórum se iniciou após serem definidos os requisitos
básicos que a plataforma deveria atender. Ainda assim, foi necessário fazer ajustes à
forma original com que aplicação foi disponibilizada para que esta se enquadrasse nos
requisitos do sistema.
De acordo com as informações apresentadas no capítulo 4, foi visto que algumas
restrições foram impostas e que, com isso, as alternativas se resumiram a algumas
poucas opções.
Depois de analisar cautelosamente cada uma das possíveis soluções, como
phpBB [9], Simple Machines Forum [10], PunBB [11], MyBB [12], Phorum [13] e
Discourse [14], chegou-se à conclusão de que o software Vanilla Forums [15] seria o
mais adequado para o projeto. De acordo com a figura 4.1 do capítulo anterior, foi visto
que as características apresentadas como requisitos se encaixavam na solução. Além
disso, é possível destacar quatro pontos que se mostraram diferenciais na hora da
escolha, a saber, (1) a documentação do software é extensa e bem apresentada [16]; (2)
a comunidade de suporte é ativa e possui grande quantidade de material desenvolvido e
dúvidas já atendidas [17]; (3) a ampla gama de complementos em seu repositório online
permite extensão do software para ainda maior potencial oferecido [18]; (4) seu tema
padrão atende simples e objetivamente aos requisitos estético e responsivo elicitados
[19].
53
Dessa forma, foi constatado que o Vanilla Forums atenderia às necessidades do
projeto e com isso se optou por utilizá-lo. A seguir, é descrita a fase de implementação
da plataforma, com os passos necessários para a correta configuração das opções no
painel de administrador.
O primeiro passo para implantação da aplicação foi criar um subdomínio
“forum.meudominio.com.br” para poder facilitar o acesso dos usuários. Este domínio
foi mapeado sobre “/public_html/forum/”. Em seguida, foi realizado o download da
versão open source da plataforma no endereço https://vanillaforums.com/en/software/,
conforme mostra a Figura 5.3.
Figura 5.3 - Página oficial para download da plataforma.
O arquivo vem em formato compactado “.zip” com nome e número da versão.
Para iniciar o processo de configuração do sistema, é necessário descompactar o
conteúdo do arquivo .zip e subi-lo para o diretório desejado no servidor via FTP, por
exemplo, “/public_html/forum/”. Também, ainda antes de iniciar as configurações, é
necessário criar um banco de dados, no serviço de hospedagem, para receber, gerir e
fornecer os dados de e para a aplicação. Deve-se anotar o nome do banco de dados
criado, o login de administração desse banco, a respectiva senha e o nome do host do
banco.
Tendo feito o upload dos arquivos e pastas do Vanilla e criado o banco de dados
na conta de hospedagem com sucesso, o usuário deve ser apresentado a uma tela de pré-
54
configuração no endereço web correspondente à sua aplicação, semelhante ao que
mostra a figura 5.4 (ou acesse diretamente <domínio do fórum>/dashboard/settings).
Nesta tela deve-se entrar com os dados anotados da etapa de criação do banco de dados.
Figura 5.4 - Página de pré-configuração do sistema Vanilla.
Em seguida, o painel de administração do fórum Vanilla será exibido (ver
Figura 5.5).
Figura 5.5 - Tela principal do painel de administração do fórum Vanilla.
55
A primeira aba do menu a ser exibida é o Dashboard. Ela contém um breve
passo-a-passo de ações básicas para o administrador da aplicação se ambientar à
plataforma, assim como uma seção “Updates” com notícias mais recentes da
comunidade de desenvolvedores desta solução. Não é necessário acionar nada nesta
página.
Para iniciar as modificações necessárias demandadas para este trabalho, o
usuário pode seguir até a opção Banner na seção Appearance no menu lateral. Nesta
página, apenas duas alterações necessitam ser feitas: os campos Homepage Title e
Banner Title devem ser definidos com o valor “Fórum Metadox”. Feito isso, deve-se
clicar no botão azul “Save” para salvar as alterações.
A seguir, o usuário deve clicar na aba Homepage no menu lateral. Nesta, as
configurações de melhor formatação encontradas foram as opções “Discussions”; em
Discussions Layout escolheu-se Table Layout; e em Categories Layout foi escolhido
também Table Layout. Deve-se, nesse momento, salvar estas configurações
pressionando o botão “Save”.
As abas Themes, Mobile Themes e Messages não necessitam ser configuradas
pois os valores padrões já atendem os requisitos. Assim, passa-se à opção Avatars para
configurar a imagem avatar padrão de novos usuários cadastrados no fórum. Tendo sido
pedida uma imagem específica para servir como avatar, é necessário fazer upload desta
no software de fórum. A alteração é simples, bastando ir na aba mencionada acima,
Avatars, clicar no botão azul Change, selecionar a imagem respectiva na janela de
seleção e aguardar o carregamento da imagem. A próxima etapa é a configuração de
categorias e tags que existirão predefinidamente no fórum.
Para criar e gerenciar as categorias do fórum, é necessário ir até a aba
Categories encontrada na seção Forum Settings do menu lateral. Lá, o usuário terá a
opção de inserir novas categorias, assim como editar, apagar ou mesmo desabilitar a
funcionalidade completamente. Como foi solicitado que houvesse categorias padrões no
sistema, deve-se criá-las aqui. As categorias definidas foram “All categories”,
“Idealize”, “Mentor” e “Witty language”.
Assim como o painel de administrador permite a gestão completa de categorias
do fórum, ele também permite a gestão de tags para contextualização dos tópicos de
discussão criados na plataforma através da ativação do plugin nativo “Tagging”. Para
habilitá-lo, deve-se ir até a aba Plugins encontrada na seção Addons do menu lateral,
56
procurar, sob o filtro da aba All, o plugin correspondente Tagging e clicar no botão azul
“Enable”. Após aguardar o carregamento e ativação do plugin. Uma nova opção
chamada “Tagging” surgirá no menu lateral esquerdo, dentro da subdivisão Forum.
Uma vez na página de gestão de tags, o processo de criação é simples – basta
clicar em “Add Tag” e adicionar, uma a uma, as etiquetas desejadas. Para o fórum em
questão, foram definidas as tags fixas: analytics, bug, bug fix, grammars, GUI,
knowledge base, programs, proof, registers, scenarios. Utilize o botão “Add Tag”, em
“Tag Name” insira o nome da tag desejada e em “url slug” o mesmo nome. Um detalhe
importante é que, por padrão, a permissão de criação de novas tags é estendida ao
usuário do tipo “membro”, o que não é desejado nesta implementação. Como um dos
requisitos da solução de fórum foi a existência de somente tags pré-definidas, é
necessário remover a permissão de criação de novas tags de usuários do tipo “membro”.
Para isso, deve-se ir na opção “Roles & Permissions” da aba “Users”, clicar no botão
Edit correspondente ao tipo Member e, na nova página que irá carregar. Deve-se ir até a
tabela “Plugins”, desmarcar a caixa sob a coluna “Add” correspondente à linha do
plugin Tagging. Em seguida, salvar a alteração clicando no botão “Save” no fim da
página.
A próxima configuração a ser realizada é o padrão de e-mails. Para ajustar, é
necessário ir em Settings > Outgoing Email. O requisito levantado definiu que os
campos Name e Email devem ser, respectivamente, “Fórum Metadox” e
“[email protected]”. As duas caixas de seleção que se encontram abaixo dos
campos devem permanecer inalteradas. Para salvar as modificações, deve-se clicar em
“Save” e aguardar a página recarregar.
As configurações restantes tratam de customização de funcionalidades da
aplicação. A primeira delas é a desativação da funcionalidade padrão “Mensagens
Privadas”. Este é um ajuste simples, sendo necessário apenas ir na opção Applications,
dentro de Addons no menu lateral, e, na aplicação Conversations, clicar Disable. Com
esta configuração, não mais os membros serão capazes de trocar mensagens privadas
dentro da plataforma e a única maneira de interação será através de tópicos e respostas
nas discussões do fórum.
Outras três funcionalidades adicionadas ao pacote standard da plataforma
Vanilla são os plugins nativos: (1) “Advanced Editor” – que habilita um editor de texto
mais robusto com suporte a linguagens Markdown, HTML e BBCode; (2) “Quotes” –
que permite a função de citação de posts de outros membros dentro de sua própria
57
postagem; (3) Syntax Pretifier – que adiciona uma opção de formatação visual de
trechos de código inseridos no corpo das mensagens. Para habilitá-los, o processo é,
também, bastante direto e não necessita ajustes extras, basta ir até Addons > Plugins,
encontrar os plugins mencionados na lista e clicar “Enable” em cada um deles,
aguardando o recarregamento da página.
Um plugin sugerido para a aplicação, que não está incluído nativamente no .zip
fornecido para a atual versão do Vanilla, chama-se “Q&A” e deve ser instalado através
do download do pacote encontrado no repositório online
“https://open.vanillaforums.com/addons” ou pelo link direto
“https://open.vanillaforums.com/addon/qna-plugin”. Sua instalação segue o mesmo
princípio de instalação do software de fórum e deve ser feito através do carregamento
do conteúdo descompactado do arquivo .zip para o diretório “/plugins/” encontrado
dentro da instalação do Vanilla.
Uma vez subido o pacote do plugin no diretório correto, será possível ver sua
entrada na lista de plugins no painel. Neste ponto, o próximo passo é clicar “Enable” e
aguardar o sistema ativar corretamente as funcionalidades do mesmo. O que torna este
plugin tão interessante é sua funcionalidade de criar um sistema de perguntas e
respostas dentro do fórum de discussão, sendo possível o autor da pergunta marcar
determinada resposta como melhor resposta, ajudando, assim, a identificação de
soluções para futuras pesquisas a que aquela pergunta possa servir. A Figura 5.6 ilustra
este conceito.
58
Figura 5.6 - Exemplo de uso da funcionalidade “Perguntas e Respostas” do plugin
adicional Q&A.
Finalmente, terminando a fase de configuração da plataforma via painel de
administrador, é preciso adicionar o mecanismo de segurança reCaptcha à página de
registro de novos usuários. A razão para tal se dá para evitar spam e foi um dos
requisitos solicitados no projeto. Adicionar reCaptcha envolve duas etapas: ativação do
serviço por meio de uma conta Google para obtenção das chaves de uso da aplicação e
ativação do serviço no painel de administrador do fórum Vanilla.
A primeira etapa exige que o administrador possua uma conta Google ativa.
Tendo uma, o administrador deve ir até o link “https://www.google.com/recaptcha/” e
seguir as instruções para registrar e obter as chaves da API.
Uma vez com as chaves Pública e Privada, deve-se então voltar ao painel de
administrador, e, dentro de Users > Registration, colar os valores das mesmas nos
respectivos campos Public Key (Site Key) e Private Key (Secret Key). Feito isso, é
necessário clicar “Save” para salvar as alterações e ativar o mecanismo.
59
Tendo sido feitos os ajustes no painel, restam duas modificações necessárias,
desta vez, diretamente no código da aplicação, para que a plataforma esteja
completamente configurada.
A primeira modificação diz respeito ao ocultamento da pergunta de gênero do
usuário no momento de cadastro no fórum, assim como a visualização do gênero
definido na página do perfil, visto que este tipo de informação foi definido como
irrelevante no contexto da aplicação web em questão (Figura 5.7).
Figura 5.7 - Interface de cadastro no fórum com opção a ser ocultada.
Para encontrar o trecho de código responsável pela exibição desse campo, é
necessário seguir o caminho /applications/dashboard/views/entry/ no diretório da
aplicação. Dentro deste, deve-se encontrar os arquivos registerbasic.php e
60
registerrecaptcha.php, ambos responsáveis pelas páginas de registro de usuário, sendo a
segunda exibida na figura 5.7.
Nestes arquivos, uma pesquisa pelo termo “gender” revela que o elemento
HTML responsável pela geração deste campo, em ambos os casos, é o “<li
class=‘Gender’>”. Sendo assim, para se ocultar a opção por completo, basta comentar,
usando a sintaxe HTML para comentários “<!-- comentário -->”, todo o elemento,
incluindo suas tags li inicial e final. O resultado será a nova tela conforme é mostrado
na figura 5.8.
Figura 5.8 - Resultado da alteração no código.
O passo seguinte é a remoção do campo gênero ainda exibido na página de perfil
do usuário.
61
Para encontrar o trecho de código correspondente à exibição deste campo, é
necessário seguir o caminho de arquivo /applications/dashboard/views/profile/edit.php.
Neste arquivo, o procedimento é similar ao anterior, havendo necessidade de comentar
por completo o elemento responsável pela exibição do campo “Gender” na aplicação,
que se encontra a partir de uma pesquisa pelo termo “gender”.
A próxima, e última, alteração, diz respeito à exibição das tags predefinidas
mencionadas anteriormente. Por padrão, há um botão de legenda “Show popular tags”
que permite o usuário clicar para que sejam listadas todas as tags cadastradas na
aplicação. Foi elicitado como requisito de projeto que tais tags devem aparecer
explícitas para o membro no momento de criação do novo tópico, sem a necessidade de
se clicar no link (ver Figura 5.9).
Figura 5.9 - Comportamentos padrão e desejado para a exibição de tags em nova
discussão.
Para se obter esse comportamento, é necessário modificar o código fonte do
plugin “Tagging”, ativado anteriormente na etapa de configuração via painel de
administrador. Para tal, deve-se ir até o caminho “/plugins/Tagging/” e encontrar o
arquivo “class.tagging.plugin.php”.
Neste arquivo, procura-se pelo termo “AvailableTags”. O editor levará até o
termo buscado, porém se está interessado no trecho de código um pouco antes que se
inicia na linha 590 com o comentário “// Available tags”. Neste trecho, é necessário
modificar duas linhas – primeiro, a que corresponde a:
62
“echo wrap(Anchor(t('Show popular tags'), '#'), 'span', array('class' =>
'ShowTags'));”
que deve ser alterada para:
“echo wrap(Anchor(t('Show popular tags'), '#'), 'span', array('class' => 'Hidden
ShowTags'));”
A adição do parâmetro “Hidden” na array de classes do elemento span irá
ocultar o link “Show popular tags” que aparece na tela do lado esquerdo da figura 5.7.
A segunda linha a ser alterada é a que contém o código:
“echo wrap($TagsHtml, 'div', array('class' => 'Hidden AvailableTags'));”
e a modificação a ser feita é remover a palavra “Hidden”:
“echo wrap($TagsHtml, 'div', array('class' => 'AvailableTags'));”
retirando esta classe da array de classes do elemento div responsável pela listagem das
tags existentes. Com essa alteração, a lista de tags ficará visível por padrão ao se criar
uma nova discussão no fórum. O resultado é visto do lado direito da figura 5.9.
Com isso, conclui-se a configuração do sistema de fórum e o mesmo se encontra
pronto para utilização de acordo com os requisitos de projeto levantados. Seu uso é feito
através da interação de usuários com contas do tipo “Membro” e sua gestão e
manutenção fica a cargo dos usuários do tipo “Administrador”, que possuem acesso
irrestrito ao painel e podem alterar configurações a qualquer momento.
5.3 – Atividades Administrativas do Fórum
Levando em conta as características de informalidade e individualidade dos
registros em um fórum online, é possível esperar que, algumas vezes, o conteúdo
postado por membros não seja adequado. Por isso, existe necessidade de haver
constante monitoramento sobre o que é inserido nas discussões. Cabe aos moderadores
do fórum, usuários com permissões especiais de gerenciamento de conteúdo e de
membros, moderar as informações trocadas.
Tendo em vista esse papel, os softwares de fórum disponibilizam opções, em seu
painel de administração, para gerir todo tipo de item do sistema. Serão vistas, em
especial, as funções de moderação de respostas, moderação de discussões e gestão de
usuários.
63
O fórum Vanilla possui, em sua interface de administração, a seção Users >
Roles & Permissions, onde é possível verificar os papéis e permissões de usuários. Por
padrão, existem seis papéis distintos: Guest (convidado) – perfil básico de visitante em
que só é permitido visualizar conteúdo; Unconfirmed (não-confirmado) – usuários que
fizeram cadastro mas necessitam confirmação da conta por e-mail; Applicant
(aplicantes) – usuários que solicitaram registro, mas ainda não foram aprovados;
Member (membro) – usuário que tem seu cadastro regularizado e pode participar de
discussões; Moderator (moderador) – usuários que tem permissão de edição da maior
parte do conteúdo; Administrator (administrador) – usuários que tem permissão total na
plataforma. Se está interessado em analisar o papel “Moderator”.
Ao se clicar no botão “Edit” correspondente a este papel, vê-se, na página de
edição de permissões, a tabela “Default Category Permissions” (permissões padrão da
categoria). É possível verificar que, para moderadores, todas as caixas estarão marcadas
com um “check”, indicando que este papel tem permissão para realizar as funções
listadas. A figura 5.10 mostra a tabela mencionada.
Figura 5.10 - Permissões padrão para o usuário tipo moderador
Para observar como tais permissões se manifestam no uso cotidiano do fórum,
serão citadas três possibilidades de gestão que um moderador pode realizar. A primeira
é a remoção de uma resposta inadequada.
Intuitivamente, quando um moderador navega em um tópico específico da
plataforma, ao se posicionar o mouse na região da resposta, aparecerá um ícone de
engrenagem que permite a execução de tarefas de moderação. A figura 5.11 mostra
como um moderador pode gerir uma resposta de discussão, sendo capaz, inclusive, de
removê-la por completo.
64
Figura 5.11 - Opção de remoção de resposta de uma discussão.
Observa-se, por essa figura, que o processo é simples e objetivo. Caso um
usuário tenha postado um conteúdo inapropriado para a discussão, o moderador tem a
capacidade de apagar por completo tal resposta.
A segunda possibilidade de gestão de conteúdo a ser analisada é a capacidade de
remoção de uma discussão completa. Assim como no caso anterior, o processo de
remoção é bastante direto, resumindo-se, também, a um clique do botão que aparece sob
o menu do ícone de engrenagem. Como se trata de uma discussão completa, existem
duas interfaces possíveis onde o menu pode ser acessado – na página de categoria, onde
é exibida uma lista de discussões correspondentes; ou na página da própria discussão. A
figura 5.12 mostra ambos os casos onde se tem acesso ao ícone do menu gerencial.
65
Figura 5.12 - Interfaces possíveis para gestão de discussão
Conforme se pode verificar, existe um botão de legenda “Delete Discussion” que
permite realizar exatamente a função desejada.
Por fim, a terceira possibilidade a ser mencionada é a capacidade de excluir, ou,
equivalentemente, banir, usuários da plataforma. Está é uma alternativa mais drástica
que pode ser útil quando um usuário malicioso (troll) consegue efetuar registro na
plataforma, constantemente interferindo com a qualidade do conteúdo encontrado na
mesma.
A exclusão do usuário também é feita de forma rápida. Para tal, deve-se ir até o
perfil do usuário e, clicando no botão de acesso ao menu de gestão, acessar a opção
“Ban”, que irá banir o usuário do sistema e prevenir que este faça novas postagens. Vale
mencionar que há disponível, também, a opção “Delete Content”, que apaga todos os
registros já feitos por este usuário, fato que pode ser útil quando este tiver passado
despercebido por algum tempo e já tiver criado muitos registros inapropriados. A figura
5.13 mostra exatamente a tela de acesso a tais opções.
66
Figura 5.13 - Tela de acesso ao menu de gerenciamento de usuário, onde é possível
editar, banir, ou excluir o conteúdo postado pelo mesmo.
Com isto, considera-se que foram apresentados os processos básicos essenciais
para o uso rotineiro da plataforma. Em seguida, segue-se à apresentação das conclusões
obtidas com a execução do presente trabalho.
67
Capítulo 6
Conclusão
6.1 – Conclusões
Como palavras finais de conclusão deste trabalho, serão tratados em seguida os
resultados alcançados pelo esforço de desenvolvimento do ambiente virtual. O primeiro
fator que se menciona foi a abordagem do problema seguindo noções da Engenharia de
Software.
Ainda que o produto a ser desenvolvido não tenha sido, de fato, a
implementação de software, procurou-se seguir os processos de projeto receitados por
esta área do conhecimento. Como exemplo inicial de sua aplicação, cita-se o
levantamento de requisitos.
Neste projeto, aplicou-se o levantamento de requisitos com o objetivo de se
mapear as necessidades do cliente, assim como restrições para as possíveis soluções
pautadas. Como resultado desse esforço, antes mesmo de se investir qualquer recurso
em implementação, tinha-se claro em mente como os ambientes deveriam ser
concebidos. Assim, conforme se provou ao fim da implementação do projeto, investir
tempo na elicitação de requisitos foi de grande valia. É importante mencionar que, ainda
que a Engenharia de Software tenha o levantamento de requisitos como um artefato
documental a ser produzido e registrado explicitamente, neste trabalho bastou-se o uso
de outras formas de registro de informação, como e-mail, para que se tivesse uma lista
confiável das necessidades e restrições encontradas para a solução.
Além de requisitos, uma preocupação que permeou todo o processo de
construção do trabalho foi a necessidade de manutenção posterior do produto. A
consequência de tal se manifestou na procura por soluções que tivessem fácil curva de
aprendizado em nível de gestão e que fizessem uso de tecnologias amplamente
disseminadas, fato que também se provou vantajoso.
68
Conforme se revelou que o desenvolvimento do projeto consistiria de uma
documentação online disponível em website, acompanhada de um fórum de discussão, a
abordagem seguida foi separar a fase de implementação em duas. De acordo com o que
se previu de esforço e complexidade para realização dos dois ambientes, o fórum foi
priorizado. Uma vez que se chegou próximo ao resultado pretendido, foi possível
paralelizar a implementação do fórum com algumas atividades de desenvolvimento do
manual.
O resultado que se tem ao fim deste período corresponde às expectativas postas,
de modo que é possível concluir que a realização do projeto foi um sucesso. Todos os
obstáculos que se apresentaram foram sanados, e considera-se que o prazo se mostrou
suficiente para se alcançar todos os objetivos. O manual e o fórum podem ser acessados
através dos links “http://www.metadox.com.br/manual/documentation.html” e
“http://www.metadox.com.br/forum/index.php”, respectivamente.
6.2 – Trabalhos Futuros
Como trabalho futuro, é possível conceber a expansão do produto para ainda
maior documentação e ecossistema orientado ao uso da linguagem Witty para sistemas
baseados em conhecimento. Há grande espaço para extensão do ambiente e mais formas
de documentação podem ser elaboradas, como, por exemplo, a especificação da
linguagem, tratada no segundo capítulo deste trabalho. Também é possível conceber um
ambiente virtual de aprendizado com tutoriais em forma de videoaulas e até mesmo a
criação de uma plataforma online interativa para prototipação de programas com a
linguagem. Ainda, será útil a construção de uma base de conhecimento modelo, para
que se tenha um denominador comum que ajude novos desenvolvedores a dar os
primeiros passos na linguagem. Por fim, uma funcionalidade que trará ainda maior
riqueza para o fórum é a reputação de usuários, que facilitará a identificação de
conteúdo relevante com base na reputação do autor da resposta, além de ser um fator de
estímulo à qualidade das informações, assim como também aumenta o engajamento dos
membros.
69
Bibliografia
[1] Carvalho, R. L.; Genaro, S. “Manual de Programação da Linguagem Witty”,
Metadox Group, 2003.
[2] ______, “Lexical Structure”, GitHub Inc, 2017. https://github.com/php/php-
langspec/blob/master/spec/09-lexical-structure.md, (Acesso em 19 Junho 2017).
[3] Marcey, Joel “Announcing a specification for PHP”, HHVM, 2014.
http://hhvm.com/blog/5723/announcing-a-specification-for-php, (Acesso em 19
Junho 2017).
[4] ______, “W3Schools Online Web Tutorials”, https://www.w3schools.com, 2017,
(Acesso em 04 Junho 2017).
[5] ______, “W3Techs - World Wide Web Technology Surveys”, Q-Success,
2017.https://w3techs.com/, (Acesso em 07 Junho 2017).
[6] ______, “What is the platform in which Facebook is built?”, Quora,
2017.https://www.quora.com/What-is-the-platform-in-which-Facebook-is-built
(Acesso em 07 Junho 2017).
[7] Richardson, Tim. “Microsoft forgets to renew hotmail.co.uk domain”, The Register,
2003.
http://www.theregister.co.uk/2003/11/06/microsoft_forgets_to_renew_hotmail/,
(Acesso em 11 Junho 2017).
[8] ______, “Comparison of Internet fórum Software”,
https://en.wikipedia.org/wiki/Comparison_of_Internet_forum_software, (Acesso
em 15 Março 2017).
[9] ______, “phpBB Free and Open Source Forum Software”, https://www.phpbb.com/,
(Acesso em 16 Março 2017).
[10] ______, “Simple Machines Forum - Free & Open Source Community software”,
https://www.simplemachines.org/, (Acesso em 16 Março 2017).
[11] ______, “PunBB”, http://punbb.informer.com/, (Acesso em 16 Março 2017).
[12] ______, “MyBB - Free and Open Source Forum Software”, https://mybb.com/,
(Acesso em 16 Março 2017).
[13] ______, “Phorum - Open Source PHP Forum Software”, http://www.phorum.org/,
(Acesso em 16 Março 2017).
70
[14] ______, “Discourse – Civilized Discussion”, https://www.discourse.org/, (Acesso
em 16 Março 2017).
[15] ______, “Online Community Software and Customer Forum Software by Vanilla
Forums”, https://vanillaforums.com/en/, (Acesso em 16 Março 2017).
[16] ______, “Vanilla Forums Documentation”,
http://docs.vanillaforums.com/developer/, (Acesso em 18 Março 2017).
[17] ______, “Open Source Community Forum Software”,
https://open.vanillaforums.com/categories, (Acesso em 18 Março 2017).
[18] ______, “Browse Addons – Vanilla Forums”, https://open.vanillaforums.com/add-
ons, (Acesso em 18 Março 2017).
[19] ______, “Browse Addons – Vanilla Forums”,
https://open.vanillaforums.com/addon/browse/themes/, (Acesso em 18 Março
2017).