INSTITUTO MEDIO POLITÉNCICO DO CACHIUNGO

CURSO TÉCNICO DE INFORMÁTICA

PROJECTO TECNOLÓGICO

13ª CLASSE

CRIAÇÃO DE UM SISTEMA DE GESTÃO ESCOLAR PARA O INSTITUTO MÉDIO DE

SAÚDE NDUMBALUNDO

JOSÉ CHIVINDA CACHLINGUICHIMUE

HUAMBO-2023
 INSTITUTO MEDIO POLITÉNCICO DO CACHIUNGO
CURSO TÉCNICO DE INFORMÁTICA
PROJECTO TECNOLÓGICO

13ª CLASSE

CRIAÇÃO DE UM SISTEMA DE GESTÃO ESCOLAR PARA O INSTITUTO MÉDIO DE

SAÚDE NDUMBALUNDO

AUTOR
JOSÉ CHIVINDA CACHLINGUICHIMUE
Nº 28
TURMA: 13.I .2
ENG. PEDRO CANOQUELA CAPITANGO
 REPÚBLICA DE ANGOLA
MINISTÉRIO DA EDUCAÇÃO
INSTITUTO POLITÉCNICO DO CACHIUNGO

Trabalho de conclusão de fim de curso apresentado ao departamento de Informática do Instituto

Politécnico do Cachiungo como objeto de avaliação por parte das exigências do curso Técnico
de Informática para obtenção do título de técnico
em_______________________________________

Aprovado em________________de__________________2023

Presidente de mesa____________________..._____________________________________

1º
vogal______________________________________________________________________

2º
vogal______________________________________________________________________

3º
vogal______________________________________________________________________

4º
vogal______________________________________________________________________

5º
vogal______________________________________________________________________

Secretario de mesa____________________________________________________________

Coordenador do curso_________________________________________________________

HUAMBO – 2023
 IDENTIFICAÇÃO DO ALUNO

Nome completo: José Chivinda Cachlinguichimue

Curso: Técnico de Informática

Turma: 13.I.2

Filiação: Arlindo Cachilinguichimue e Metuliana Essenje

BI Nº 008292717HO041

Natural: Bailundo

Província de: Huambo

Data de Nascimento: 22/02/2001

Telefone: 936893574/922535578
 DEDICATORIA
Primeiramente, desejo dedicar este trabalho a Deus aos meus pais, que sempre me apoiaram e
incentivaram a buscar conhecimento e crescer profissionalmente. Sem o amor, a paciência e a
compreensão deles, eu não teria conseguido chegar até aqui. Foram muitas noites de estudo e
dedicação, mas tudo isso valeu a pena para alcançar esse objetivo. A vocês, minha eterna
gratidão e amor.
 AGRADECIMENTOS
Gostaria de expressar meus sinceros agradecimentos às pessoas que tornaram a realização deste
trabalho possível. Em primeiro lugar, agradeço o meu orientador, que me guiou com sabedoria
e paciência durante todo o processo de pesquisa e escrita do trabalho. Sem sua experiência e
dedicação, certamente não teria atingido os resultados alcançados. Agradeço também aos
professores e funcionários da instituição de ensino, que proporcionaram um ambiente de
aprendizado estimulante e desafiador, bem como a oportunidade de desenvolver essa pesquisa.

Agradeço ainda aos amigos e familiares que me apoiaram durante todo o tempo em que estive
envolvido com este trabalho. Seus encorajamentos, incentivos e palavras de conforto foram
fundamentais para que eu pudesse manter o foco e superar os obstáculos que surgiram no
caminho. Quero expressar minha profunda gratidão a essa rede de carinho e apoio, que me
sustentou durante os momentos de dúvida e dificuldade. Seu amor e suporte são valiosos para
mim e me fazem sentir mais confiante e seguro para enfrentar as próximas etapas dessa jornada
de estudos e aprendizado.
 SUMÁRIO

Este projeto visa desenvolver um sistema de gestão utilizando tecnologia web para o Instituto
Médio de Saúde Ndumbalundo. O sistema terá uma base de dados associada a um sistema de
gerenciamento para armazenar e gerenciar informações de forma eficiente. Atualmente, o
instituto realiza todo o processo administrativo manualmente, no papel, e a implementação
deste sistema de gestão automatizado permitirá que as informações sejam gerenciadas de
maneira mais eficaz.

Palavras-chave: Gestão escolar, Instituto Médio de Saúde Ndumbalundo, base de dados,

sistema de gestão, tecnologia web.
 ABSTRACT

This project aims to develop a web-based management system for the Ndumbalundo Health
Middle Institute, which currently performs all administrative processes manually on paper. The
system will consist of a database associated with a management system to store and manage
information efficiently.

Keywords: School management, Instituto Médio de Saúde Ndumbalundo, database,

management system, web technology.
 SIGLAS E ABREVIATURAS

BD – Base/Banco de Dados
CSS – Cascading Style Sheets
PHP - Hypertext Preprocessor
HTML - HyperText Markup Language
PC – Personal Computer
SQL – Structured Query Language
TAGS – Etiquetas
PDF – Portable Document Format
SGBD - Sistemas Gerenciadores de Dados
DML - Data Manipulation Language
DDL - Data Definition Language
FTP - significa File Transfer Protocol (Protocolo de Transferência de Arquivos, em
português)
INDICE GERAL
INDICE DE FIGURAS
 INTRODUÇÃO
