-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
476 lines (465 loc) · 17.4 KB
/
index.html
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
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
<!DOCTYPE html>
<html lang="pt-BR">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Portfólio | Matheus Costa</title>
<link rel="icon" href="assets/images/perfil.png" />
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
href="https://fonts.googleapis.com/css2?family=Montserrat:wght@900&family=Open+Sans:ital,wght@0,400;0,700;1,400&display=swap"
rel="stylesheet"
/>
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
href="https://fonts.googleapis.com/css2?family=Pacifico&display=swap"
rel="stylesheet"
/>
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
href="https://fonts.googleapis.com/css2?family=Rubik+Bubbles&display=swap"
rel="stylesheet"
/>
<link rel="stylesheet" href="./assets/css/variables.css" />
<link rel="stylesheet" href="./assets/css/elements.css" />
<link rel="stylesheet" href="./assets/css/classes.css" />
<link rel="stylesheet" href="./assets/css/menu.css" />
<link rel="stylesheet" href="./assets/css/timeline.css" />
<link rel="stylesheet" href="./assets/css/about.css" />
<link rel="stylesheet" href="./assets/css/habilities.css" />
<link rel="stylesheet" href="./assets/css/styles.css" />
</head>
<body>
<input
id="close-menu"
class="close-menu"
type="checkbox"
aria-label="close menu"
role="button"
aria-pressed="true"
/>
<label class="close-menu-label" for="close-menu" title="close menu"></label>
<aside class="menu menu-bg">
<div class="limit">
<div class="main-content menu-content">
<h1 onclick="getElementById('close-menu').checked = false;">
<a class="top" href="#"
><img
class="typing-animation"
src="./assets/images/logo.png"
alt="Logo"
/></a>
</h1>
<nav class="navbar">
<ul onclick="getElementById('close-menu').checked = false;">
<li>
<div class="tema">
<label class="switch" for="theme">
<span class="switch-text">Tema</span>
<div class="switch-wrapper">
<input
class="input"
type="checkbox"
name="theme"
id="theme"
/>
<span class="switch-button"></span>
</div>
</label>
</div>
</li>
<li><a href="#sobre-mim">Sobre mim</a></li>
<li><a href="#habilidades">Habilidades</a></li>
<li><a href="#projetos">Projetos</a></li>
<li><a href="#contatos">Contatos</a></li>
</ul>
</nav>
</div>
</div>
</aside>
<div class="menu-spacing"></div>
<section class="intro main-bg section hidden">
<div class="main-content intro-content">
<div class="intro-text-content">
<h6 class="title">Matheus Costa</h6>
<h4 class="subtitle">Desenvolvedor de software</h4>
<br />
<p>
<a target="_blank" href="https://github.com/Matheus-S-Costa"
><img
class="github"
src="assets/images/github-logo.png"
alt="github"
/></a>
<a
target="_blank"
href="https://www.linkedin.com/in/matheus-s-costaa/"
class="linkedin"
><img src="assets/images/linkedin-logo.png" alt="linkedin"
/></a>
</p>
<br />
</div>
<div class="intro-img">
<img src="assets/images/undraw.svg" alt="Programando" />
</div>
</div>
</section>
<section id="sobre-mim" class="about secondary-bg section hidden">
<div class="main-content about-content">
<div class="about-img">
<h5>sobre mim 📄</h5>
<br /><br /><br />
<p class="profile">
<img
src="assets/images/perfil.png"
alt="imagem matheus programando"
/>
</p>
</div>
<div class="about-text-content">
<p>
No momento estou desenvolvendo habilidades valiosas em Engenharia de
computação e Software nas linguagens Java e Apex, bancos de dados
relacionais SOQL, computação em nuvem com Salesforce e gerenciamento
e versionamento de projetos através da Azure DevOps, além de
resolução de problemas, análise crítica e colaboração em equipe que
acredito serem essenciais para um profissional.
</p>
<br />
<br />
<form
target="_blank"
method="get"
action="assets/images/CurrículoMatheusCosta.pdf"
>
<button class="curriculum" type="submit">Meu currículo</button>
</form>
<br /><br />
</div>
</div>
<div class="line">
<hr />
</div>
<br /><br /><br /><br />
<div class="bg secondary-bg">
<div class="timeline hidden">
<div class="container left">
<div class="content">
<h3 class="p-tm">
Desenvolvedor Salesforce • Arcelormittal (jun 2023 - atualmente)
</h3>
<p class="p-tm">
Estágio em que meu foco é área de desenvolvimento, as principais
atividades que estou desenvolvendo nesse período são: <br />
- Assistência ao sistema Salesforce; <br />
- Análise de incidentes e teste de soluções em código apex,
dando direcionamento para a tratativa; <br />
- Elaboração de cards na plataforma DevOps; <br />
- Análise de dados Salesforce e configuração de sistema; <br />
</p>
</div>
</div>
<div class="container right">
<div class="content">
<h3 class="p-tm">
Desenvolvedor backend • Ânima (ago 2022 - fev 2023)
</h3>
<p class="p-tm">
Projeto de iniciação científica cujo objetivo é desenvolver uma
plataforma direcionada ao gerenciamento dos alunos de
intercâmbio em cada instituição de ensino superior pertencente à
organização educacional ânima. O front-end (parte visual) foi
feito com nuxt.js e o backend (microsserviços) com .Net.
</p>
</div>
</div>
<div class="container left">
<div class="content">
<h3 class="p-tm">Engenharia de computação • UNA (2020-2024)</h3>
<p class="p-tm">
Meu foco é aprofundar em desenvolvimento de sistemas, estou
utilizando softwares de computação em nuvem da AWS, python, para
backend e para análise de dados. Além de javascript, html e css
para desenvolvimento web.
</p>
</div>
</div>
<div class="container right">
<div class="content">
<h3 class="p-tm">Técnico em eletrônica • Tecnosys (2020-2022)</h3>
<p class="p-tm">
Em suma, fui técnico em uma assistência técnica autorizada
Apple. Neste período fiz manutenções e diagnósticos em
equipamentos Apple (macOS e iOS) com redação de laudos técnicos,
reparos, manipulação de componentes eletrônicos e serviços em
software. Alem das habilidades técnicas foram desenvolvidas
diversas soft skills com atendimento direto ao cliente.
</p>
</div>
</div>
<div class="container left">
<div class="content">
<h3 class="p-tm">Eletrônica • Coltec-UFMG (2017-2019)</h3>
<p class="p-tm">
Neste período fui introduzido à lógica de programação com C e
usei o software interativo matlab. Me aprofundei em conceitos de
eletrônica aplicada, onde inclusive desenvolvi um projeto de uma
planta residencial. Tive e estou tendo contato com linux.
</p>
</div>
</div>
</div>
<br /><br />
</div>
</section>
<!--
<hr> <hr>
-->
<section
id="habilidades"
class="contatos habilidades terciary-bg section hidden"
>
<div class="main-content grid-one-content">
<br /><br /><br /><br />
<h2 class="type-animation">Habilidades</h2>
<br />
<p>
Cada linguagem tem seus pontos fortes e fracos, busco explorar os
pontos fortes de cada uma, sempre pesquisando sobre e me atentando às
novidades. Algumas ferramentas e linguagens que mais utilizo:
</p>
<br /><br /><br />
<div class="grid">
<div class="habilities-img">
<img
class="hab"
src="assets/images/frontendb.png"
alt="front-end"
/>
</div>
<div class="habilities-img">
<img
class="hab"
src="assets/images/backendb.png"
alt="backend-end"
/>
</div>
<div class="habilities-img">
<img class="hab" src="assets/images/devopsb.png" alt="devops" />
</div>
</div>
</div>
<div class="main-content">
<h2 class="type-animation cert">Certificado</h2>
<p class="certificados">
Estou sempre em busca de construir novos métodos que facilitem nosso
dia-a-dia, tanto para empresas quanto para uso pessoal. <br /><br />
Possuo alguns
<a
target="_blank"
class="link"
href="https://drive.google.com/drive/folders/1jwOozs2G5rkWRYNifckZIb-g8UxVrT6e"
><i><b>certificados</b></i></a
>
de cursos em empresas renomadas, como udemy, google cloud skills
boost, aws e cisco. Tais cursos servem para me manter atualizado em
relação às tecnologias e ferramentas que o mercado de trabalho mais
requer atualmente. <br /><br />
<a
target="_blank"
href="https://www.salesforce.com/trailblazer/matheus-s-costaa"
><img
class="aws"
src="assets/images/devSuperbadge.png"
alt="Developer Super Set SF"
/></a>
<a
target="_blank"
href="https://www.cloudskillsboost.google/public_profiles/65defd22-934f-41f6-8129-298a7f355608/badges/2742013"
><img class="gcp" src="assets/images/badgegc.png" alt="badge GCP"
/></a>
</p>
</div>
</section>
<section id="projetos" class="projetos secondary-bg section hidden">
<div class="main-content grid-one-content">
<br /><br /><br /><br />
<h5>PROJETOS</h5>
<br />
<p>Alguns projetos recentes que desenvolvi.</p>
<br /><br /><br />
<div class="grid">
<article>
<br /><br />
<h4>Análise de vendas</h4>
<br />
<p>
Utilizando python serão lidos todos os dados de 6 tabelas de
vendas de uma empresa x, para verificar qual vendedor bateu a meta
no mês, no caso estipulada em 55.000.
<br />
A partir do momento que for verificado que o funcionário x bateu a
meta estipulada, será enviado um SMS para o gerente com a
informacao do nome do vendedor e a quantidade de vendas.
</p>
<br /><br />
<form
method="get"
action="https://github.com/Matheus-S-Costa/Analise_vendas"
>
<button class="project-button" type="submit">
Ver no Github
</button>
</form>
</article>
<article>
<br /><br />
<h4>Anúncios eSports</h4>
<br />
<p>
Neste projeto foi criada uma página web para players de diferentes
jogos que se comunica com um servidor utilizando principalmente
react para o front-end e node para o back-end. A página web possui
um banner com as opções de games e uma box para o usuário criarem
os anúncios. O projeto foi desenvolvido durante a NLW da
Rocketseat.
</p>
<br /><br /><br />
<form
method="get"
action="https://github.com/Matheus-S-Costa/eSports-web"
>
<button class="project-button" type="submit">
Ver no Github
</button>
</form>
</article>
<article>
<br /><br />
<h4>Automação</h4>
<br />
<p>
Neste projeto foi realizada a automação de uma tarefa de uma
empresa para ser baixado o arquivo com a tabela de vendas de um
mês x, calcular o somatório da quantidade de produtos vendidos e o
faturamento do mês. Após isso, um email será enviado para o
destinatário com as informações escritas e calculadas pelo python
com a lib pandas.
</p>
<br /><br /><br />
<form
method="get"
action="https://github.com/Matheus-S-Costa/Automacao"
>
<button class="project-button" type="submit">
Ver no Github
</button>
</form>
</article>
</div>
</div>
</section>
<section id="contatos" class="intro terciary-bg section hidden">
<div class="main-content intro-content">
<div class="intro-text-content">
<br /><br /><br />
<h2>Contatos</h2>
<p>Vamos trabalhar juntos?</p>
<br />
<p>
Ficarei contente em compartilhar conhecimentos e trocar informações,
ter uma rede de contatos é de suma importância. Contate-me para
conversarmos!
</p>
</div>
<div class="intro-img">
<img src="assets/images/contact.svg" alt="Contatos" />
</div>
<br /><br /><br />
<div class="contact-form">
<form
action="https://formsubmit.co/matheusilva334@gmail.com"
method="POST"
>
<fieldset class="form-grid">
<legend>Contate-me</legend>
<div class="form-group">
<label for="first-name">Primeiro nome</label>
<input
type="text"
name="first-name"
id="first-name"
placeholder="Seu nome"
/>
</div>
<div class="form-group">
<label for="last-name">Último nome</label>
<input
type="text"
name="last-name"
id="last-name"
placeholder="Seu sobrenome"
/>
</div>
<div class="form-group">
<label for="email">Email</label>
<input
type="email"
name="email"
id="email"
placeholder="refused@examplo.com"
/>
</div>
<div class="form-group full-width">
<label for="message">Mensagem</label>
<textarea
class="txt"
name="message"
id="message"
cols="30"
rows="10"
placeholder="Sua mensagem"
></textarea>
</div>
<input
type="hidden"
name="_next"
value="https://myportfoliomsc.netlify.app/"
/>
<div class="form-group full-width">
<button type="submit">Enviar mensagem</button>
</div>
</fieldset>
</form>
</div>
</div>
</section>
<div class="gtranslate_wrapper"></div>
<script>
window.gtranslateSettings = {
default_language: "pt",
native_language_names: true,
detect_browser_language: true,
languages: ["pt", "en"],
wrapper_selector: ".gtranslate_wrapper",
alt_flags: { en: "usa", pt: "brazil" },
};
</script>
<script
src="https://cdn.gtranslate.net/widgets/latest/float.js"
defer
></script>
<footer id="footer" class="footer">
<p>Matheus Costa ©️ 2023</p>
</footer>
<a class="back-to-top" href="#">➤</a>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="main.js"></script>
<script src="app.js"></script>
</body>
</html>