Site de portfólio pessoal

UM RELATÓRIO DE PROJETO
APRESENTADO EM CUMPRIMENTO PARCIAL DO REQUISITO PARA CONCESSÃO
DO GRAU

BACHAREL EM TECNOLOGIA
(Ciência da Computação e Engenharia)

ENVIADO POR

ANUPRIYA JOHRI
(RA1811003030365)

INSTITUTO DE CIÊNCIA E TECNOLOGIA SRM NCR CAMPUS,

MODINAGAR, GHAZIABAD UTTAR PRADESH (ÍNDIA)
Novembro, 2021

1
 DECLARAÇÃO
Isto é para verificar o relatório do projeto intitulado “Site de Portfólio Pessoal”,

que é enviado por mim em cumprimento parcial do requisito para a obtenção do

grau B. Tecnologia em Ciência da Computação e Engenharia para o Instituto SRM

de Ciência e Tecnologia, Modinagar, Ghaziabad, Uttar Pradesh compreende

apenas meu trabalho original e o devido reconhecimento está no texto para todos

os outros materiais utilizados.

Data: Nome do Aluno

2
 CAMPUS SRMIST NCR, GHAZIABAD, UTTAR
PRADESH

CERTIFICADO GENUÍNO
Certifico que este relatório de projeto “Projeto de site de portfólio pessoal” é um

trabalho genuíno de “Anupriya Johri” que realizou o trabalho do projeto sob minha

supervisão.

Assinatura Assinatura

(Chefe de Departamento) (Supervisor)

RP MAHAPATRA AMIT SHARMA

(Ciência e Engenharia da Computação) (Ciência e Engenharia da Computação)

SRMIST NCR MODINAGAR SRMIST NCR MODINAGAR

3
 ÍNDICE
CAPÍTULO Nº PÁGINA DE TÍTULO Nº.
RESUMO 5
LISTA DE FIGURAS 6
LISTA DE SÍMBOLOS 7
LISTA DE SÍMBOLOS,
ABREVIAÇÕES E
NOMENCLATURA
1. INTRODUÇÃO 8
1.1 OBJETIVOS
1.2 SEÇÃO INICIAL
1.3 SOBRE A SEÇÃO
1.4 SEÇÃO DE HABILIDADES
1.5 SEÇÃO DE EXPERIÊNCIA
1.6 SEÇÃO DE DETALHES DE CONTATO
2. SOFTWARE USADO 14
2.1 HTML
2.2 CSS
2.3 JAVASCRIPT
3. SIGNIFICADO 15
4. DESAFIOS 16
5. CONCLUSÃO 17
6. REFERÊNCIAS 17

4
 ABSTRATO

Este projeto de site de portfólio pessoal é baseado em desenvolvimento

web. Isso é desenvolvido usando HTML5, CSS e JS. O editor de código

usado para este projeto é o VS Code. Ele exibe a experiência profissional

de um indivíduo. Ele exibe breves informações sobre experiências de

trabalho até o momento, educação, habilidades e detalhes de contato,

juntamente com links de mídia social. Todos os elementos são

renderizados de forma distinta no site.

5
 LISTA DE FIGURAS

1. Seção inicial
2. Seção Sobre
3. Seção de habilidades
4. Seção de experiência
5. Seção de detalhes de contato

6
 LISTA DE SÍMBOLOS, ABREVIATURAS E
NOMENCLATURA
Abreviações
1. IDE – Ambiente de Desenvolvimento Integrado
2. HTML – Linguagem de marcação de hipertexto
3. CSS – folhas de estilo em cascata
4. JS-JavaScript
5. Código VS – Código do Visual Studio

7
 INTRODUÇÃO

O Site de Portfólio Pessoal fornece breves informações sobre a

trajetória profissional de um indivíduo. Este projeto é composto por

três arquivos. O primeiro é um arquivo HTML para criar a marcação

do aplicativo na web. Em seguida, o arquivo CSS é usado para

fornecer mais estilos ao site. Em seguida, o arquivo JS é usado para

fornecer uma funcionalidade adequada ao aplicativo através de

JavaScript.

1.1 OBJETIVOS
1.1.1 Elementos renderizados distintamente
1.1.2 Breves informações sobre: -
Experiência de trabalho
Educação
Habilidades
Formas de contato

8
1.2 SEÇÃO INICIAL

Ele exibe meu nome, meu status de trabalho atual e de onde venho. Na
parte superior também possui uma barra de navegação que exibe
outras abas do meu site e meus atalhos de detalhes de contato no canto
superior direito.

9
1.3 SOBRE A SEÇÃO

Ele exibe uma introdução rápida para mim e um botão também

fornecido para visualizar meu currículo. A barra de navegação possui
propriedades fixas que ficam visíveis mesmo após rolar para baixo.

10
1.4 SEÇÃO DE HABILIDADES

Ele exibe minhas habilidades técnicas com minha proficiência técnica

exibida como porcentagem para cada tecnologia e minha experiência
profissional atual.

11
1.5 SEÇÃO DE EXPERIÊNCIA

Esta seção exibe minha experiência de trabalho, incluindo minha

experiência voluntária em qualquer organização e meus estágios.

12
1.6 SEÇÃO DE DETALHES DE CONTATO

Esta seção contém todos os links listados abaixo:

a. Whatsapp
b. Chamar
c. Correspondência
d. Vinculado
e. Instagram

13
 SOFTWARE USADO

O editor de código que usei para este projeto é o VS Code. É usado para codificar

programas complexos e desenvolver projetos complexos. Outras tecnologias que

usei para este projeto são HTML5, CSS e JS.

2.1HTML5

É o código para criar páginas da web, usando tags e outros comandos que um

navegador lê e converte nas páginas da web normais que as pessoas veem.

2.2CSS

CSS é a linguagem para descrever a apresentação de páginas da Web, incluindo

cores, layout e fontes.

2.3JS

JavaScript é uma linguagem de programação baseada em texto usada tanto no lado

do cliente quanto no lado do servidor que permite tornar as páginas da web

interativas. Ele fornece às páginas da web elementos interativos que envolvem o

usuário.

14
 SIGNIFICADO

A importância do portfólio pessoal é que ele apresenta seu trabalho que representa

seu desempenho e habilidades, bem como seus pontos fortes e fracos. A

culminação do trabalho representado em um portfólio permite que colegas,

mentores e potenciais empregadores entendam você como estudante, suas paixões

e seu trabalho.

15
 DESAFIOS

Os desafios enfrentados durante este projeto foram:

1. Vinculando arquivos do Google Drive, como minhas imagens e meus

documentos.

2. Espaçando os elementos corretamente usando CSS.

3. Escolher o fundo foi um grande desafio, pois tinha que ser formal e

agradável aos olhos.

16
 CONCLUSÃO

Por fim, para concluir, desenvolvi um site de portfólio pessoal simples e básico

usando HTML5, CSS, JavaScript usando VS Code como IDE que continuarei a

manter no futuro também.

REFERÊNCIAS

 Curso Coursera:

Introdução ao Desenvolvimento Web, UC Davis por Daniel Randall -

Ensinou minuciosamente todas as três linguagens HTML5, CSS e JS.

 Stack Overflow: Como modificar links do Google Drive para incorporar em

tags âncora em HTML.

 Escolas W3: Como fornecer todas as redes sociais e links de contato.

17