Um sistema de gestão escolar é um software que possibilita a administração de todas as
atividades relacionadas a uma escola. Isso inclui o gerenciamento de cadastros de alunos,
professores, documentos, lançamentos de notas, e outras atividades relevantes. Esses sistemas
são criados com o objetivo de melhorar a eficiência e a qualidade do ensino em uma escola,
automatizando muitas das tarefas que anteriormente eram realizadas manualmente.

Neste trabalho, foi desenvolvido um sistema de gestão escolar para a área administrativa do o
Instituto Médio de Saúde Ndumbalundo, com um painel administrativo que permite a criação
de cadastros de professores, alunos, disciplinas, turmas e pagamentos, bem como a remoção
de alunos cadastrados.

11
PROBLEMA

Falta de um Sistema de gestão Escolar

A ausência de um sistema de gestão escolar pode causar desafios significativos para as
instituições de ensino. A gestão manual de informações e processos pode resultar em
ineficiência e falta de produtividade. Esses problemas podem ter um impacto negativo na
qualidade do ensino, aumentar os custos operacionais e prejudicar a imagem da instituição.
Portanto, é essencial que as instituições de ensino invistam em sistemas que integrem
informações e processos para garantir a eficiência, produtividade e qualidade do ensino
oferecido.

12
HIPÓTESE

A criação de um Sistema de Gestão Escolar é essencial para as instituições de ensino

modernas, pois possibilita a otimização da gestão de recursos, informações e processos,
trazendo maior eficiência, agilidade e qualidade.

13
OBJETIVO GERAL

Implementar um Sistema de Gestão Escolar para otimizar e integrar os processos de gestão das
atividades educacionais. O objetivo é promover uma gestão mais eficiente e ágil dos recursos
e informações.

14
 OBJETIVOS ESPECÍFICOS

• Melhorar a forma como a escola é administrada;

• Agilizar o processo de Matrículas;
• Facilitar os pagamentos, dependendo do tipo de pagamento;

15
JUSTIFICATIVA

Antes, a área administrativa do Instituto Médio de Saúde Ndumbalundo operava por meio
de um sistema manual, que se baseava exclusivamente em documentos impressos para
conduzir suas atividades. Esse processo apresentava diversas limitações, pois demandava
um grande esforço e tempo, além de dificultar a organização e armazenamento das
informações,. Diante desse cenário, tornava-se evidente a necessidade de implementar
uma nova solução tecnológica para otimizar o fluxo de informações e aprimorar o
desempenho do Instituto.

16
 TÉCNICA DE INVESTIGAÇÃO

No decorrer deste estudo, foram empregadas as seguintes metodologias de pesquisa: busca

por informações na internet e consulta de livros especializados.

17
 ESTRUTURA DO TRABALHO

Este trabalho está divido do seguinte modo:

Introdução
Três Capítulos
• Capítulo I – Fundamentação Teórica
Neste capítulo, apresentamos as teorias que são importantes para o nosso trabalho. Falamos
sobre o sistema de gestão escolar, entre outros conceitos relevantes.

• Capítulo II – Solução do problema

Neste capítulo, apresentamos a solução prática do nosso trabalho, detalhando todas as
ferramentas que foram utilizadas para a sua execução. Além disso, apresentamos a conclusão
geral do projeto.

18
 CAPITULO I

FUNDAMENTAÇÃO TEÓRICA

19
 1.1. INTRODUÇÃO
Este capítulo fala sobre as ideias e teorias que foram usadas para desenvolver o sistema, como
o que é um sistema de gestão escolar, o que é uma base de dados, o que é programação e o que
é uma página web.

20
 1.2. GESTÃO ESCOLAR ADMINISTRATIVA

A gestão escolar administrativa é um processo fundamental para o sucesso de uma instituição

de ensino. Ela abrange diversas áreas como matrículas, gestão de professores,
acompanhamento da frequência dos alunos, controle de pagamentos de propinas e outros
processos administrativos. Uma gestão eficiente garante que a escola funcione de forma
organizada, otimizando o tempo e os recursos disponíveis, além de proporcionar uma melhor
experiência para alunos, professores e funcionários.

Para uma gestão escolar administrativa eficiente é preciso adotar tecnologias e sistemas que
possam automatizar e simplificar os processos burocráticos, reduzindo o tempo e o esforço
gasto pelos funcionários em tarefas repetitivas. Além disso, é importante investir na
capacitação dos colaboradores, garantindo que eles possam utilizar os recursos tecnológicos de
forma adequada e aproveitar ao máximo os benefícios oferecidos pelas ferramentas
disponíveis. Dessa forma, é possível garantir uma gestão escolar eficiente, promovendo uma
melhor experiência para alunos, professores e colaboradores.

1.3. FUNCIONALIDADES, CARACTERÍSTICAS E VANTAGENS

• Funcionalidades:
Cadastro de alunos e professores: O sistema de gestão escolar permite o cadastro de alunos e
professores da escola. Nessa funcionalidade, é possível armazenar dados pessoais, de contato,
escolares e funcionais dos indivíduos cadastrados. Isso facilita o controle e organização dessas
informações, além de permitir a atualização e consulta das informações cadastradas a qualquer
momento.

• Gerenciamento de turmas e disciplinas:

