Escola Básica e Secundária de Salvaterra de Magos RELATÓRIO CRÍTICO Prova de Aptidão Profissional Daniel Pereira Nº 4 Rui França Nº 14 Curso Profissional de Gestão e Programação de Sistemas Informáticos 12º H Salvaterra de Magos Junho de 2018
Escola Básica e Secundária de Salvaterra de Magos Daniel Pereira Nº 4 Rui França Nº 14 Curso Profissional de Programação e Gestão de Sistemas Informáticos 12º H SUMÁRIO Relatório das atividades do projeto PontoCar desenvolvido como requisito parcial dos módulos curriculares, supervisionado pelos Prof. José Nunes, António Andrade e Sónia Santos, no curso Profissional de Gestão e Programação de Sistemas Informáticos. Salvaterra de Magos Junho de 2018
Índice Conteúdo Introdução...4 Pesquisa...5 Planeamento do Website...5 Anteprojeto...5 Desenvolvimento...6 Programas utilizados...6 Linguagens de Programação...6 Desenvolvimento do Back Office...7 3
Introdução Este relatório reflete o trabalho desenvolvido no nosso site intitulado PontoCar. Tivémos várias ideias para desenvolver o nosso projeto, primeiramente pensámos em fazer um stand automóvel mas mais tarde refizemos tudo do zero e começámos por fazer um projeto idêntico ao OLX, mas só para carros. Este site permitirá ao cliente fazer pesquisas sobre o carro pretendido, poderá também pesquisar pelo ano do carro, quilómetros, combustível, modelo, visto que é um website de carros usados. O cliente que se registar no site poderá colocar os seus anúncios, as respetivas imagens do carro e as características do mesmo. Nesse mesmo anúncio haverá o respetivo número de telemovél ou e-mail para outra pessoa entrar em contacto com o responsável da publicação. 4
Pesquisa De início, fizemos uma série de pesquisas sobre vários websites relacionados com a nossa proposta de projeto, uma pesquisa sobre bons e maus exemplos relacionados com o tema. Planeamento do Website Ao acabarmos as pesquisas, começámos a planear o nosso projeto. No início, pensámos fazer um website idêntico ao StandVirtual, mas devido às dificuldades decidimos fazer um projeto mais acessível para os nossos conhecimentos. Como segunda hipótese e escolhida, optámos por fazer um website idêntico com o OLX mas sempre pesquisando em outros sites outras informações e ideias para fazermos o nosso. Anteprojeto O anteprojeto foi um documento elaborado com o intuito de ser aprovado em Conselho Pedagógico do Agrupamento, como pré-requisito para a Prova de Aptidão Profissional. Neste documento é anunciado o tema, uma descrição sumária e os objetivos a alcançar na realização do projeto. 5
Desenvolvimento Programas utilizados Para esta prova de aptidão profissional utilizei vários programas que foram lecionados no decorrer do curso, designadamente: Adobe Photoshop é um software desenvolvido para a edição de imagem, criação de logótipos, correções fotográficas, etc. Linguagens de Programação PHP, é uma linguagem de programação aberta destinada ao desenvolvimento de páginas de internet. CSS, é uma linguagem para definir o estilo (cores, fontes, fundos, espaçamentos, etc.) que definem a apresentação de documentos escritos numa linguagem de marcação, como HTML, XML e PHP. Bootstrap, é uma framework front-end que facilita os programadores de criar páginas na internet, cuja principal vantagem é poder adaptar-se a qualquer dispositivo sem necessidade de efetuar ajustes específicos e que possui uma diversidade de componentes. JavaScript, é uma linguagem de programação em script com orientação a objetos. Html, é uma linguagem de que permite criar páginas web. 6
Desenvolvimento do Back Office Para começar fui pesquisar um template grátis na internet, onde já trazia tabelas, contas de utilizadores, gráficos, etc. A partir desse momento criei o meu login para iniciar sessão no back office com ligação à base de dados. Imagem 1 - Login Imagem 2 - Código com ligação à base dados 7
Após o início de sessão entrei na parte dos vendedores onde aparece o nome, email, morada, código postal, nível de administrador ou vendedor e as acções onde faço a manipulação de dados. Quando clico no ícone azul permite-me editar as informações do vendedor e no caso de clicar no ícone de eliminar apaga uma linha ou seja esse vendedor perdeu a sua conta. Imagem 3 - Tabela de vendedores Imagem 4 - Atualizar informação 8
Na parte dos anúncios podemos aceitar ou não as publicações dos vendedores no website e publicar no front office. Ao clicar no ícone azul de confirmação autoriza a publicação do anúncio no website ou se clicar no ícone vermelho o anúncio não vai ser publicado. Imagem 5 - Tabela de anúncios 9
Na parte do perfil de admin consigo mudar as minhas definições pessoais com ligação à base de dados e com isso alterar o início de sessão. Imagem 6 - Perfil de Admin 10
Na sidebar tenho acesso à home, vendedores, anúncios, marcas, modelos, marcas e modelos. Nas square box posso ver as marcas, anúncios e utilizadores com a ligação à base de dados. Também existe um gráfico de barras de todos os meses que aumenta conforme os anúncios publicados no front office. Imagem 7 - Index do Back Office 11
Na tabela de marcas existe o sub menu com a lista de marcas e adicionar nova marca. Na parte da lista de marcas podemos modificar a marca do carro no ícone azul ou até eliminar o carro no ícone vermelho com a respectiva ligação à base de dados. No adicionar nova marca temos acesso a criar uma nova marca com permissão para guardar na base de dados. Imagem 8- Tabela de marcas Imagem 9 - Adicionar nova marca 12
Na tabela de modelos existe o sub menu com a lista de modelos e adicionar novo modelo. Na parte da lista de modelos podemos modificar o modelo do carro no ícone azul ou até eliminar o carro no ícone vermelho com a respectiva ligação à base de dados. No adicionar novo modelo temos acesso a criar um novo modelo com permissão para guardar na base de dados. Imagem 10 - Adicionar modelos Imagem 11 - Tabela de modelos 13
Na tabela de modelos_marcas existe o sub menu com a lista de modelos_marcas e adicionar a lista. Na parte da lista podemos modificar a marca e o modelo do carro, no ícone vermelho permite a eliminação da linha com a respectiva ligação à base de dados. A opção adicionar novo modelo e marca permite adicionar a respectiva marca com o modelo na combobox. Imagem 12 - Tabela de modelos e marcas Imagem 13 - Adicionar modelo e marca 14
No front office que é a página principal do website onde o público vê os carros em destaque ou os anúncios, pode adicionar anúncios e ver os contactos. Imagem 14 - Página inicial do front office Imagem 15 - Destaques 15
Nos contactos podemos observar a localização onde foi realizado o projecto final de curso, a morada e o telefone. Imagem 16 - Contactos 16
No registo temos acesso para criar uma conta pessoal com os respectivos campos: nome, email, morada, código postal e palavra passe. Quando o vendedor se regista vai ser redireccionado automaticamente para a parte de login e com isso a sua informação vai ser vista pelo admin na tabela de vendedores. Imagem 17 - Registo Imagem 18 - Login 17
No inserir anúncio um vendedor pode preencher os respectivos campos como a marca, modelo, preço, quilómetros, combustível, ano, observação e escolher a fotografia do carro. Ao clicar no botão enviar o anúncio é redireccionado para a página de anúncios onde podemos ver o carro colocado à venda. Imagem 19 - Inserir anúncio 18
Na parte dos anúncios no front office conseguimos ver todos os anúncios colocados à venda pelos utilizadores e pesquisar pelo modelo do carro. Imagem 20 - Anúncios 19
No mysql temos acesso a visualizar a ligação à base de dados. Imagem 21 - Ligação das Tabelas 20
Coclusão O meu projeto consistiu num website fictício, para conseguir concluir este projeto foi preciso ter uma grande capacidade de autonomia e persistência, aspetos esses que se foram desenvolvendo à medida que o concebia, planeava e executava. Apesar de todas as dificuldades considero que o produto final superou as minhas expetativas. No fim de concluir este projeto, reparei que tive bastantes dificuldades na realização mas consegui superar e foi um trabalho bastante positivo. 21
Webgrafia https://www.w3schools.com/ https://pt.stackoverflow.com/ https://www.youtube.com/watch?v=arqv2yvp_3e https://www.youtube.com/watch?v=ipa9xas_ntg https://developers.google.com/chart/ http://php.net/ 22