-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
199 lines (196 loc) · 11.3 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.9.3/css/bulma.min.css">
<link rel="icon" href="icone-portfolio.svg" type="image/x-icon">
<link rel="stylesheet" id="theme-style" href="light-theme.css">
<title>Jonathan Arroyo Portfolio</title>
</head>
<body>
<header>
<h1 class="title custom-title">Jonathan Arroyo Portfolio</h1>
</header>
<nav>
<button id='theme-toggle'>
<img src="moon-icon.svg" id='theme-toggle-icon' alt="Theme toggle">
</button>
</nav>
<main>
<section class="section">
<div class="container">
<h2 class="title is-4">About Me</h2>
<p class="mb-4">
Hi there o/<br>
My name is Jonathan, and I'm a Peruvian software developer currently residing in Brazil.<br>
I have a deep passion for programming, which I've seamlessly combined with my academic pursuits.<br>
I hold a Ph.D. in computational modeling and a bachelors degree in mathematics.<br>
When I'm not immersed in code or research, you'll find me enjoying the company of my beloved
cats,<br>
diving into captivating manga stories, and honing my skills in the world of DotA.<br>
Balancing my love for mathematics and technology is a fulfilling journey that I'm truly
dedicated to.
</p>
<h2 class="title is-4">Education</h2>
<ul class="mb-4">
<li>Bachelor's degree in Mathematics from the Federal University of Espírito Santo (2011)</li>
<li>Master's and Ph.D. in Computational Modeling from the Federal University of Juiz de Fora
(2014,2018); </li>
</ul>
<h2 class="title is-4">Skills</h2>
<ul class="mb-4">
<li><b>Programming Languages</b>: Python, Javascript, TypeScript, C, Fortran90</li>
<li><b>Scientific Programming</b>: Pandas, Jupyter, Numpy, SciPy, Sympy, Matlab/Octave, Mathematica
</li><li><b>FrontEnd Frameworks</b>: Next.JS, React, Tailwind CSS, Bulma, Bootstrap
</li>
<li><b>Data visualization</b>: Matplotlib, Gnuplot</li>
<li><b>API Development</b>: REST, GraphQL, Django, Flask, FastAPI</li>
<li><b>Data Scrapping</b>: Selenium, Beautiful Soup</li>
<li><b>Cloud Services</b>: AWS S3, RDS, EC2</li>
<li><b>Databases / Data</b>: Mysql, Postgres, Firebird</li>
<li><b>Graphic Design</b>: Gimp, Inkscape, Corel Draw</li>
<li><b>OS</b>: Linux Mint, Ubuntu, Fedora, Windows</li>
</ul>
<h2 class="title is-4">Languages</h2>
<p class="mb-4">
Spanish, Portuguese and English
</p>
</div>
</section>
<section class="section custom-section">
<div class="container">
<h2 class="title is-4">Projects</h2>
<div class="card custom-card">
<br>
<h3 class="title is-5"><b>An weather app using <s>Flask</s> FastAPI and cookies</b></h3>
<div class="card-image">
<figure class="image is-6by9">
<img src="screenshot_1.png" alt="Weather app screenshot">
</figure>
</div>
<div class="content custom-content">
<ul class="mb-4">
<li>Repo: <a href="https://github.com/jeas560/weather-app-cookies" target="_blank"> https://github.com/jeas560/weather-app-cookies </a></li>
</ul>
</div>
<div class="content custom-content">
<h4 class="title is-6"><b>Description:</b></h4>
<ul class="mb-4">
<li>This web application is designed to provide users with real-time weather information for
their chosen cities.</li>
<li>This project leverages <s>Flask</s> FastAPI, an API <s>micro web</s> framework in Python, for accessing weather
data.</li>
<li>The migration from Flask to FastAPI was given to obtain better code maintenance in the future,
even when in the end, the project changed to Next.js</li>
<li>To enhance the user experience, the application uses cookies to save the selected
cities.</li>
<li>This means that users won't have to re-enter their location each time they visit the
site.</li>
<li>Finally, using Bulma for styling the web application ensures a responsive and clean
design.</li>
</ul>
<br>
</div>
</div>
<div class="card custom-card">
<br>
<h3 class="title is-5"><b>Django CRM deployable in Vercel</b></h3>
<div class="card-image">
<figure class="image is-6by9">
<img src="screenshot_3.png" alt="CRM-Login">
</figure>
<br/>
<figure class="image is-6by9">
<img src="screenshot_4.png" alt="CRM-Sheet">
</figure>
</div>
<div class="content custom-content">
<ul class="mb-4">
<li>Link: <a href="https://django-crm-postgres.vercel.app/" target="_blank"> https://django-crm-postgres.vercel.app/ </a></li>
<li>Repo: <a href="https://github.com/jeas560/Django_CRM" target="_blank"> https://github.com/jeas560/Django_CRM </a></li>
</ul>
</div>
<div class="content custom-content">
<h4 class="title is-6"><b>Description:</b></h4>
<ul class="mb-4">
<li>This web application is designed to provide a CRM of clients basic informations. </li>
<li>A login authorization is needed in order to add, change or remove data. </li>
<li>A remote PostgresDB is used. </li>
<li>JavaScript was used to add some visual effects, like alerts. </li>
<li>Tailwind CSS was used to styling the web application. </li>
</ul>
<br>
</div>
</div>
<div class="card custom-card">
<br>
<h3 class="title is-5"><b>Another weather app using, but this time using Next.js, TypeScript, Tailwind CSS and cookies</b></h3>
<div class="card-image">
<figure class="image is-6by9">
<img src="screenshot_2.png" alt="Weather app screenshot">
</figure>
</div>
<div class="content custom-content">
<ul class="mb-4">
<li>Link: <a href="https://weather-app-cookies.vercel.app/" target="_blank"> https://weather-app-cookies.vercel.app/ </a></li>
<li>Repo: <a href="https://github.com/jeas560/weather_app_cookies" target="_blank"> https://github.com/jeas560/weather_app_cookies </a></li>
</ul>
</div>
<div class="content custom-content">
<h4 class="title is-6"><b>Description:</b></h4>
<ul class="mb-4">
<li>This web application is designed to provide users with real-time weather information for
their chosen cities too. </li>
<li>In this project the objectives were different than the another one, but the results are quite similar </li>
<li>We used TypeScript (JavaScript with syntax for types) to manage the data fetch and validations. </li>
<li>React and Next.JS where used to build the components dynamically and in an easy way. </li>
<li>However, the application uses cookies to save the selected cities too. </li>
<li>Tailwind CSS was used to styling. </li>
</ul>
<br>
</div>
</div>
</div>
<div class="container">
<h2 class="title is-4">Another Projects</h2>
<div class="card custom-card">
<br>
<div class="content custom-content">
<ul class="mb-4">
<li><a href="https://github.com/jeas560/python_api_rds_postgres" target="_blank"><b>Python ETL script - Data Engineer</b></a>:
<ul>
<li><b>Description</b>: A script to extract, transform and load the data from an API to a Postgres database locally (Docker) or remotelly (AWS-RDS)</li>
<li><b>Technologies</b>: Python, Docker, Sqlalchemy, Postgres, AWS RDS, Pandas, Poetry</li>
</ul>
</li>
<li><a href="https://github.com/jeas560/fastapi-react-todo" target="_blank"><b>FastAPI/React integration Project - Tutorial (PT-BR)</b></a>:
<ul>
<li><b>Description</b>: A tutorial in Portuguese about FastAPI (Backend) and React (Frontend) integration</li>
<li><b>Technologies</b>: Python, FastAPI, Sqlite, Poetry, Pydantic, Uvicorn, REST</li>
</ul>
</li>
</ul>
<br>
</div>
</div>
</div>
</section>
</main>
<footer class="footer custom-footer">
<p>Let's Chat:</p>
<div class="icon-container">
<a href="https://www.linkedin.com/in/jonathan-esteban-arroyo-silva/" target="_blank">
<img src="linkedin-icon.svg" alt="LinkedIn Profile">
</a>
<a href="https://github.com/jeas560" target="_blank">
<img src="github-icon.svg" alt="Github Profile">
</a>
<a href="mailto:jeas560@gmail.com" target="_blank">
<img src="email-icon.svg" alt="Gmail">
</a>
</div>
</footer>
<script src="index.js"></script>
</body>
</html>