A funcionalidade de gerenciamento de turmas e disciplinas permite a organização das
informações de forma hierárquica, onde é possível cadastrar as turmas, disciplinas. Dessa
forma, é possível ter um controle efetivo do número de turmas, alunos por turma e disciplinas
oferecidas pela escola.

• Emissão de boletins e relatórios:

Com o sistema de gestão escolar, é possível emitir boletins e relatórios escolares, que mostram
os pagamentos, reconfirmações e outras informações relevantes dos alunos. Esses documentos
podem ser gerados automaticamente pelo sistema, facilitando o trabalho dos profissionais
responsáveis por essas atividades.

• Gestão de matrículas:
Essa funcionalidade permite a gestão do processo de matrícula dos alunos, desde o cadastro
inicial até o registro de transferências ou cancelamentos. É possível também gerar documentos
necessários para a realização desses processos, como declarações e históricos escolares.

• Centralização de informações em um só lugar: O sistema de gestão escolar centraliza

todas as informações relevantes da escola em um só lugar, facilitando o acesso e
controle dessas informações.

21
 1.4. APLICAÇÃO WEB
Uma página web é um documento que faz parte de um site e normalmente contém links para
facilitar a navegação entre o conteúdo. As páginas web são desenvolvidas usando linguagens
de marcação, como HTML, PHP e outras linguagens que podem ser interpretadas pelos
navegadores. As páginas podem apresentar informações em diferentes formatos, como texto,
imagens, sons, vídeos e animações.

Existem dois tipos de páginas web: as estáticas, cujo conteúdo é predefinido e não muda
durante a execução do programa, e as dinâmicas, cujo conteúdo é dinâmico. O site
desenvolvido neste projeto é um site dinâmico porque está interconectado com um banco de
dados e o conteúdo é atualizado dinamicamente.

1.5. PROGRAMAÇÃO

Programação é o conjunto de atividades que envolvem a criação, o teste e a manutenção de

um programa de computador. Esse programa é desenvolvido utilizando uma linguagem de
programação, que é um conjunto de instruções que permite a comunicação entre o
programador e a máquina, permitindo a criação de soluções para diferentes problemas e
necessidades tecnológicas.

1.6. ALGORÍTMO
Um algoritmo é um conjunto de passos lógicos que levam à resolução de um problema ou
realização de uma tarefa. É como uma receita, que define a sequência de etapas a seguir para
alcançar um objetivo específico. Em programação, o algoritmo é a descrição passo a passo de
como o computador executará uma operação específica.

1.7. LINGUAGEM DE PROGRAMAÇÃO

Uma linguagem de programação é um conjunto de regras e sintaxes padronizadas que
permitem a criação de códigos que podem ser transformados em programas de computador.
Elas permitem que um programador especifique exatamente quais dados o computador deve
manipular, como esses dados devem ser armazenados ou transmitidos e quais ações devem
ser tomadas em determinadas circunstâncias. As linguagens de programação têm como
objetivo principal aumentar a produtividade dos programadores, permitindo que eles
expressem suas intenções de maneira mais clara e fácil do que seria possível com código de
máquina nativo.

1.8. BANCO DE DADOS

Um banco de dados ou base de dados (sua abreviatura é BD, em inglês DB, database) são
conjuntos de dados com uma estrutura regular que tem como objetivo organizar uma
informação. Um banco de dados normalmente agrupa informações utilizadas para um mesmo
fim de forma que possam ser representadas em uma coleção de informações que se relacionam,
afim de criar sentido. São de vital importância para empresas, e há duas décadas se tornaram
a principal peça dos sistemas de informação.

Um banco de dados informatizado é usualmente mantido e acessado por meio de um software

conhecido como Sistema Gerenciador de Banco de Dados (SGBD), que e muitas vezes o termo
banco de dados é usado como sinônimo de SGDB. Um SGBD - Sistema de Gerenciamento de

22
Banco de Dados é uma coleção de programas que permitem ao usuário definir, construir e
manipular Bases de Dados para as mais diversas finalidades.

1.9. APLICAÇÕES DE BANCO DE DADOS

Bancos de dados são usados em muitas aplicações, desde sistemas simples para controlar o
estoque de material de uma loja a sistemas avançados como sistemas bancários e segurança
pública.

Um aplicativo de banco de dados é um tipo de software exclusivo para gerenciar um banco de

dados. Aplicativos de banco de dados abrangem uma vasta variedade de necessidades e
objetivos, de pequenas ferramentas como uma agenda, até complexos sistemas empresariais
para desempenhar tarefas como a contabilidade. O termo "Aplicativo de Banco de dados"
usualmente se refere a softwares que oferecem uma interface para o banco de dados. O
software que gerencia os dados já mencionado acima é o Sistema De Gerenciador De Banco
De Dados (SGBD).

1.10. SISTEMA DE GERENCIAMENTO DE BASE DE DADOS

Um Sistema de Gerenciamento de banco de dados é um conjunto de programas de softwares
que permite aos usuários criar, editar, atualizar, armazenar e recuperar dados em tabelas de
banco de dados. Dados em um banco de dados podem ser acrescentados, apagados, alterados,
classificados usando um SGBD. Se você fosse um empregado em uma grande organização, a
informação sobre você provavelmente seria armazenada em diferentes tabelas que estão
ligados entre si. Por referência cruzadas dessas tabelas, alguém poderia mudar o enderenço de
uma pessoa em uma tabela e ela seria atomicamente refletida para todas as outras tabelas.

