TPG
1 daGuarc1a
Po}ytechnic o F Gua I(ta
RELATÓRIO DE ESTÁGIO
Licenciatura em Comunicação Multimédia
Ricardo da Costa Coutinho setembro 2016
Escola Superior de Educação, Comunicação e Desporto
Instituto Politécnico da Guarda
RELATÓRIO DE ESTÁGIO
RICARDO DA COSTA COUTINHO
RELATÓRIO PARA A OBTENÇÃO DO GRAU DE LICENCIADO EM COMUNICAÇÃO MULTIMÉDIA
i
FICHA DE IDENTIFICAÇÃO
Nome: Ricardo da Costa Coutinho Nº de aluno: 5007468
Escola: Escola Superior de Educação, Comunicação e Desporto Grau: Licenciatura em Comunicação Multimédia
Professor Orientador: Carlos José Gonçalves Brigas
Organização: Dom Digital - Novas Tecnologias de Informação, Lda.
Morada: Avenida Rainha Dona Amélia, 142 Cave 6300 - 749 Guarda, Portugal Telefone: 271 224 509
Website: http://www.domdigital.pt
Supervisor na Organização: Micael Alvané Costa Grau Académico: Licenciatura
Início do estágio: 1 de Julho de 2016 Fim do estágio: 30 de Setembro de 2016
ii
AGRADECIMENTOS
Em primeiro lugar, agradecer ao Instituto Politécnico da Guarda e à Escola Superior de Educação, Comunicação e Desporto, pela contribuição na minha formação académica. A todos os docentes e colegas de Comunicação Multimédia, em especial ao professor Carlos Brigas por ter sido orientador do meu estágio e pela sua disponibilidade na elaboração do relatório de estágio.
A todos os elementos da Dom Digital que me receberam de forma fantástica e desde cedo me fizeram sentir em casa, parte da equipa e também evoluir como pessoa e como profissional, em especial ao António Gil por ter acreditado em mim e ter aceitado o meu estágio na empresa, e ao Micael Costa por ter sido um excelente orientador, ter ensinado imenso e por querer sempre retirar o melhor de mim para que eu seja cada vez melhor.
A toda a minha família, em especial aos meus pais, que sempre apoiaram as minhas decisões em relação ao percurso académico e que sempre deram todas as condições para ter uma boa formação académica.
À minha namorada Ana Tavares pela sua paciência, pelo seu apoio e por ser uma pessoa incrível que mesmo à distância esteve sempre ao meu lado nos bons e nos maus momentos.
iii
RESUMO
Durante o período do estágio curricular na Dom Digital trabalhei em diferentes projetos sempre com o objetivo de aprender e aprofundar os meus conhecimentos em Salesforce, em front end developer, e conhecer os produtos da empresa.
O foco do estágio foi sempre a área da web como front end developer, o desenvolvimento na cloud, o desenvolvimento de componentes e a utilização das mais recentes tecnologias e linguagens web.
Todos os objetivos propostos pela empresa no início do estágio foram atingidos com sucesso, terminei o estágio com um maior conhecimento das principais linguagens web, foram-me introduzidas novas linguagens, realizei trabalhos com recurso a novas plataformas, e foram aplicados os conhecimentos adquiridos em projetos de contexto real.
PALAVRAS-CHAVE
Dom Digital, Serviços de Internet, Cloud Computing, Salesforce, Front-End Development.
iv
ÍNDICE GERAL
FICHA DE IDENTIFICAÇÃO... i AGRADECIMENTOS ... ii RESUMO ... iii ÍNDICE DE FIGURAS ... viLISTA DE SIGLAS E ACRÓNIMOS ... viii
GLOSSÁRIO DE TERMOS TÉCNICOS ... ix
INTRODUÇÃO ... 1
CAPÍTULO 1 | A DOM DIGITAL ... 3
1 A EMPRESA ... 4 1.1 ESTRUTURA ... 5 1.2 ESTRATÉGIA DE COMUNICAÇÃO ... 6 1.2.1 COMUNICAÇÃO INTERNA ... 7 1.2.2 COMUNICAÇÃO EXTERNA ... 8 1.3 PARCEIROS ... 9 1.4 PRODUTOS ... 10 1.4.1 ARDINA.COM ... 10 1.4.2 DOM HOTEL ... 11 1.4.3 SOL GLOBAL ... 12 1.4.4 DEAL MORE ... 13 CAPÍTULO 2 | O ESTÁGIO ... 15 2 PLANO DE ESTÁGIO ... 16 2.1 OBJETIVOS... 16 2.2 METODOLOGIA ... 17 2.2.1 PLANEAMENTO SEMANAL ... 18
v
2.2.3 LINGUAGENS DE PROGRAMAÇÃO E BIBLIOTECAS ... 21
2.3 ENQUADRAMENTO TEÓRICO ... 23
2.3.1 FRONT END DEVELOPMENT ... 23
2.3.2 WEB DESIGN ... 24
2.3.3 SALESFORCE ... 24
2.3.4 LIGHTNING COMPONENTS ... 28
2.3.5 REPOSITÓRIOS GIT ... 34
2.4 TRABALHO DESENVOLVIDO ... 38
2.4.1 ARDINA PRESS HELP ... 38
2.4.2 DOM HOTEL RESPONSIVE ... 40
2.4.3 RTP NOTIFICATIONS CENTER ... 43
2.4.4 ARDINA PRESS LIGHTNING COMPONENTS DEMO ... 44
2.4.5 TESTE DE APLICAÇÕES MOBILE ... 48
2.4.6 NOVOS COMPONENTES ARDINA PRESS ... 50
REFLEXÃO FINAL ... 56
BIBLIOGRAFIA ... 58
ANEXOS ... 61
vi
ÍNDICE DE FIGURAS
Figura 1 - Logótipo Dom Digital ... 4
Figura 2 - Alguns dos clientes da Dom Digital ... 5
Figura 3 - Estrutura Dom Digital ... 6
Figura 4 - Blog Dom Digital ... 8
Figura 5 - Intervenção do SEO da Dom Digital na Create Tech ... 9
Figura 6 - Alguns dos parceiros da Dom Digital ... 10
Figura 7 - Logótipo ardina.com ... 10
Figura 8 - Logótipo Dom Hotel ... 11
Figura 9 - Logótipo Sol Global ... 12
Figura 10 - Logótipo Deal More ... 13
Figura 11 - Planeamento semanal no calendário da Google ... 20
Figura 12 - Clouds de Salesforce ... 25
Figura 13 - Sistema de armazenamento de dados do Salesforce ... 26
Figura 14 - Funcionamento dos Lightning Components ... 31
Figura 15 - Exemplo de ambiente de desenvolvimento de componentes. ... 31
Figura 16 - Esquema de sistema de controlo de versões distribuído ... 35
Figura 17 - Funcionamento do Git ... 36
Figura 18 - Os três estados dos ficheiros Git ... 37
Figura 19 - Planeamento Ardina Help ... 39
Figura 20 - Home Page Ardina Help... 39
Figura 21 - Home Page Ardina Help mobile ... 40
Figura 22 - Menu mobile (antes) ... 41
Figura 23 - Menu mobile fechado (depois) ... 41
Figura 24 - Menu mobile aberto (depois) ... 41
Figura 25 - Informação Dom Hotel mobile (antes) ... 42
Figura 26 - Informação Dom Hotel mobile (depois) ... 42
Figura 27 – Página de login do Notifications Center RTP... 43
Figura 28 - Área de envío de notificações do Notifications Center RTP ... 44
Figura 29 - Mensagem de sucesso do Notifications Center RTP... 44
Figura 30 - Aplicação ArdinaPress em Lightning Components ... 47
vii Figura 33 - Módulos do Page Builder ... 52 Figura 34 - Exemplo de layout de 3 colunas no site ... 53 Figura 35 - Criação de zonas ... 54
viii
LISTA DE SIGLAS E ACRÓNIMOS
CSS – Cascading Style SheetsGPS – Global Positioning System HTML – HyperText Markup Language RSS – Rich Site Summary
ix
GLOSSÁRIO DE TERMOS TÉCNICOS
Android – Sistema operativo desenvolvido pela Google para dispositivos móveis. Apex – Linguagem de programação desenvolvida para a plataforma “Force.com”
de Salesforce.
Aura – Framework para desenvolvimento de interfaces.
Back End Developer – Programador de camadas de dados não visíveis para o
utilizador final.
Back office – Camada de dados não visíveis para o utilizador final.
Backbone.JS – Biblioteca de Javascript para construção de aplicações web. Boleanos – Tipo de dados que possui dois valores, verdadeiro ou falso. Booking engine – Sistema gestão de marcação de quartos de hotel. Booking – Serviço de marcação de quartos e hotel.
Bootstrap – Framework de HTML e CSS. Bugs – Erros.
Chatter – Rede Social incorporada dentro do Salesforce.
Cloud Computing – Utilização de memória e capacidade de armazenamento de
computadores através da internet.
Dashboards – Painel de controlo. Demo – Demonstração.
Developer – Programador. Feed - Formato de dados. Framework – Estrutura.
Front End Developer – Programador de camadas visuais e de interação com o
utilizador.
Front end - Camada de apresentação.
Full Stack Front End Developer – É um programador que trabalha todo o tipo de
camadas e interfaces visuais.
GIT – É um sistema distribuído de controlador de versões. IOS - Sistema operativo desenvolvido pela Apple.
Inputs – Parâmetros de entrada.
Javascript – Linguagem de programação orientada a objetos. Jquery – Biblioteca de Javascript.
x
LESS – É um extensão da linguagem web CSS.
Lightning Components - Componentes desenvolvidos através da tecnologia
“Ligtning” de Salesforce.
Lightning – Ambiente moderno de Salesforce. Loop – Ciclo de dados.
Mass email – Envio de emails em massa.
Mercurial – É outro sistema distribuído de controlador de versões. Notification Center - Centro de notificações.
Objetos Standard – Objetos presentes no Salesforce por defeito. Page Builder - Construtor de páginas.
Reports – Relatórios.
SASS – É um extensão da linguagem web CSS.
Salesforce – Software de gestão e relacionamento com clientes através da cloud. Scripts – Conjunto de código desenvolvido através de uma linguagem de
programação.
Static Resources – Recursos estáticos. Stylesheets – Folhas de estilos.
Windows Phone – Sistema operativo desenvolvido pela Microsoft para
dispositivos móveis.
Open Source - Software que pode ser utilizado, alterado e partilhado por qualquer
1
INTRODUÇÃO
Este relatório foi elaborado no âmbito do estágio curricular desenvolvido para a obtenção do grau de licenciatura em Comunicação Multimédia da Escola Superior de Educação, Comunicação e Desporto do Instituto Politécnico da Guarda.
Embora no final do último semestre da licenciatura exista a opção de escolher projeto, sempre me pareceu uma melhor decisão escolher estágio, não só pela importante experiência profissional que é acrescentada ao currículo mas também pelo conhecimento que é adquirido do mercado de trabalho e da possibilidade de emprego.
Ao longo da licenciatura fui ficando cada vez mais próximo da área da web e fiquei bastante entusiasmado com todos os projetos que desenvolvi nas unidades curriculares que abordaram esta temática, e por esse motivo pareceu-me óbvio que seria a área onde iria estagiar, não só porque na minha opinião é muito importante fazermos aquilo de que gostamos mas também porque o estágio é o primeiro contacto com o mundo do trabalho e uma excelente oportunidade para percebermos aquilo que realmente queremos no nosso futuro profissional.
A escolha da entidade para realizar o estágio foi uma decisão tomada com alguma facilidade, apesar de já conhecer alguns dos serviços e projetos da Dom Digital, o primeiro contacto com a empresa em reunião com o seu responsável, António Gil, retirou todas as dúvidas que pudessem existir sobre se aquela seria a empresa ideal para mim ou não. De imediato percebi que seria uma empresa que me poderia ensinar bastante, que me poderia abrir novas portas para o meu futuro profissional, que teria projetos ambiciosos onde eu pudesse participar e por fim, mas não menos importante, é umas das melhores empresas de Portugal nesta área e fica localizada na minha cidade que foi algo que sempre procurei, investir no meu futuro profissional na cidade da Guarda.
O plano de estágio (Anexo I) foi elaborado em conjunto com o orientador de estágio e com o responsável da Dom Digital, visava estabelecer objetivos claros para mim enquanto estagiário e para empresa enquanto entidade que me orientou durante todo o estágio. Este plano de estágio começou por ser cumprido ainda antes do estágio começar através de uma formação em Salesforce cedida pela empresa, esta formação não só facilitou imenso o processo de integração como ajudou a cumprir com sucesso os objetivos do estágio.
2 Este relatório é composto por dois capítulos, no primeiro capítulo irei abordar a empresa, a sua estrutura, a sua metodologia de trabalho, os seus serviços e os seus produtos. O segundo capítulo será composto pelos objetivos do estágio e as estratégias que foram colocadas em prática para que os mesmos fossem atingidos e, por fim, o trabalho desenvolvido durante o estágio. No final do capítulo será feita uma reflexão final onde irei fazer a minha autoavaliação, e ainda relacionar o plano de estágio com o trabalho que foi desenvolvido.
3
4
1 A EMPRESA
Figura 1 - Logótipo Dom Digital
Fonte: Cedido pela Dom Digital
A Dom Digital - Novas Tecnologias de Informação Lda, é uma empresa de soluções para a internet fundada em 1997 na cidade da Guarda, a sua sede é na Avenida Rainha Dona Amélia, e tem ainda escritório na Avenida da Liberdade em Lisboa.
A empresa foca o seu negócio nas soluções na internet pois entende que as tecnologias da internet vão fazer cada vez mais parte da vida das empresas, e cria as soluções para os seus clientes com base em tecnologia fiável e que rentabilize ao máximo o valor dos seus negócios, tendo como foco os seguintes setores (Dom Digital, 2016):
Media: Soluções na cloud para monitorizar os conteúdos de jornais, rádios e/ou televisão.
Hotelaria e Turismo: Soluções na cloud para gestão hoteleira, com ferramentas de marketing digital, campanhas e booking.
Terceiro Setor: Soluções de gestão para organismos não lucrativos. Setor Automóvel: Soluções para controlo de negócios e fidelização de
clientes para concessionárias automóveis.
A carteira de clientes da Dom Digital não se restringe apenas a empresas de renome nacional. Procura constantemente alargar a sua abrangência de mercado e atrair cada vez mais clientes do estrangeiro onde tem feito uma aposta em mercados como o Espanhol, América do Sul e em África.
5 Figura 2 - Alguns dos clientes da Dom Digital
Fonte: Elaborado pelo estagiário
1.1 ESTRUTURA
Para Rezende (2008), a estrutura organizacional está relacionada com a formalização das responsabilidades, autoridades, comunicações e decisões das unidades organizacionais da entidade.
Existem diferentes tipos de organização estrutural, Costa, Souza e Fell (2012) referem quatros modelos de estruturas tradicionais:
Estrutura linear: Também conhecida como militar, é uma estrutura que destaca a questão da autoridade, da liderança com um controlo inflexível e totalmente limitado.
Estrutura funcional: Geralmente é aplicada em empresas de pequeno e média dimensão pela sua simplicidade na definição das tarefas e na hierarquia bem centralizada visando o autocontrolo.
Estrutura staff-and-line: Esta estrutura é como a linear, simples e de alta gerência forte e decisória, mas com um órgão diferente que serve de assessoria para facilitar os desfechos das decisões e ajudar a concluir os trabalhos com qualidade e eficiência.
Estrutura colegiada: Este tipo de estrutura é plural, ou seja, possui vários diretores com a mesma autoridade.
A estrutura hierárquica da Dom Digital que está representada na imagem (Figura 3), foi representada após análise de funcionamento da entidade e como os diversos departamentos interagiam e executavam os trabalhos, e enquadra-se no modelo de estrutura funcional acima referido, “Neste tipo de estrutura há a separação dos departamentos por funções dando ênfase à especialização” (Costa, Sousa e Fell, 2012).
6 Fazem parte da entidade treze funcionários, começando por António Gil e Susana Ribeiro que fazem toda a gestão da empresa, sendo que António Gil se foca mais em vender produtos e discutir assuntos técnicos com a sua equipa, e Susana Ribeiro foca-se mais na gestão estrutural da empresa.
Os restantes funcionários estão distribuídos pelos diferentes departamentos, sendo que Sofia Gil assume todas as tarefas relativas ao Marketing, Paulo Fonseca é o responsável pelo design de todos os produtos, Filipa Ferreira exerce um cargo administrativo na empresa, Carlos Pinto é consultor em Salesforce, Miguel Teixeira assume o cargo de Front End Developer e os restantes membros exercem funções de Back End Developers, sendo que Micael Costa é também CTO da empresa.
Figura 3 - Estrutura Dom Digital
Fonte: Elaborado pelo estagiário
1.2 ESTRATÉGIA DE COMUNICAÇÃO
Segundo Cahen (1990, p. 29), “a comunicação empresarial é uma atividade sistémica, de carácter estratégico, ligada aos mais altos escalões da empresa.”
CEO António Gil Susana Ribeiro Marketing Sofia Gil Administrativa Filipa Ferreira Designer Paulo Fonseca Front End Developer Miguel Teixeira Back End Developers Micael Costa (CTO) Tiago Alvané Jorge Antunes Samuel Alves Esmeralda Cardoso Carlos Chora Consultor Salesforce Carlos Pinto
7 Sendo a comunicação empresarial uma atividade estratégica, a Dom Digital aposta forte tanto a nível interno como externo, fazendo com que a imagem da empresa seja valorizada fora de portas, mas também a nível interno para facilitar o delineamento de estratégias.
Existem diferentes tipos de suporte que as empresas podem utilizar de forma a transmitir aquilo que pretendem a nível interno e/ou externo.
Cota (2007), refere aqueles, que segundo o autor, são os suportes fulcrais no departamento de comunicação de uma empresa:
Suporte escrito: Podem ser relatórios de reuniões, desdobráveis, panfletos, jornais internos, etc.
Comunicação oral: São entrevistas, conferências, reuniões, visitas à entidade, etc.
Comunicação audiovisual: São suportes como filmes, jornais televisivos ou teleconferências.
A Dom Digital considera bastante importante a comunicação e aposta de forma séria em todos os suportes descritos anteriormente.
1.2.1 COMUNICAÇÃO INTERNA
A comunicação interna da Dom Digital é bastante valorizada pela sua equipa, são feitas reuniões semanais regulares não só para atribuir tarefas mas para comunicar a situação em que se encontram os negócios (ou possíveis negócios), para discutir estratégias futuras e discutir as novas tecnologias. Estas reuniões semanais regulares aliadas a reuniões mais específicas para discutir outras temáticas ou outros projetos contribuem de forma decisiva para a comunicação oral entre os membros da equipa.
Apesar da importância da comunicação oral, a empresa valoriza também a escrita, o envio regular de emails para partilhar novidades e notícias importantes, a utilização de chats para uma comunicação mais rápida entre os departamentos são as principais metodologias aplicadas à comunicação escrita no seio da empresa.
A apresentação interativa com acesso a vídeo e/ou áudio de novos produtos e de novidades no mercado tecnológico representa a importância da comunicação audiovisual entre os elementos da equipa.
8
1.2.2 COMUNICAÇÃO EXTERNA
Segundo Torquato (2002), “a comunicação externa é a comunicação responsável pelo posicionamento e pela imagem da organização na sociedade”.
Desde cedo (1996), a Dom Digital apostou na internet para publicitar e comunicar com potenciais clientes e com a comunidade em geral posicionando a imagem da empresa um pouco por todo o mundo. Nesta altura eram lançadas notas de imprensa com as principais atividades e parcerias da empresa, esta metodologia foi evoluindo com o tempo e nos dias de hoje a empresa possui um blog (Figura 4) onde partilha o lançamento de produtos, noticias e eventos relacionados com a empresa. Este é o principal meio de comunicação escrita da empresa., no entanto a empresa aposta também nas redes sociais para divulgação do trabalho e interação com os seguidores e interessados nos seus trabalhos, assim como o email para comunicar com clientes.
Figura 4 - Blog Dom Digital
Fonte: retirado de www.blog.domdigital.pt
A participação em eventos (Figura 5), conferências e encontros é também bastante valorizado pela empresa, este tipo de ações revelam-se uma excelente forma de divulgação da empresa e são utilizados como forma de comunicação oral, onde é possível a interação dos profissionais da Dom Digital com potenciais clientes, estudantes e funcionários de outras empresas.
9 Figura 5 - Intervenção do SEO da Dom Digital na Create Tech
Fonte: retirado de www.blog.domdigital.pt
As conferências via Skype com potenciais clientes são o principal meio de comunicação audiovisual, através destas conferências é possível a empresa apresentar os seus produtos em tempo real, tentar vender os seus serviços e comunicar com diferentes comunidades de todas as partes do mundo.
1.3 PARCEIROS
Dos diversos parceiros da Dom Digital podemos destacar Salesforce.
A Salesforce é atualmente o principal parceiro tecnológico da Dom Digital, tendo este sido o seu primeiro parceiro em Portugal (desde 2003), e tem focado o seu core de negócio no desenvolvimento de aplicações na cloud através desta plataforma.
De destacar ainda os diversos protocolos com entidades do ensino superior e parcerias com associações empresariais.
10 Figura 6 - Alguns dos parceiros da Dom Digital
Fonte: Elaborado pelo estagiário
1.4 PRODUTOS
Para além de todos os serviços personalizados que a Dom Digital oferece a todos os seus clientes, a empresa desenvolveu produtos genéricos que são passíveis de serem personalizados de acordo com as especificidades do cliente. Estes produtos estão em constante atualização para responder às exigências do mercado e às evoluções tecnológicas.
1.4.1 ARDINA.COM
Figura 7 - Logótipo ardina.com
Fonte: Cedido pela Dom Digital
Ardina é uma plataforma de gestão de conteúdos baseado na cloud (Dom Digital, 2016) e é composta por:
Ardina Press: Gestor de conteúdos multimédia.
Ardina Capture: Aplicação para smartphone que permite produzir conteúdos em tempo real.
Ardina Catalogue: Aplicação que permite aumentar a visibilidade dos conteúdos dentro da aplicação e nos motores de pesquisa.
11 Ardina Digital: Permite distribuir os conteúdos em qualquer interface ou
plataforma.
Ardina Kiosk: Aplicação que permite distribuir e vender conteúdos em várias plataformas.
Ardina Customer: Aplicação que permite conhecer melhor a audiência da empresa, comunicar e fidelizar essa mesma audiência.
1.4.2 DOM HOTEL
Figura 8 - Logótipo Dom Hotel
Fonte: Cedido pela Dom Digital
O Dom Hotel é uma plataforma a funcionar na cloud (Dom Hotel, 2016) que permite fazer gestão hoteleira através de vários dispositivos.
Esta plataforma permite fazer toda a gestão hoteleira de um ou vários hotéis, contém ferramentas de marketing digital para aumentar a visibilidade junto dos clientes e tem ainda um sistema de booking multiplataformas.
O Dom Hotel é um produto que não só facilita o processo de reservas aos hóspedes mas facilita também o trabalho a todos os funcionários do hotel, seja o diretor financeiro, o diretor de vendas ou o informático, todos os envolvidos veem as suas tarefas diárias facilitadas e a sua produtividade aumentada.
Características:
Multi-hotel: Todas as propriedades num único sítio. Multi-tipologia: Várias tipologias de quartos.
Multi-serviços: Vários tipos de serviços (ex: spas, ginásios, restaurantes, vouchers,
etc).
Multi-perfil: A informação relevante para cada função. Diferentes regras de acesso
à informação de acordo com hierarquia definida.
Multi-linguagem: Cinco linguagens (EN, FR, ES, DE, PT), tanto no back office
como no booking engine.
12
Multi-loja: Permite aos hóspedes reservar em poucos cliques, desde o seu
computador, tablet, telemóvel ou desde o Facebook de forma segura e com confirmação imediata.
Envio de alertas por email, SMS ou push no telemóvel: Os colaboradores são
alertados por múltiplos meios com tarefas ou lembretes de assuntos importantes.
Chatter: Rede social interna da empresa para que toda a equipa esteja em total
sincronia em tempo real. O chatter permite partilhar novas promoções, novidades, etc.
Analytics: Criação de relatórios e painéis sobre todas as áreas de negócio do hotel.
Estes apresentam sempre dados em tempo real e podem ser acedidos em qualquer lugar, desde qualquer dispositivo.
Gestão de agendas e tarefas: Um sítio onde todas as agendas e todas as tarefas da
empresa estão centralizadas e acessíveis desde o smartphone ou tablet.
Gestão de documentos: Catalogação de documentos dos hotéis.
Descontos e social promotions: Descontos e campanhas promocionais que são
divulgadas automaticamente nas redes sociais ou através de mass email.
Descontos para grupos: Descontos exclusivos para determinados grupos de
clientes (ex: parceiros, agências de viagem, clientes com cartão de fidelização).
Múltiplas formas de comunicar com o cliente: Envio de emails diretamente da
ficha do cliente. Envio de email automáticos sempre que haja datas importantes para o cliente (ex: aniversário).
Perfil social do cliente: Permitir conhecer os gostos dos clientes sem qualquer
trabalho de investigação.
1.4.3 SOL GLOBAL
Figura 9 - Logótipo Sol Global
Fonte: Cedido pela Dom Digital
O Sol Global é uma solução de gestão na cloud que permite gerir campanhas de angariação de fundos, controlar e dinamizar donativos, criar petições, gerir o processo de
13 recrutamentos, contém ferramentas de integração com websites, e-commerce, redes sociais e instrumentos financeiros (Dom Digital, 2016).
Funcionalidades do Sol Global:
Gestão de campanhas: Cria facilmente campanhas de angariação de fundos em
multiplataforma, no website ou na página de facebook.
Gestão de donativos: Controla e dinamiza os donativos através de débitos diretos,
cartões de créditos, multibanco, em tablets, smartphones ou computador.
Gestão de petições: Criação de petições em poucos cliques, com validações
automáticas, possibilidade de envio através de email e ferramentas de partilha nas redes sociais.
Gestão de recrutamento: Gestão de todo o processo de recrutamento num só sítio
através de criação de vagas de emprego ou voluntariado, formulário para receção de candidaturas integrados no website e no facebook e gestão de candidatos, candidaturas e avaliação de desempenho.
Integração com site: Integração em poucos cliques com o website da organização,
podem ser adicionadas novas áreas para inscrição de novos associados, colaboradores, voluntários, assinatura de petições ou donativos.
Instrumentos financeiros: Criação de ficheiros em formato compatível para ser
descarregado no website das finanças, e ferramentas de gestão e controlo de recibos emitidos pela organização.
Ecommerce: Loja online e mobile onde são geridos os produtos com catalogação,
serviços de pesquisa com filtros de informação e ferramentas de SEO para uma máxima visibilidade dos produtos.
1.4.4 DEAL MORE
Figura 10 - Logótipo Deal More
14 Este produto foi desenvolvido para o setor automóvel e permite a gestão do negócio através de um smartphone (Dom Digital, 2016).
O Deal More oferece ferramentas que ajudam a aumentar a visibilidade do concessionário online, aumentar os pedidos de test drive e comunicar de forma eficaz com clientes.
Principais funcionalidades Deal More:
Acompanhamento do cliente: Permite o acompanhamento de todo o processo dos
clientes, desde a fase de angariação, processo negocial até à fase de gestão do cliente.
Layout intuitivo: O layout do Deal More foi desenhado para ser fácil de utilizar
para que todos os colaboradores tenham vontade de o utilizar.
Mobile: Todo o negócio pode ser acedido através de um tablet ou de um
smartphone.
Analytics: Reports e dashboards em tempo real no computador ou nos dispositivos
móveis.
Software na cloud: Não é necessário comprar nenhum software ou hardware para
15
16
2 PLANO DE ESTÁGIO
O plano de estágio ficou definido após a entrevista na empresa, permitiu de alguma forma responder algumas questões, a área onde eu queria trabalhar, aquilo que estava apto para fazer, e as oportunidades que poderia ter nos diversos projetos. A definição de objetivos foi fundamental para decidir o percurso a seguir no decorrer do estágio.
De referir que a empresa planeou o estágio para que fosse não só do meu agrado mas também útil para a empresa, e que me pudesse ajudar a evoluir como profissional e mostrar à empresa as minhas competências e a minha evolução.
As funções definidas a realizar na Dom Digital foram de Full Stack Front End Developer, ou seja, um programador com a capacidade de reproduzir interfaces visuais e interativas previamente desenhadas.
2.1 OBJETIVOS
Os objetivos do estágio foram definidos por mim e pela empresa logo após ser escolhido o projeto onde iria trabalhar.
Tendo eu demonstrado interesse em tornar-me Front End Developer e sendo essa uma área onde a Dom Digital tinha vários projetos disponíveis e várias oportunidades futuras, ficou claro para ambos que seria o caminho a seguir para o estágio. Dentro dessa escolha, foram estabelecidos os seguintes objetivos para o estágio:
Dominar os conceitos de Front End: Evoluir e dominar as principais linguagens web (HTML, CSS e JavaScript). Os conceitos básicos de HTML e CSS foram adquiridos durante a minha licenciatura mas o estágio iria servir para evoluir nestas linguagens e para trabalhar não só com JavaScript no seu estado puro, mas também com algumas bibliotecas nomeadamente JQuery e JQueryUI.
Conhecimentos de SASS e LESS: Conhecimento de duas extensões de CSS, perceber os conceitos básicos e conseguir comparar ambas para futuros projetos. Foi definido que a aprendizagem destas duas extensões fosse adquirida através de investigação pessoal sempre com o acompanhamento e esclarecimento de dúvidas por parte dos profissionais da Dom Digital.
17 Conhecimento de Lightning Components: Perceber os conceitos básicos de Lightning Components, aplicar conceitos de front end dentro desta ferramenta nativa de Salesforce, e tentar passar os conhecimentos desta tecnologia para a empresa através de uma apresentação. O conhecimento desta tecnologia deveria ser adquirido através de investigação pessoal e ao desenvolver projetos concretos para a empresa.
Criação de Lightning Components: Depois de adquiridos os conceitos básicos e da experimentação da tecnologia com exemplos simples, o passo seguinte seria criar Lightning Components com base no ArdinaPress. Gestão de aplicações com repositórios GIT: Gerir os projetos utilizando um
controlador de versões utilizado pela empresa, neste caso, GIT.
Apoio de Front End em projetos da Dom Digital: Aplicar os conceitos básicos de Front End em projetos da Dom Digital que fossem surgindo ao longo do estágio.
Desenvolvimento de componentes para ArdinaPress: O grande desafio do estágio depois de conhecer por completo o ArdinaPress e evoluir nos conceitos de Front End, seria desenvolver componentes para o ArdinaPress e que pudessem ser aplicados de forma individual em qualquer outro produto.
2.2 METODOLOGIA
A metodologia da Dom Digital consiste em colocar os estagiários a utilizar as mesmas filosofias dos restantes trabalhadores, apesar de termos espaço para crescer aos poucos e sermos sempre acompanhados devemos sempre adotar as ferramentas e metodologias definidas pela empresa.
Neste sentido o estágio não foi exceção, comecei cedo a participar em reuniões, contactar com os diferentes produtos da empresa, perceber o seu funcionamento e participar nas diferentes fases de cada projeto.
18
2.2.1 PLANEAMENTO SEMANAL
Todas as semanas à segunda-feira é feita uma reunião de equipa, onde são atribuídas tarefas para cada funcionário durante a semana, o número de horas afeto a cada tarefa, e onde são discutidas estratégias e problemas que possam surgir.
Sendo eu estagiário o planeamento foi feito de forma diferente e portanto as minhas semanas estavam planeadas desde o início, o tempo foi distribuído entre as várias tarefas a serem desenvolvias durante o estágio.
Em algumas semanas foi alterado o que estava planeado em consequência de alguns projetos que foram surgindo e onde era necessária a minha intervenção.
Julho 1-12 13-29
ArdinaPress Help
Investigação e desenvolvimento Lightning Components Notifications Center RTP
Correções Dom Hotel website Testes de aplicações
Desenvolvimento de novos componentes Ardina Press
Tabela 1 - Cronograma de atividades do mês de Julho
Agosto 1-5 8-11 12-31
ArdinaPress Help
Investigação e desenvolvimento Lightning Components Notifications Center RTP
Correções Dom Hotel website Testes de aplicações
Desenvolvimento de novos componentes Ardina Press
19
Setembro 1-9 12-30
ArdinaPress Help
Investigação e desenvolvimento Lightning Components Notifications Center RTP
Correções Dom Hotel website Testes de aplicações
Desenvolvimento de novos componentes Ardina Press
Tabela 3 - Cronograma de atividades do mês de Setembro
2.2.2 FERRAMENTAS
Ao longo do estágio foram-me apresentadas algumas ferramentas que facilitam as tarefas do dia-a-dia e que são utilizadas pelos profissionais da Dom Digital para organizarem o seu trabalho, melhorarem a sua performance e maximizarem o seu tempo. A utilização destas ferramentas foi algo que ajudou bastante a tornar-me mais organizado, a ganhar rotinas de trabalho em equipa e de aproveitamento do tempo.
Calendário Google – A utilização do calendário é fundamental para todos os funcionários da Dom Digital, não só pela facilidade em planear a semana de trabalho mas também pela organização individual e em grupo. Todos os funcionários têm a possibilidade de ver os calendários dos seus colegas para evitar a marcação de reuniões ou qualquer outro tipo de evento em horas não disponíveis. Durante o estágio habituei-me a utilizar o calendário para agendar todas as minhas tarefas, ser convidado para as reuniões e apresentações de produtos.
20 Figura 11 - Planeamento semanal no calendário da Google
Fonte: Elaborado pelo estagiário
Google Drive – O Google drive foi outra das ferramentas que utilizei durante o estágio e também muito importante para a empresa, a segurança de todos os documentos é fundamental e a grande maioria dos documentos são todos trabalhos na cloud para não haver o risco de se perder qualquer documento. A partilha de pastas também se torna muito importante para que várias pessoas possam trabalhar nos mesmos documentos ao mesmo tempo.
BitBucket – O Bitbucket é uma solução na cloud para repositórios Git e Mercurial que permite manutenção e gestão de código em equipa. É utilizada por vários profissionais no mundo inteiro e onde está incluída a equipa da Dom Digital, a empresa utiliza este sistema e por esse motivo durante o período de estágio foi também utilizado por mim, no desenvolvimento de componentes para o Ardina Press.
O Bitbucket permite criar vários repositórios, individuais ou partilhados e apresenta uma interface gráfica que permite observar todas as alterações de ficheiros através do seu site.
21 No caso do projeto do Ardina Press utilizei o software SourceTree que sincronizado com o bitbucket me permitiu guardar as alterações ao meu código diariamente.
SourceTree - O SourceTree é um software grátis para Mac e Windows que simplifica a maneira como os utilizadores de Git e Mercurial interagem com os seus repositórios. Este software utiliza uma interface simples que permite utilizar os repositórios sem ter de recorrer a linhas de comando e sem ter que escrever qualquer linha de código para fazer as tarefas básicas de Git e Mercurial.
Este software foi utilizado por mim durante o desenvolvimento dos componentes para o Ardina Press onde diariamente fazia commit de todas as minhas alterações de código e push para o repositório presente no bitbucket. Este software não é obrigatório na empresa mas é utilizado principalmente por quem está a começar a trabalhar com repositórios, pois torna as tarefas mais fáceis, embora os profissionais com alguma prática prefiram utilizar a linha de comandos.
Brackets – O Brackets é um editor de texto grátis e moderno para programadores que para além de ser muito potente é bastante “leve”. Foram-me apresentadas várias possibilidades de editores de código, acabei por optar por utilizar o Brackets pela sua simplicidade, facilidade de personalização e pela elevada quantidade de extensões existentes.
2.2.3 LINGUAGENS DE PROGRAMAÇÃO E BIBLIOTECAS
Nos pontos seguintes descrevo as tecnologias, plataformas, frameworks e linguagens utilizadas no decorrer do estágio:
HTML/CSS – Duas linguagens de programação essenciais para um Front End Developer, depois dos conhecimentos adquiridos sobre estas duas linguagens durante a licenciatura foi tempo de as desenvolver e evoluir ao longo do estágio. Trabalhei com ambas em todos os projetos onde estive
22 envolvido, tanto a parte de HTML para estruturar as páginas, como a parte de CSS para trabalhar o aspeto visual das mesmas.
JavaScript – Javascript foi sem dúvida a linguagem na qual senti mais evolução durante o estágio, foi uma linguagem que não foi abordada durante a licenciatura mas uma investigação pessoal, o acompanhamento dos profissionais da Dom Digital e a necessidade de construir componentes através da mesma, facilitou imenso o processo de aprendizagem.
JQuery/JQuery UI - Para além de puro JavaScript foram também utilizadas algumas bibliotecas, no caso dos componentes para o Ardina Press, as bibliotecas JQuery e JQueryUI foram essenciais para criar efeitos visuais e interação com o utilizador.
Backbone.JS - Dentro do Salesforce a integração dos novos componentes no já existente Ardina Press foi feita através de Backbone.JS, uma biblioteca utilizada para estruturar aplicações web.
Apex – É uma linguagem utilizada no Salesforce para comunicar com a base de dados. Foi uma linguagem que me foi apresentada durante o estágio e apesar de não ter sido das mais trabalhadas por mim foi essencial ter contacto com esta linguagem. Retirar informação das bases de dados no Salesforce, filtrar a informação que o utilizador pretende pesquisar foram tarefas que explorei durante o desenvolvimento de Lightning Components e foi muito importante para o meu crescimento trabalhar com uma linguagem mais direcionada para o Back End.
Aura Framework – É uma framework de user interface que facilita a construção de componentes. Foi utilizada por mim durante o projeto de Lightning Components e ajudou bastante a desenvolver os conteúdos de Front End. Esta framework tem um funcionamento muito semelhante com o HTML, mas os seus componentes têm atributos que permitem comunicar mais facilmente entre eles e acelerar o processo de criação de estruturas de aplicações.
23
2.3 ENQUADRAMENTO TEÓRICO
Todos os conceitos trabalhados durante o estágio fazem parte de uma base teórica adquirida durante a licenciatura mas também durante o estágio, onde aprofundei conhecimentos e procurei sempre construir uma forte base teórica antes de avançar para a prática.
2.3.1 FRONT END DEVELOPMENT
Pete Schuster (2012) diz-nos que as empresas procuram num Front End Developer alguém que tenha a capacidade de construir websites interativos, que saiba trabalhar com HTML, CSS, Javascript e que compreenda os conceitos de mobile first, já Cody Lindley (2016) diz-nos que “um Front End Developer arquiteta e desenvolve websites e aplicações utilizando as tecnologias web como HTML, CSS, DOM e Javascript”.
Através destas definições concluímos imediatamente que um Front End Developer é alguém que desenvolve interfaces gráficas e interativas, mas para se construir algo interativo é necessário ter a capacidade de perceber como funciona um servidor, como é possível responder aos pedidos do utilizador e o mais importante de tudo, como suavizar esse processo e torná-lo o mais fácil e rápido possível.
Os conceitos de API, de gestão de conteúdos, de design, de diversas plataformas e de resolução de problemas tornam-se portanto essenciais em qualquer Front End Developer, além de ter a capacidade de desenhar as interfaces visuais tem de ser capaz de as manipular, de procurar dar ao utilizador as ferramentas necessárias para gerir o seu conteúdo e de preparar o conteúdo para o maior número de plataformas.
Neste processo a combinação de várias tecnologias torna-se fundamental, saber combinar as várias ferramentas, linguagens e torna-las o mais compatíveis possível é um dos grandes desafios de qualquer Front End Developer.
Um dos desafios que se coloca no desenvolvimento de aplicações como Front End Developer é a compatibilidade, o outro é a reutilização, cada vez mais o mercado procura interfaces complexas de forma rápida, e a reutilização torna-se uma mais-valia neste processo, não faz sentido hoje em dia começar todos os projetos do zero, reutilizar trabalhos anteriores, desenvolver componentes independentes é uma das grandes vantagens no processo do seu desenvolvimento.
24
2.3.2 WEB DESIGN
Segundo Santos (2009), “Web Design é uma atividade no âmbito da Engenharia Web que consiste na produção de páginas Web na perspetiva do utilizador”.
A combinação de várias competências técnicas assume um papel fundamental no conceito de web design, e muitos dos conceitos que lemos sobre web design estão interligados com a profissão de Front End Developer, não querendo isto necessariamente dizer que um Front End Developer é apenas um Web Designer.
Santos (2009) aponta três conceitos fundamentais no processo de produção de páginas web:
Usabilidade: A capacidade de oferecer aos utilizadores uma interface adaptada às suas necessidades e facilitar a sua utilização.
Aparência: A capacidade de oferecer aos utilizadores uma interface atrativa que não só capte a atenção dos utilizadores mas que torne a sua navegação agradável e fluída.
Visibilidade: A capacidade de colocar à disposição do utilizador a informação de forma organizada, percetível e de fácil localização.
2.3.3 SALESFORCE
Ao consultar a documentação oficial de Salesforce a primeira definição que nos é apresentada é que Salesforce “ajuda a gerir a relação com os seus clientes, integrar outros sistemas e construir aplicações”. E, por fazer isto de forma tão profissional, Salesforce é o CRM (Customer Relationship Management) número um no mundo.
Salesforce é uma plataforma na cloud desenhada para ajudar as empresas/pessoas a vender, a ligar-se aos seus clientes, a analisar dados, a aplicar técnicas de marketing, a gerir os seus trabalhadores e todo o seu negócio seja ele de que dimensão for.
A grande vantagem do Salesforce se encontrar na cloud é que permite que os negócios possam ser começados e acedidos em qualquer parte do mundo, em tempo real, em várias plataformas, por várias pessoas ao mesmo tempo precisando apenas de acesso à internet.
Outras das grandes vantagens desta plataforma é que pode ser adaptada a todo o tipo de negócios, proporcionando uma experiência personalizada para cada cliente, parceiro ou empregado.
25 O Salesforce é composto por diferentes clouds: Sales Cloud, Service Cloud, Marketing Cloud, Community Cloud, Analytics Cloud e App Cloud.
Figura 12 - Clouds de Salesforce
Fonte: Retirado de www.salesforce.com/blog
O que é um CRM?
CRM significa Customer Relationship Management (em português Gestão de Relacionamento de Clientes).
Esta tecnologia permite a gestão de clientes, a análise de dados e uma interação mais próxima entre as empresas e os seus clientes.
Permite também às diferentes equipas de uma organização colaborar internamente e externamente, gerir redes sociais, e comunicar por vários tipos de canais (telefone, email, etc).
No caso do Salesforce tudo isto é feito na cloud, o que facilita muito o acesso e manipulação da informação, assim como a comunicação imediata entre os membros de equipas ou com os seus clientes.
Armazenamento de dados
O Salesforce organiza os seus dados em objects (objetos) e em records (registos). Cada objeto é um conjunto de informação diferente, como se fosse um separador de uma tabela, enquanto os registos representam uma linha de dados dessa mesma tabela.
26 Figura 13 - Sistema de armazenamento de dados do Salesforce
Fonte: Retirado de Trailhead, plataforma de aprendizagem do Salesforce
Por exemplo, se tivermos em conta um objeto chamado “Vendas”, este seria um objeto para registar informação relativa a vendas de algum tipo de produto ou serviço e este objeto teria campos como: produto, preço, data, comprador, vendedor.
Os objetos relacionam-se entre si criando interação entre os diferentes tipos de informação e proporcionando ao utilizador um conjunto detalhado de várias informações ao mesmo tempo.
O Salesforce tem alguns objetos definidos como Standard que se encontram sempre em todas as organizações, os objetos criados pelo utilizador são chamados de Custom Objects.
Sales Cloud
A Sales cloud é um serviço de otimização de vendas que tem como principal objetivo aumentar o número de vendas, fechar mais negócios, aumentar a produtividade, e conseguir mais oportunidades.
Service Cloud
A Service Cloud é um serviço de apoio ao cliente que tem como principal objetivo manter os clientes satisfeitos e auxiliar as equipas de apoio ao cliente a comunicarem de forma mais rápida e eficaz.
27 A Marketing Cloud é um serviço de marketing com o objetivo de aproximar as empresas dos seus clientes.
Community Cloud
A Community Cloud é um serviço que tem como principal objetivo criar uma conexão entre clientes, funcionários e parceiros através de comunidades.
Analytics Cloud
A Analytics Cloud é um serviço que tem como objetivo facilitar a análise de dados estatísticos.
App Cloud
A App Cloud é um serviço que contém ferramentas para facilitar a criação de aplicações na cloud.
Visualforce Pages
As visualforce pages são páginas desenvolvidas através da framework de Salesforce chamada visualforce. Esta framework permite o desenvolvimento de user interfaces que são alojadas diretamente na plataforma de Salesforce.
As visualforce pages são constituídas por:
Visualforce markup: São tags que representam componentes de user interface tais como: tabelas, colunas, blocos, etc. Estas tags são muito similares à linguagem de programação web HTML o que simplifica bastante o processo de desenvolvimento.
Controlador visualforce: É um conjunto de instruções que especificam o comportamento da página quando existe interação entre os componentes e o utilizador. Estes controladores permitem o acesso a informação para poder ser apresentada na página através de lógica programada em Apex.
As visualforce pages são utilizadas para construir tabs personalizadas, para costumizar páginas ou botões, ou para criar um ambiente personalizado para os utilizadores, este tipo de páginas aceita linguagens web comuns como HTML, CSS ou Javascript o que permite manipular informação do Salesforce através das linguagens web mais populares.
Ambientes gráficos
Os utilizadores de Salesforce têm a capacidade de mudar de ambiente gráfico sempre que queiram, embora algumas funcionalidades possam variar de um para o outro.
28 Classic: É, neste momento, o ambiente gráfico mais estável do Salesforce, apesar de visualmente não ser a mais moderno é aquele que tem todas as suas funcionalidades a operar na totalidade.
Lightning Experience: Nasceu com a necessidade do Salesforce se adaptar à evolução do mobile, é o mais recente user experience do Salesforce e tem um visual mais moderno, mais produtivo e foi desenhado para ajudar os seus utilizadores a serem mais eficientes. Apesar de ser mais moderno ainda está em constantes atualizações e por esse motivo algumas funcionalidades não estão ainda disponíveis neste ambiente.
Salesforce1
O Salesforce1 é uma aplicação mobile que permite aceder à informação de uma organização no Salesforce a partir do smartphone ou do tablet.
Com esta aplicação é possível gerir contactos, oportunidades, fechar negócios, colaborar em projetos a partir de qualquer sítio precisando apenas de um dispositivo móvel. O acesso à internet é evidentemente muito importante para que as atualizações sejam feitas na hora e todos os outros utilizadores da organização as possam ver, mas ainda assim o Salesforce1 permite fazer algumas coisas em modo offline, e a partir do momento em que a internet seja ligada essas alterações são enviadas para os servidores de Salesforce.
Para além de tudo aquilo que pode ser feito nas organizações de Salesforce através da aplicação, é possível ainda costumizar a aplicação para todo o tipo de clientes, filtrar a informação principal para que se aceda à informação importante o mais rapidamente possível.
2.3.4 LIGHTNING COMPONENTS
O Lightning Components é uma framework moderna de User Interface que permite criar aplicações dinâmicas para desktop e dispositivos mobile. Esta framework foi desenvolvida com o objetivo de acelerar o desenvolvimento de aplicações, assim como a performance das mesmas e é, segundo os seus criadores e os profissionais de Salesforce, a tecnologia ideal para desenvolver em salesforce1 e Lightning Experience, pois como é referido no Lightning Components Developer (2016) – “The Salesforce1 mobile app and Salesforce Lightning Experience are built with Lightning components”, portanto se o
29 Salesforce1 e o Lightning Experience foram construídos através de lightning Components não haverá dúvidas de qual a melhor tecnologia a utilizar para a construção de aplicações e componentes para estas duas plataformas.
A framework permite a criação de vários componentes reutilizáveis que comunicam entre si de forma rápida e interativa, utiliza Javascript do lado do cliente, que é outro dos principais objetivos da framework, trabalhar mais do lado do cliente aliviando o servidor e reduzindo o número de pedidos ao essencial, e utiliza Apex do lado do servidor.
O facto de serem construídos vários componentes permite que o cliente possa criar as suas próprias aplicações enquanto os autores dos componentes vão trabalhando em updates ou a fazer alterações sem afetar o funcionamento geral da aplicação.
Principais benefícios de utilizar esta framework:
Components standard que ajudam a otimizar as aplicações para diferentes dispositivos que facilita o trabalho do programador que não tem de dispensar tanto tempo a preparar a aplicação para os vários dispositivos, sendo que uma aplicação pode ser construída sem grandes preocupações extra e fica automaticamente preparada para ser utilizada em desktop, tablets e smartphones.
Os componentes podem ser partilhados com a comunidade, de forma gratuita ou paga através do AppExchange, qualquer utilizador pode descarregar componentes, configurá-los e utilizá-los na sua organização. A incorporação dos componentes é bastante simples, o sistema de Drag and
Drop do Lightning App Builder permite juntar vários componentes numa só aplicação sem ser preciso programar e com total liberdade de organização desses mesmos componentes nos vários dispositivos. No salesforce1 os componentes podem ser facilmente acedidos através do menu de navegação. A framework utiliza uma arquitetura que se foca no lado do cliente através de Javascript, o que permite aliviar o servidor e chamar o mesmo quando é absolutamente necessário para, por exemplo, recolher mais informação. Fácil decomposição por componentes, através de sistema de comunicação
por eventos torna-se mais fácil criar vários componentes que podem comunicar entre si ou com a aplicação.
30 Suporte às principais tecnologias de browser, a framework permite trabalhar em HTML5, CSS3 e outro tipo de linguagens utilizadas em qualquer outro projeto.
Componentes
Os componentes são unidades independentes e reutilizáveis que fazem parte de uma aplicação. Os componentes são apresentados para produzir elementos HTML DOM no browser e podem conter outros componentes, ou seja, um componente pode conter dentro dele vários componentes.
Sendo os componentes independentes da aplicação, permite que estes possam ser trabalhados sem afetar a criação da app, ou seja, um cliente pode criar uma aplicação com vários componentes enquanto o autor de um dos componentes faz alterações ou adiciona funcionalidades, mas não afeta o funcionamento da app, pois esta é construída pelo próprio cliente e não depende de nenhum componente em particular. Os componentes comunicam entre si através de eventos, isto permite que possam pesquisar um conjunto de informação num componente e apresentar a informação dentro de outro componente, ou até mesmo modificar informação dentro de um componente e atualizar os seus detalhes em outro componente.
Eventos
É através de eventos que os componentes comunicam entre si, a ideia é programar “respostas” à interação do utilizador com os componentes. A lógica deste sistema é bastante simples: os eventos são disparados conforme o comportamento do utilizador nos componentes, por exemplo, se um utilizador clicar num botão para criar um novo contato num componente de criação de contatos, vai ser disparado um evento que permite a atualização dos contatos dentro de outro componente.
Existem dois tipos de eventos:
Component Events: São eventos manipulados pelo próprio componente ou pelo componente que contém esse mesmo componente.
Application Events: São eventos manipulados por todos os componentes listados no evento.
Funcionamento
Como foi dito anteriormente, os componentes de Lightning utilizam JavaScript do lado do cliente e Apex do lado do servidor.
31 Figura 14 - Funcionamento dos Lightning Components
Fonte: Retirado de Trailhead, plataforma de aprendizagem do Salesforce
Uma aplicação é gerada por vários componentes independentes, mas cada componente tem também a sua constituição, o chamado bundle. Este bundle é constituído por oito recursos: Component, Controller, Helper, Style, Documentation, Renderer, Design e Svg. Cada um destes recursos tem a sua função e todos os componentes são constituídos por estes mesmos recursos.
Figura 15 - Exemplo de ambiente de desenvolvimento de componentes.
Fonte: Elaborado pelo estagiário
Component
É aqui que fica localizado o componente, toda a sua estrutura é aqui localizada, os botões, as tabelas, as listas, os elementos de input, basicamente todos os elementos que
32 constituem um componente são aqui programados. Por exemplo, na imagem acima (Figura 16) podemos ver uma tag com uma mensagem, este tipo de código está sempre presente no Componente.
Controller
Este é o principal controlador do componente, atua do lado do cliente e é onde é definido todo o comportamento do componente escrito em funções de JavaScript. Por exemplo, se tivermos um botão que permite a recolha de uma lista de contatos, criamos o botão dentro do componente mas o seu comportamento é escrito através de uma função em JavaScript dentro do controlador, essa função é chamada dentro do componente.
Helper
Este é outro ficheiro com funções em JavaScript que atua também do lado do cliente, este helper tem como função alojar funções que possam ser reutilizadas e são chamadas através de JavaScript no controller ou no renderer.
Por exemplo, no botão de recolha de lista de contatos podemos também querer que seja atualizado um contador de contatos, nesse caso era criada uma função no helper que atualizava esse contador e sempre que precisarmos de atualizar esse mesmo contador é só chamar a função no helper.
Style
Este é o ficheiro de CSS do componente, todos os estilos a serem aplicados ao componente são aqui programados através de CSS. Como cada componente tem o seu próprio style, o CSS aplicado em um componente não afeta os outros componentes, este processo é feito através a utilização da classe “THIS”
Por exemplo, se quisermos alterar o CSS de uma div com o nome “main” a forma de o declarar no CSS seria “.THIS.main { }”.
Documentation
Este recurso serve para ajudar os utilizadores do componente a perceberem e a utilizarem o componente.
33 DocDef (Documentation definition): Este é o tipo de documentação que inclui uma descrição, uma demonstração de código e referências para exemplos. É um tipo de documentação que suporta HTML e tem como principal objetivo descrever o que é o componente e o que ele faz.
Inline: Este tipo de documentação são simples descrições de texto dentro da tag “description”.
A documentação DocDef é apenas suportada nos componentes e nas aplicações, os eventos devem ter documentação inline.
Renderer
Este é outro recurso escrito em JavaScript, que consiste na modificação dos elementos DOM.
O Renderer consegue manipular a maneira como é feita a render do componente, e é aplicada por cima da render normal do componente.
Este recurso é apenas utilizado em casos muito específicos, existem algumas opções para não ter de utilizar o renderer, como por exemplo utilizar o evento init que permite executar ações logo que o componente seja aberto.
Design
Este é o recurso fundamental para disponibilizar o componente nas Lightning Pages e no Lightning App Builder.
Ainda que por vezes se desenvolvam componentes específicos que devem ser incluídos pelo próprio programador, a verdade é que o principal objetivo dos Lightning Components é utilizar o Lightning App Builder que permite arrastar os componentes e criar aplicações de forma simples e rápida. Para que isto seja possível o programador deve preparar o seu componente para estar disponível para o Lightning App Builder, através do recurso design, o programador consegue não só disponibilizar o seu componente mas manipular a interação do utilizador com este mesmo componente.
34 Este recurso serve apenas para costumizar o ícone dos componentes no Lightning App Builder ou no Community Builder.
2.3.5 REPOSITÓRIOS GIT
O Git é um controlador de versões desenhado para ser utilizado em projetos, sejam eles grandes ou pequenos. O Git é grátis e open source, significando que qualquer pessoa pode partilhar ou alterar o software e torna-o grátis para todos os seus utilizadores.
O que é um controlador de versões?
“Um controlador de versões é um sistema que guarda as alterações de um ficheiro ou de um conjunto de ficheiros para que ao longo do tempo seja possível “chamar” versões específicas (Scott Chacon e Bem Straub, 2016) ”.
Com este sistema é possível reverter os ficheiros ou projetos inteiros para versões anteriores, comparar as diferentes versões, ver quem modificou cada versão ou quem introduziu um problema.
Este sistema surgiu com a necessidade dos programadores terem acesso a diferentes versões dos seus ficheiros sem terem de estar a fazer cópias constantes dos ficheiros e a dividi-los em pastas. Ao longo do tempo foram surgindo várias versões deste sistema, começou por existir um sistema de controlo de versões local, que armazenava as versões dos projetos no próprio computador, depois surgiu um sistema de controlo de versões centralizado, onde os projetos eram acedidos através de um servidor. Este sistema introduziu a colaboração, ou seja, com este sistema era possível várias pessoas ligadas ao mesmo servidor trabalharem nos seus projetos em conjunto.
Por fim, surgiram os sistemas de versões distribuídos, como é o caso do Git, estes sistemas vieram melhorar bastantes aspetos da anterior versão e acrescentar novas funcionalidades de acordo com as necessidades do Mundo moderno e as mais recentes tecnologias.
35 Figura 16 - Esquema de sistema de controlo de versões distribuído
Fonte: Retirado de www.git-scm.com/doc
À semelhança do que acontecia no sistema de controlo de versões centralizado, o sistema de controlo de versões distribuído permite também a partilha e colaborações de projetos entre vários utilizadores e armazena a informações online, com uma pequena (grande) diferença, é que neste sistema, a informação é partilhada entre o servidor e os seus utilizadores. Ou seja, não é necessário constantemente aceder ao servidor para consultar determinadas informações, e caso a informação do servidor seja perdida por algum problema no mesmo, é possível fazer backup da informação presente localmente e restaurar o servidor.
Apesar do funcionamento geral deste sistema, cada controlador de versões tem a sua forma de tratar a informação, neste caso o Git funciona de forma diferente de todos os outros controladores.
36
Funcionamento do Git
Figura 17 - Funcionamento do Git
Fonte: Retirado de www.git-scm.com/doc
O Git estrutura os seus dados como se fossem uma série de fotografias do estado dos ficheiros no momento em que foram guardados, no caso de alguns ficheiros não terem sofrido alterações, em vez de os guardar novamente o que o Git faz é colocar um link para o ficheiro anteriormente colocado.
Como foi dito anteriormente, um dos grandes objetivos é ter várias pessoas a trabalhar no mesmo projeto o que implica estarem online e estarem também limitadas à velocidade e capacidade de resposta do servidor, no Git não funciona assim, quase todas as operações são feitas localmente. O Git consegue pesquisar e mostrar o histórico do projeto localmente sem ter de recorrer ao servidor, é possível, por exemplo, ver as diferenças de uma versão atual de um projeto para outro projeto feito à vários meses atrás de forma instantânea, pois o Git faz cálculos localmente e não precisa de recorrer ao servidor para mostrar estes resultados.
“A maioria das operações do Git precisa apenas de ficheiros locais – (Scott Chacon e Bem Straub, 2016) ”.
A forma como o Git funciona permite trabalhar muito em modo offline, o que é uma enorme vantagem, pois existem sempre situações onde precisamos de trabalhar nos projetos e não podemos estar ligados a uma rede (em viagens, quando existem problemas na internet, em casa de familiares, etc…). Através deste sistema o Git permite que os projetos sejam trabalhados offline e sejam guardados localmente, para que assim que seja reposta a ligação à internet sejam enviados automaticamente os novos dados para os servidores. Isto não acontece com todos os sistemas, normalmente não é permitido fazer
37 praticamente nada sem estar ligado à rede e é impossível efetuar alterações no projeto sem estar ligado, com o Git pode tudo ser feito offline, embora, obviamente, para os restantes participantes do projeto terem acesso às alterações é preciso ligar a internet.
Os três estados
Os ficheiros em Git estão divididos em três estados: committed, modified e staged. Quando os ficheiros estão committed significa que estão guardados de forma segura na base de dados.
Quando estão modified significa que os ficheiros foram alterados mas ainda não foram enviados para a base de dados (não estão committed).
Quando estão staged significa que os ficheiros estão marcados para serem enviados no próximo commit.
Figura 18 - Os três estados dos ficheiros Git
Fonte: Retirado de www.git-scm.com/doc
A imagem (Figura 19) acima refere as três áreas do Git, a Working directory, que é onde estão localizados os ficheiros que podem ser editados ou utilizados e estão armazenados no disco do utilizador.
A Staging Area, que é um ficheiro que armazena as informações sobre o que vai ser transferido no próximo commit.
A Git directory é o repositório de ficheiros onde está guardada toda a informação dos commits feitos pelos diferentes utilizadores.
