Projeto_Portfolio/index.html at main · TayeneRamires/Projeto_Portfolio · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
<!DOCTYPE html>
<html lang="pt-br">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="Projeto Portfólio">
    <meta name="author" content="Generation Brasil">
    <meta name="keywords" content="HTML, CSS, JavaScript">
    <link rel="icon" type="image/svg" href="./assets/img/favicon.svg" />


    <!-- Link para a Folha de Estilo da Página - CSS -->
    <link rel="stylesheet" href="./assets/css/style.css">

    <title>Meu Perfil</title>
</head>
<body>

    <!-- Cabeçalho da Página (header) -->
<header>

    <!-- Título do cabeçalho -->
     <h1 class="h1">Tayene Ramires</h1>

     <!-- Menu de Navegação -->
      <nav>
        <ul>
            <li><a href="index.html">Início</a></li>
            <li><a href="contato.html">Contato</a></li>
        </ul>

      </nav>
</header>

<!-- Seção Principal da Página (main) -->
<main>

<!-- Seção Sobre -->
<section id="about">


    <!-- Título da Seção -->
     <h2 class="h2">Sobre mim</h2>

     <article>

          <!-- Foto do Perfil -->
           <img src="./assets/img/eu1.png" alt="Foto do criador desse conteúdo"/>

           <!-- Texto do Perfil -->
           <p>Oi! Eu sou a Tayene Ramires.
              Atuei por mais de sete anos na área de contabilidade bancária e financeira, com destaque para minha experiência como Analista de Operações Sênior no Banco Digio, onde desenvolvi um perfil analítico, com forte atenção aos detalhes, organização e responsabilidade.
              A proximidade com os times de desenvolvimento e sustentação fortaleceu um interesse que eu já tinha pela área de tecnologia, levando-me a iniciar uma transição de carreira consciente e planejada para o desenvolvimento de software — uma jornada desafiadora, mas muito empolgante.
              Atualmente, faço parte do bootcamp da Generation Brasil, onde estudo tecnologias como JavaScript, TypeScript, Node.js, NestJS, HTML, CSS, MySQL e versionamento com Git e GitHub, ao mesmo tempo em que fortaleço soft skills essenciais, como colaboração, persistência e mentalidade de crescimento. Paralelamente, curso Sistemas de Informação na Faculdade Impacta, o que complementa minha formação técnica.
              Hoje, busco minha primeira oportunidade na área de desenvolvimento de software, onde eu possa continuar aprendendo, evoluindo profissionalmente e contribuindo com o time.
              Fora do mundo do código e dos estudos, gosto de aproveitar momentos simples: estar com quem amo, ficar com meus gatos, ler, viajar e ouvir música.

           </p>

     </article>
</section>
<section id="tecnologias">
  <h2>Tecnologias</h2>

<div class="badges">
  <a href="https://developer.mozilla.org/pt-BR/docs/Web/JavaScript" target="_blank" rel="noopener noreferrer">
    <img src="https://img.shields.io/badge/JavaScript-F7DF1E?logo=javascript&logoColor=black&style=for-the-badge" alt="JavaScript">
  </a>

  <a href="https://www.typescriptlang.org/" target="_blank" rel="noopener noreferrer">
    <img src="https://img.shields.io/badge/TypeScript-3178C6?logo=typescript&logoColor=white&style=for-the-badge" alt="TypeScript">
  </a>

  <a href="https://nodejs.org/" target="_blank" rel="noopener noreferrer">
    <img src="https://img.shields.io/badge/Node.js-339933?logo=nodedotjs&logoColor=white&style=for-the-badge" alt="Node.js">
  </a>

  <a href="https://nestjs.com/" target="_blank" rel="noopener noreferrer">
    <img src="https://img.shields.io/badge/NestJS-E0234E?logo=nestjs&logoColor=white&style=for-the-badge" alt="NestJS">
  </a>

  <a href="https://developer.mozilla.org/pt-BR/docs/Web/HTML" target="_blank" rel="noopener noreferrer">
    <img src="https://img.shields.io/badge/HTML5-E34F26?logo=html5&logoColor=white&style=for-the-badge" alt="HTML5">
  </a>

  <a href="https://developer.mozilla.org/pt-BR/docs/Web/CSS" target="_blank" rel="noopener noreferrer">
    <img src="https://img.shields.io/badge/CSS3-1572B6?logo=css3&logoColor=white&style=for-the-badge" alt="CSS3">
  </a>
</div>

</section>

      <!-- Seção vídeo -->
<section id="video">

      <!-- Título da Seção  -->
  <h2>Meu vídeo favorito: </h2>

      <!-- Vídeo da Seção  -->
    <figure>

        <iframe
    width="560"
    height="315"
    src="https://www.youtube.com/embed/S9uPNppGsGo?si=fxRpjY-uGIzvRIOj"
    title="YouTube video player"
    frameborder="0"
    allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
    referrerpolicy="strict-origin-when-cross-origin" allowfullscreen
    ></iframe>
</figure>

</section>

</main>

<!-- Rodapé da Página (footer) -->
<footer>

    <!-- Seção de Contato - Redes Sociais -->
    <section>

        <a href="https://www.linkedin.com/in/tayeneramires/">
            <img src="./assets/img/linkedin.png" alt="LinkedIn"/>
        </a>

        <a href="https://github.com/TayeneRamires">
            <img src="./assets/img/github.png" alt="GitHub"/>
        </a>

    </section>
    <h3>
        Feito com <span class="heart">❤️</span> por Tayene Ramires - 2026
    </h3>

        </footer>

    </body>

</html>