Exemplos de aplicativos de banco de dados (SGBD) são Microsoft SQL Server, Oracle,
MySQL, PostgreSQL, Firebird, etc. Os SGBD tem sete características operacionais
elementares sempre observadas, que passaremos a listar:

Figura 1 – Sistemas Gerenciadores de Dados – SGBD

1.11. MODELOS DE BASE DE DADOS

Uma Base de Dados está dívida em 3 modelos que são:
• Modelo Relacional;

23
 • Modelo Em Rede;
• Modelo Hierárquico;

Modelo Relacional: este é o modelo mais comumente usado em sistemas de gerenciamento

de banco de dados (SGBDs). Nele, os dados são organizados em tabelas, com cada tabela
representando uma entidade e cada coluna representando um atributo dessa entidade. As tabelas
são relacionadas entre si por meio de chaves primárias e estrangeiras. Esse modelo é muito
eficiente para consultas e manipulações de dados, e é amplamente utilizado em aplicações
empresariais.

Modelo em Rede: esse modelo foi popular no passado, mas hoje em dia é menos utilizado. Ele
representa os dados como um conjunto de registros conectados entre si por meio de ponteiros.
Isso permite que um registro se relacione com vários outros registros, o que pode ser útil em
algumas situações. No entanto, o modelo em rede é mais complexo e difícil de gerenciar do
que o modelo relacional.

Modelo Hierárquico: esse modelo é semelhante ao modelo em rede, mas os dados são
organizados como uma árvore, com cada nó representando um registro e os nós conectados por
meio de ponteiros. Esse modelo também é menos utilizado hoje em dia, mas pode ser útil em
aplicações específicas, como sistemas de gerenciamento de bibliotecas.

Em resumo, esses três modelos representam maneiras diferentes de organizar e relacionar

dados em um sistema de gerenciamento de banco de dados. Cada um tem suas vantagens e
desvantagens, e a escolha do modelo adequado depende das necessidades específicas de cada
aplicação. O modelo relacional é o mais comum e amplamente utilizado, mas em alguns casos
pode ser útil considerar outras opções.

Linguagem de Definição de Dados (“Data Definition Language” - DDL): é utilizada pelo

DBA e projetistas de base de dados para definir seus esquemas. O SGBD tem um compilador
para processar descrições em DDL e construir a descrição do esquema armazenado no
catálogo.

Linguagem de Manipulação de Dados (“Data Manipulation Language” - DML): uma vez

que o esquema é compilado e a base de dados preenchida com dados, os usuários têm que ter
algum modo de manipular os dados. Manipulações comuns como recuperação, inserção,
remoção e modificação de dados são realizadas pela DML.

1.12. LINGUAGEM SQL

A linguagem SQL que é compostas de comandos de manipulação, definição e controle de

dados. A SQL estabeleceu-se como linguagem padrão de Banco de Dados Relacional.
SQL apresenta uma série de comandos que permitem a definição dos dados, chamada de DDL
(Data Definition Language), composta entre outros pelos comandos Create, que é destinado a
criação do Banco de Dados, das Tabelas que o compõe, além das relações existentes entre as
tabelas. Como exemplo de comandos da classe DDL temos os comandos Create, Alter e Drop.

24
Os comandos da série DML (Data Manipulation Language), destinados a consultas, inserções,
exclusões e alterações em um ou mais registros de uma ou mais tabelas de maneira simultânea.
Como exemplo de comandos da classe DML temosos comandos Select, Insert, Update e
Delete.

Uma subclasse de comandos DML, a DCL (Data Control Language), dispõe de comandos de
controle como Grant e Revoke.

A Linguagem SQL tem como grandes virtudes sua capacidade de gerenciar índices, sem a
necessidade de controle individualizado de índice corrente, algo muito comum nas linguagens
de manipulação de dados do tipo registro a registro. Outra característica muito importante
disponível em SQL é sua capacidade de construção de visões, que são formas de visualizarmos
os dados na forma de listagens independente das tabelas e organização lógica dos dados.

1.13. LINGUAGEM SQL: COMANDOS DDL

A linguagem SQL é basicamente dividida em três tipos de comandos: SQL = DDL +

DML + DCL
• DDL (definição de dados): Comandos: CREATE, DROP, ALTER
• DML (manipulação de dados): Comandos: SELECT, INSERT,UPDATE e
DELETE
• DCL(controle de dados): Comandos: GRANT e REVOKE

Os comandos de manipulação de dados(DML) em SQL são representados por:

• UPDATE: altera os valores de dados já cadastrados
• DELETE: remove dados já cadastrados
• SELECT: usado para consultar o BD e retornar dados que satisfazem a
determinada expressão em um comando.

1.14. COMANDO INSERT

O comando INSERT permite inserir uma linha de dados na tabela.

1.15. COMANDO UPDATE

O comando UPDATE é usado para mudar valores de linhas de dados que já foram cadastrados
anteriormente e que obedecem a determinados critérios, especificados em condições. Este
comando pode alterar mais de uma linha ao mesmo tempo, caso mais de uma linha obedeça a
determinada condição. As condições podem também ser representadas utilizando os
operadores: AND,OR e NOT.S

25
O comando UPDATE, contém a cláusula WHERE, de forma a restringir o conjunto dos
registros que serão processados pelo comando. Se não for colocada a cláusula WHERE no
comando UPDATE, as alterações serão realizadas em todos os registros da tabela.

