-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathportfolio.html
More file actions
184 lines (179 loc) · 8.9 KB
/
Copy pathportfolio.html
File metadata and controls
184 lines (179 loc) · 8.9 KB
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
<!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="./Resources/CSS/portfolio.css"
/>
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css"
/>
<title>Felixius Gunawan - WEB3 Developer</title>
</head>
<body>
<!-- Header -->
<header class="header">
<div class="content">
<h1>Felixius Gunawan</h1>
<nav class="navbar">
<ul>
<li><a href="#about-me">About Me</a></li>
<li><a href="#project">Project</a></li>
<li><a href="#skills">Skills</a></li>
<li><a href="./contact.html">Contact</a></li>
</ul>
</nav>
<button id="openNav" class="meanmenu">
<div class="menu-icon">
<div class="bar"></div>
<div class="bar"></div>
<div class="bar"></div>
</div>
</button>
<div id="navPane" class="sidenav">
<a href="javascript:void(0)" class="closebtn" id="closeNav">
<i class="fa-solid fa-xmark"></i>
</a>
<a href="#about-me">About Me</a>
<a href="#project">Project</a>
<a href="#skills">Skills</a>
<a href="./contact.html">Contact</a>
</div>
<button id="toggle-dark">
<i class="fa-solid fa-circle-half-stroke"></i>
</button>
</div>
</header>
<!-- Main Content -->
<main role="main">
<section id="about-me">
<h2>About Me</h2>
<div class="about-container">
<div class="article">
<p>
Hi! My name is Felixius Gunawan, and I’m a civil engineer turned Web3 engineer with a deep passion for building—whether it’s physical infrastructure or decentralized digital systems.
</p>
<br>
<p>
I began my professional journey in the world of civil engineering, where I learned the fundamentals of structural design, problem-solving under constraints, and delivering tangible solutions that impact people’s lives. Through my time in the field, I developed a strong foundation in logic, mathematics, and systems thinking—skills that unexpectedly became the cornerstone of my transition into the world of blockchain and Web3 development.
</p>
<br>
<p>
Fascinated by the promise of decentralized technology and its potential to reshape industries, I made a bold shift from traditional engineering to the emerging frontier of Web3. I immersed myself in blockchain architecture, smart contract development, and cryptographic security—applying the same rigor and precision I once used to design infrastructure, now toward creating trustless, transparent digital ecosystems.
</p>
<br>
<p>
Today, I specialize in building decentralized applications (dApps), smart contracts, and integrating blockchain protocols into real-world solutions. I bring a unique perspective to the space, combining the discipline of engineering with the creativity and adaptability required in the fast-evolving world of Web3.
</p>
<br>
<p>
My mission is simple: <b>to build technology that empowers individuals and communities through openness, autonomy, and innovation.</b> Whether contributing to open-source projects, working on DeFi protocols, or exploring zero-knowledge solutions, I approach every challenge with a builder’s mindset and a belief in the future of decentralized systems.
</p>
</div>
<div class="profile">
<img
src="./Resources/Images/ChatGPT Image May 30, 2025, 01_06_36 PM.png"
alt="My Profile Picture"
/>
</div>
</div>
</section>
<section id="project">
<div class="project-container">
<h2>Projects</h2>
<div class="project-tile">
<div class="tile one">
<a
href="https://codepen.io/Felixius-Gunawan/pen/qEdbVRy" target="_blank"
id="profile-link">
<img class="projects-images"
src="./Resources/Images/company-web.png"
alt="JC Ventures Company Website">
<p class="caption">
<span class="code">< </span>
JC Ventures Company Website
<span class="code"> /></span>
</p>
</a>
</div>
<div class="tile two">
<a
href="https://codepen.io/Felixius-Gunawan/pen/PwqZOjY" target="_blank"
id="profile-link">
<img class="projects-images"
src="./Resources/Images/sport-community1.png"
alt="Padel Clan Community">
<p class="caption">
<span class="code">< </span>
Padel Clan Community Website
<span class="code"> /></span>
</p>
</a>
</div>
<div class="tile three">
<a
href="https://codepen.io/Felixius-Gunawan/pen/PwqZOJo" target="_blank"
id="profile-link">
<img class="projects-images"
src="./Resources/Images/web-design.png"
alt="Web Design System">
<p class="caption">
<span class="code">< </span>
Web Design System
<span class="code"> /></span>
</p>
</a>
</div>
</div>
</div>
</section>
<section id="skills">
<div class="skills-container">
<h2>Skills</h2>
<div class="icons">
<div class="icon">
<i class="fa-brands fa-html5"></i>
</div>
<div class="icon">
<i class="fa-brands fa-css3-alt"></i>
</div>
<div class="icon">
<i class="fa-brands fa-js"></i>
</div>
<div class="icon">
<i class="fa-brands fa-react"></i>
</div>
<div class="icon">
<i class="fa-brands fa-git"></i>
</div>
<div class="icon">
<i class="fa-solid fa-terminal"></i>
</div>
<div class="icon">
<i class="fa-brands fa-python"></i>
</div>
<div class="icon">
<i class="fa-brands fa-node"></i>
</div>
<div class="icon">
<i class="fa-brands fa-github"></i>
</div>
</div>
</div>
</section>
</main>
<!-- Footer -->
<footer>
<p class="copyright">Copyright © 2025. All Rights Reserved.</p>
</footer>
<script
src="./Resources/Javascript/portfolio.js">
</script>
</body>
</html>