UPDATE NOME DA TABELA SET coluna1 = valor1, coluna2 = valor2

WHERE condições

1.16. COMANDO DELETE

O comando DELETE é usado para remover linhas de uma tabela. Este comando pode remover
mais de uma linha ao mesmo tempo, caso mais de uma linha obedeça a uma certa condição.
As condições podem ser representadas utilizando os operadores AND, OR e NOT.

O comando DELETE, contém a cláusula WHERE, de forma a restringir o conjunto dos

registros que serão processados pelo comando. Se não for colocada a cláusula WHERE no
comando DELETE, serão apagados todos os registros de uma tabela.
Assim como no comando UPDATE, podemos utilizar os operadores relacionais (>,>=,<,<=,
=, <>, like) e os operadores lógicos(AND, OR) para especificar as condições de exclusão de
dados.

1.17. COMANDO SELECT

O comando SELECT é usado para consultar o banco de dados e retornar dados recuperados
que satisfazem a determinada condição expressa no comando.

26
 CAPÍTULO 2
PROGRAMAS USADOS PARA O DESENVOLVIMENTO DO PROJECTO

27
 2.1 INTRODUÇÃO
Este capítulo discute os métodos, técnicas e linguagens usadas para resolver o problema em
questão. Serão abordados os componentes e ferramentas utilizados, as páginas que compõem
o sistema e seu funcionamento.

28
FERRAMENTAS UTILIZADAS
Para a consecução deste projeto, foram empregadas as seguintes ferramentas, linguagens e
tecnologias:

2.2 Visual code

O Visual Studio Code é um editor de código-fonte leve e altamente personalizável, desenvolvido

pela Microsoft. Ele é utilizado principalmente para desenvolvimento web, mas também suporta
outras linguagens de programação.

O Visual Studio Code é conhecido por sua interface de usuário intuitiva e fácil de usar, além de
sua ampla gama de extensões e plugins que podem ser adicionados para personalizar o ambiente
de desenvolvimento. Ele também possui recursos avançados, como depuração de código,
controle de versão integrado e um terminal integrado, o que o torna uma ferramenta poderosa
para desenvolvedores de todos os níveis de experiência. Por ser uma ferramenta de código aberto
e gratuita, o Visual Studio Code é uma opção popular entre desenvolvedores em todo o mundo

Figura 1 Exemplo– Visual code

2.3 HTML

HTML (HyperText Markup Language) é uma linguagem de marcação usada como componente
base na criação de páginas web. Com ela, é possível criar e estruturar o conteúdo de um site,
inserindo elementos como texto, imagens e vídeos.

Através da marcação de hipertexto, que consiste na conexão entre diferentes elementos, é

possível estabelecer uma rede de dados que permite a comunicação, armazenamento e
compartilhamento de informações. Em resumo, HTML é a linguagem que permite a construção
de websites e a inclusão de conteúdo interativo na internet.

Figura 2 Exemplo – HTML

29
2.4 CSS

Assim como o HTML, o CSS é uma linguagem de marcação utilizada para criar e estilizar
conteúdo na web. No entanto, ao contrário do HTML, o CSS é uma linguagem de estilo que é
usada para definir e aplicar estilos visuais a elementos específicos do documento HTML.

Em outras palavras, o CSS permite que os desenvolvedores da web criem regras de estilo que
determinam como os elementos HTML devem ser apresentados em um navegador da web.
Essas regras podem ser aplicadas a um único elemento ou a um grupo de elementos usando
seletores CSS.

Por exemplo, se um desenvolvedor deseja tornar o texto de todos os elementos <p> em uma
página HTML vermelho, ele pode usar o seguinte código CSS:

p { color: red; }

Isso diz ao navegador da web para selecionar todos os elementos <p> na página e definir a cor
do texto como vermelho. Essa é apenas uma das muitas maneiras pelas quais o CSS pode ser
usado para estilizar conteúdo da web de maneira seletiva e eficiente.

Figura 3 Exemplo – CSS

2.5 PHP

O PHP é uma linguagem de programação que pode ser usada para criar páginas da web
dinâmicas e interativas. Ele é interpretado pelo servidor, o que significa que o código PHP é
processado no servidor antes de ser enviado para o navegador do usuário.
Ao contrário de outras linguagens de programação, como C ou Perl, o PHP permite que o
HTML seja integrado diretamente no código. Isso significa que é possível escrever código PHP
que produzirá HTML dinamicamente. Por exemplo, em vez de escrever muitos comandos para
mostrar HTML, um programador PHP pode simplesmente escrever o código PHP que
produzirá o HTML necessário.

Por exemplo, se um programador quiser que sua página da web exiba a mensagem "Olá, eu sou
um script PHP!", eles podem escrever um código PHP simples que inclua essa mensagem
dentro do HTML da página. Quando a página é exibida no navegador, o servidor processa o
código PHP e envia o HTML resultante para o navegador, que exibe a página da web ao
usuário.

30
 Figura 4 – Exemplo php

2.6 JAVA SCRIPT

Java é uma linguagem de programação que permite a criação de aplicativos que podem ser
executados em diferentes sistemas operacionais e plataformas, devido à sua portabilidade. Ele
é usado em uma variedade de campos, incluindo desenvolvimento de jogos, aplicativos
empresariais e de desktop, aplicativos móveis, entre outros.

Por outro lado, JavaScript é uma linguagem de programação que é executada no navegador do
usuário, permitindo a criação de páginas da web interativas e dinâmicas. Ele é usado em
conjunto com outras tecnologias da web, como o HTML e o CSS, para criar experiências de
usuário mais ricas na web. JavaScript é uma das principais tecnologias da web, permitindo a
criação de sites e aplicativos da web modernos e interativos.

Figura 5 – Exemplo JAVA SCRIPT

2.7 REACT

React é uma biblioteca JavaScript de código aberto usada para construir interfaces de usuário
(UI). Ele foi desenvolvido pelo Facebook e é amplamente utilizado em todo o mundo por
desenvolvedores front-end para criar interfaces de usuário dinâmicas e interativas.

Algumas das principais características do React incluem:

Componentes: O React é baseado em componentes, que são blocos de construção reutilizáveis

para criar interfaces de usuário. Cada componente é responsável por renderizar uma parte da
interface do usuário e pode ser facilmente combinado com outros componentes.

Virtual DOM: O React usa uma árvore virtual DOM (Document Object Model) para
representar o estado atual da interface do usuário. Isso permite que o React atualize apenas as
partes da interface do usuário que foram alteradas, em vez de renderizar a página inteira
novamente, o que torna o React mais eficiente em termos de desempenho.

31
JSX: O React usa a sintaxe JSX (JavaScript XML) para criar elementos de interface do usuário.
Isso permite que os desenvolvedores escrevam código HTML e JavaScript juntos em um único
arquivo.

Fluxo unidirecional de dados: O React segue um padrão de fluxo de dados unidirecional, o que
significa que os dados fluem em uma única direção através dos componentes. Isso torna mais
fácil para os desenvolvedores rastrearem o fluxo de dados em sua aplicação.
Compatibilidade com outras bibliotecas e estruturas: O React pode ser facilmente integrado
com outras bibliotecas e estruturas, como o Redux, o Angular e o Vue.

No geral, o React é uma biblioteca popular para o desenvolvimento de interfaces de usuário de

alta qualidade e eficientes em termos de desempenho. Se você está interessado em desenvolver
interfaces de usuário usando JavaScript, o React é definitivamente uma biblioteca que vale a
pena aprender.

Figura 6 – Exemplo React

2.8 XAMPP

O XAMPP é um software que podemos instalar em nosso computador para simular um

servidor web. Com ele, podemos testar o desenvolvimento de páginas web dinâmicas, usando
a linguagem de programação PHP, sem precisar de um servidor web real na internet.

O XAMPP inclui o servidor web Apache, que é capaz de executar código em PHP e atuar como
um servidor de arquivos, e também suporta outros protocolos como FTP e HTTP. Além disso,
é comum utilizar o XAMPP em conjunto com o banco de dados MySQL, formando uma
poderosa ferramenta para desenvolvimento web.

Figura 7 – Exemplo XAMPP

32
2.9 MYSQL
O MySQL é um SGBD, que utiliza a linguagem SQL como interface. É atualmente um dos sistemas de
gerenciamento de bancos de dados mais populares da Oracle Corporation, com mais de 10 milhões
de instalações pelo mundo. A Wikipédia e Facebook são um exemplo de utilização do MySQL em sites
de grande audiência.

Figura 8 – Exemplo do MySQL

2.10 APACHE
O Apache é um programa que funciona como um servidor web, o que significa que ele é capaz
de armazenar e disponibilizar informações na internet. É como uma estante virtual que guarda
todos os livros, mas no caso do Apache, guarda as páginas da internet. Ele pode ser utilizado
localmente, ou seja, no nosso próprio computador, para testar as páginas que estamos
desenvolvendo antes de colocá-las na internet.

O Apache é muito útil para quem trabalha com desenvolvimento web, pois permite que sejam
testadas páginas dinâmicas, que são aquelas que apresentam conteúdo que pode ser atualizado
constantemente, como uma rede social, por exemplo. O Apache é capaz de executar códigos
em PHP, que é uma linguagem de programação muito utilizada para desenvolvimento de
páginas web, e pode ser utilizado como servidor FTP, HTTP, entre outros. Geralmente, o
Apache é utilizado em conjunto com o PHP e o banco de dados MySQL para criar sites
dinâmicos e interativos.

Figura 9 – Exemplo do Apache

2.11 Node.js
O Node.js é uma plataforma de desenvolvimento de software de código aberto baseada no
motor JavaScript V8 do Google Chrome. Ele permite que os desenvolvedores usem JavaScript
tanto no lado do cliente quanto no lado do servidor para construir aplicativos de rede escaláveis,
eficientes e rápidos.

Algumas das principais características do Node.js:

33
Capacidade de lidar com E/S assíncrona: O Node.js foi projetado para lidar com operações
de entrada e saída assíncronas de forma eficiente, o que o torna ideal para construir aplicativos
de rede escaláveis e de alto desempenho.

Módulos: O Node.js suporta um sistema de módulos que permite que os desenvolvedores criem
aplicativos modulares e reutilizáveis. Os módulos são unidades independentes de código que
podem ser facilmente integrados em um aplicativo Node.js.

Escalabilidade: O Node.js é altamente escalável e pode lidar com um grande número de

solicitações simultâneas. Ele usa um modelo de E/S assíncrono e não bloqueante, o que o torna
adequado para aplicativos de rede que precisam lidar com um grande volume de tráfego.

Comunidade ativa: O Node.js tem uma comunidade ativa de desenvolvedores que contribuem
com bibliotecas, ferramentas e documentação para a plataforma.

Cross-platform: O Node.js é uma plataforma multiplataforma que pode ser executada em

sistemas operacionais Windows, Mac OS X e Linux.

O Node.js é frequentemente usado para construir aplicativos web, API's e microserviços, além
de ferramentas de linha de comando e outras aplicações de rede. Se você está interessado em
desenvolver aplicativos de rede usando JavaScript, o Node.js é definitivamente uma plataforma
que vale a pena aprender.

Figura 10 – Exemplo Node.js

2.12 BROWSER

Um Browser, também conhecido como Navegador, é um programa de computador criado para

permitir a navegação pela internet. Ele é o responsável por tornar possível o acesso a sites e
serviços disponíveis na rede mundial de computadores.

O Browser é capaz de processar diversas linguagens de programação, como HTML, ASP e

PHP. Essas linguagens são hospedadas em servidores de internet e ficam disponíveis para
serem acessadas e transformadas em linguagem comum e imagens pelo navegador. Dessa
forma, o Browser atua como uma espécie de intermediário entre o usuário e os servidores de
internet, permitindo a visualização e interação com os conteúdos disponíveis na web.

34
 Figura 11 – Exemplo Chrome
2.13 MATERIAL DESIGN
Material Design é um estilo de design visual desenvolvido pela Google em 2014 para suas
plataformas digitais. O objetivo do Material Design é criar uma experiência de usuário mais
coesa, intuitiva e agradável, através de uma linguagem de design comum em todos os seus
aplicativos e dispositivos. Ele é baseado em princípios de design como movimento,
profundidade e cor, que juntos fornecem um visual moderno e funcional para o usuário final.

O Material Design é amplamente utilizado em aplicativos Android, mas também é aplicado em

outras plataformas, como iOS e web design. Ele se concentra em uma abordagem minimalista,
mas sofisticada, que permite uma maior clareza e legibilidade. O Material Design é
frequentemente atualizado para se adaptar às novas tendências de design, mantendo a
consistência entre todos os aplicativos e plataformas.

Figura 12 – Exemplo MATERIAL DESIGN

2.13 Photoshop

E um software de edição de imagens desenvolvido pela Adobe Systems. É amplamente

utilizado por fotógrafos, designers gráficos e profissionais de criação de conteúdo para editar
e manipular imagens digitais. O Photoshop permite que os usuários criem e editem imagens
em várias camadas, ajustem a cor, a iluminação e a exposição, adicionem efeitos especiais,
removam elementos indesejados das imagens, entre outras funcionalidades avançadas de
edição de imagens.

Figura 13 – Exemplo Photoshop

35
 APRESENTAÇÃO DO SISTEMA

É apresentado o funcionamento do sistema desenvolvido, que começa com a tela de cadastro

para o administrador. Essa funcionalidade permite que o administrador do sistema cadastre o
instituto com o perfil de acesso e permissões definidos por ele. Esse processo envolve o
preenchimento de um formulário com informações como nome e senha de acesso.

Tela De Cadastro

É uma interface que permite aos usuários inserir informações e dados em um sistema

Figura 14 - Página de Cadastro

Tela De Login
A página de login é o ponto de entrada para o painel administrativo e tem como objetivo
controlar o acesso ao sistema, garantindo que apenas usuários autorizados possam utilizá-lo.

Figura 15- Tela De Login

36
Painel Principal

Essa página do sistema apresenta uma visão geral detalhada do mesmo, exibindo informações
como estudantes, classes, cursos, disciplinas, professores, além de mostrar quantidades
cadastradas e outras informações relevantes.

Figura 16 – Página principal do painel administrativo

Painel de Contas(usuários)

O Painel de Contas é a área do sistema que permite a criação, gerenciamento e controle de

contas de usuário. Por meio dele, é possível definir permissões de acesso, alterar senhas,
adicionar ou remover usuários. É uma ferramenta fundamental para garantir a segurança e a
integridade dos dados do sistema.

Figura 17 – Página Contas(usuários)

37
Painel de cadastro de classes(ano curricular )

O Painel de Classes é a página do sistema que permite o gerenciamento dos anos curriculares
de uma instituição de ensino. Nessa página é possível cadastrar como nome da turma.

Figura 18 –Painel de classes (ano curricular )

Painel de cadastro de Cursos

Este é o painel onde é possível cadastrar novos cursos.

Figura 19 – Painel de Cursos

38
Painel de cadastro de Disciplinas
Este é o painel onde é possível cadastrar as disciplinas no sistema.

Figura 20 – Painel de Disciplinas

Painel de cadastro de Turmas
Este é o painel onde é possível cadastrar e gerenciar as turmas disponíveis no sistema.

Figura 21 – Painel de Turmas

39
 Painel de cadastro de Professores
Este é o painel de cadastro de professores, onde é possível adicionar informações detalhadas
sobre os professores da instituição, como nome completo, especialização, disciplinas
lecionadas entre outras informações relevantes. Através deste painel, é possível gerenciar de
forma eficiente o quadro de professores da instituição, garantindo uma melhor organização e
controle das informações.

Figura 22 – Painel de cadastro de Professores

Painel de Matriculas
O painel de matrículas é uma página do sistema que permite que os estudantes se matriculem
em cursos, disciplinas e classes específicas. É uma ferramenta importante para a administração
acadêmica, pois permite o gerenciamento de informações sobre o número de alunos
matriculados em cada curso e disciplina, além de possibilitar a emissão de relatórios e a
realização de outras tarefas administrativas relacionadas à matrícula.

Figura 23 – Painel de Matriculas

40
Painel de Propinas
É uma ferramenta utilizada em instituições de ensino para gerenciar o pagamento de taxas e
mensalidades escolares. Ele permite aos usuários verificarem o status de suas propinas, datas
de vencimento, valores e outras informações importantes relacionadas ao pagamento. Além
disso, o Painel de Propinas pode ser usado pelos administradores da instituição para gerenciar
e registrar os pagamentos recebidos, controlar inadimplências e gerar relatórios financeiros.

Figura 24 – Painel de Propinas

Painel de Reconfirmações dos estudantes

É uma forma de garantir a precisão dos dados e manter o controle sobre os alunos que estão
ativos no sistema. Essa funcionalidade pode ser especialmente útil em instituições com grande
número de alunos e que precisam lidar com atualizações frequentes de informações cadastrais.

Figura 25 – Painel de Reconfirmações dos Estudantes

41
Painel de Outros Pagamentos

O Painel de Outros Pagamentos é uma área no sistema que permite o registro e controle de
pagamentos que não se enquadram na categoria de matrículas ou propinas, como por exemplo,
pagamento de faltas, provas, entre outros. É um espaço que facilita a organização financeira
permitindo a gestão eficiente desses pagamentos.

Figura 26 – Painel de Outros Pagamentos

42
 CONCLUSÃO
Este projeto de desenvolvimento de um sistema de gestão baseado na tecnologia web para o
Instituto Médio de Saúde Ndumbalundo é de extrema importância para a instituição, pois irá
automatizar todo o processo administrativo, desde as matrículas até o pagamento de propinas,
armazenando todas as informações em uma base de dados segura e acessível. A implementação
do sistema foi facilitada pelo uso de tecnologias de ponta, como HTML, CSS, React, PHP,
JavaScript e MySQL, o que permitiu a criação de uma interface amigável e de fácil utilização
para os usuários. Com isso, fica evidente a necessidade de um sistema de gestão eficiente para
o setor administrativo da instituição e a importância do investimento em tecnologia para
aprimorar os processos e garantir a eficiência na gestão.

43
 RECOMENDAÇÃO

É altamente recomendável que o Instituto Médio de Saúde Ndumbalundo utilize este projeto
como uma ferramenta valiosa em seu setor administrativo, automatizando todo o processo
desde a matrícula até o pagamento de propinas. Com a capacidade de armazenar todas as
informações em uma base de dados segura e acessível, o projeto trará maior eficiência e
segurança aos dados da instituição. Portanto, não hesite em adotar esta

44
 REFERÊNCIAS BIBLIOGRÁFICAS

https://biblioteconomiadigital.com.br/2017/12/bases-de-dados-conceito-classificacoes.html

https://pt.wikipedia.org/wiki/Banco_de_dados

Acesso em: 20 de Fevereiro de 2023.

https://www.proesc.com/blog/gestao-escolar/
https://www.connectescolas.com.br/blog/principais-conceitos-de-gestao-escolar
Acesso em: 2 de Março de 2023
https://en.wikipedia.org/wiki/Visual_Studio_Code
https://www.google.com/search?q=xampp&sxsrf=APwXEddrBwyUMwrk2hICz2gALeCXkl
_AFA%3A1681063434452&ei=Cv4yZO-
HG4Wi5NoPt4GIyAU&oq=xamp&gs_lcp=Cgxnd3Mtd2l6LXNlcnAQARgAMgQIIxAnMg
QIIxAnMgQIIxAnMgUIABCABDIFCAAQgAQyBQgAEIAEMgUIABCABDIFCAAQgA
QyBwgAEIAEEAoyBQgAEIAEOgsIABCKBRCxAxCDAToLCAAQgAQQsQMQgwE6C
wguEIAEEMcBEK8BOgsILhCKBRCxAxCDAToICAAQgAQQsQM6CwguEIAEELEDEI
MBOgsILhCDARCxAxCABDoFCC4QgAQ6CwguEIAEEMcBENEDSgQIQRgAUABYng
dgyx5oAHABeACAAYEKiAGVH5IBBzUtMS4xLjKYAQCgAQHAAQE&sclient=gws-
wiz-serp
https://pt.wikipedia.org/wiki/PHP
https://pt.wikipedia.org/wiki/Node.js
Acesso em: 10 de Março de 2023
https://www.google.com/search?q=node+js&oq=node+js&aqs=chrome..69i57j0i512l9.4180j
0j4&sourceid=chrome&ie=UTF-8
https://en.wikipedia.org/wiki/React_(software)
https://tecnoblog.net/responde/o-que-e-um-browser/
Acesso em: 15 de março de 2023.

https://developer.mozilla.org/pt-BR/docs/Web/HTML
https://blog.betrybe.com/css/

Acesso em: 01 de Abril de 2023.

45
 ANEXOS

Figura 27 - Tela principal do Visual code

Figura 28 - Tela Principal do phpMyAdmim

Figura 29 - Tela principal do Photoshop

46