-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
263 lines (263 loc) · 11.1 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
<!DOCTYPE html>
<html lang="en">
<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>Curriculum Vitae - Marcin Ciesielski</title>
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.2/css/all.min.css"
integrity="sha512-1sCRPdkRXhBV2PBLUdRb4tMg1w2YPf37qatUFeS7zlBy7jJI8Lf4VHwWfZZfpXtYSLy85pkm9GaYVYMfw5BC1A=="
crossorigin="anonymous"
referrerpolicy="no-referrer"
/>
<link rel="stylesheet" href="cv_marcinciesielski.css" />
</head>
<body>
<main class="container">
<div class="Name">
<h1>Marcin Ciesielski</h1>
<h3>Frontend Developer</h3>
</div>
<div class="Vitae">
<p>Curriculum Vitae</p>
</div>
<section class="Contact box">
<h2 class="subdiv">About</h2>
<div class="infobox">
<p class="bold">Name and surname:</p>
<p>Marcin Ciesielski</p>
</div>
<div class="infobox">
<p class="bold">City:</p>
<p>Trzemeszno, near Gniezno</p>
</div>
<div class="infobox">
<p class="bold">Date of birth:</p>
<p>1981</p>
</div>
<div class="infobox">
<p class="bold">Contact:</p>
<ul class="ctx">
<li>
<a href="tel:693642120"><i class="fa-solid fa-phone"></i>693 642 120</a>
</li>
<li>
<a href="mailto:biuro@lunaweb.pl"
><i class="fa-solid fa-envelope"></i>biuro@lunaweb.pl</a
>
</li>
<li>
<a href="https://github.com/cytrobit" target="_blank"
><i class="fa-brands fa-github"></i>https://github.com/cytrobit</a
>
</li>
<li>
<a href="https://www.lunaweb.pl/" target="_blank"
><i class="fa-solid fa-globe"></i>www</a
>
</li>
<li>
<a href="https://www.instagram.com/cytrobit/" target="_blank"
><i class="fa-brands fa-instagram"></i>Instagram</a
>
</li>
</ul>
</div>
<div class="infobox">
<p class="bold">Education</p>
<ul class="schools">
<li>
<span class="bolder">2020 - 2021</span> Collegium Da Vinci in Poznań, postgraduate
studies, Frontend Developer (JavaScript, TypeScript, Angular)
</li>
<li>
<span class="bolder">2000 - 2005</span> Kazimierz Wielki University in Bydgoszcz,
master degree in Resocialization Pedagogy.
</li>
</ul>
</div>
<div class="infobox">
<p class="bold">Skills</p>
<p class="small">On daily basis I use:</p>
<p class="small">
HTML, CSS, JavaScript, React, Git, GitHub, RWD, Bootstrap, Tailwind, Npm, Chrome Dev
Tools, VS Code, Stackoverflow.
</p>
<p class="small">
I learn Next.js and Three.js, I also made one app in Angular + TypeScript for my
postgraduate diploma.
</p>
<p class="small">English - B2</p>
</div>
</section>
<section class="Profile box">
<h2 class="subdiv">Profile</h2>
<p>
As a freelancer in FrontEnd Development I have made several commercial projects
(sutasz.art, pracowniadialogu.com.pl, tobasport.pl, intergalactic.shop.pl,
zielarskieterapie.pl) from scratch (HTML, CSS, JavaScript, RWD, Bootstrap). Until now I do
cooperate with owners. Currently I work on holiday resort in Podlaskie Voivodeship. During
my work as a social worker I have created calculator to count 90 days of insurance for our
Clients and I received a lot of positive feedback from all over Poland. I'm responsible,
result-oriented developer with great willing to learn new skills.
</p>
<p>My hobbies are: frontend development, demoscene and music composition.</p>
</section>
<section class="Projects box">
<h2 class="subdiv">Projects</h2>
<h3>Commercial projects:</h3>
<ul>
<li>
<a href="https://www.sutasz.art" target="_blank">https://www.sutasz.art</a>
<p>
E-commerce fully responsive webpage with handmade sutache jewellery. It does not
contain shopping cart basket because items are unique and order form is based on name
index system. Based on HTML, CSS and JavaScript technology. Contact form written in
PHP.
</p>
</li>
<li>
<a href="http://www.zielarskieterapie.pl/" target="_blank"
>http://www.zielarskieterapie.pl</a
>
<p>
Fully responsive webpage with herbal oils, oitments and syrups. Everything you need to
keep your body healthy. Based on HTML, CSS and JavaScript technology. Super easy to
build site but a lady customer was very happy with design I made.
</p>
</li>
<li>
<a href="https://pracowniadialogu.com.pl/" target="_blank"
>https://pracowniadialogu.com.pl</a
>
<p>
Fully responsive webpage about judical mediation and biofeedback therapy. It contains
highly detailed information in mediation area. Its based on HTML, CSS Grid, CSS Flex
and JavaScript.
</p>
</li>
<li>
<a href="https://frontend.ovh" target="_blank">https://frontend.ovh</a>
<p>
This is temporary site, current customer can see the progress on my work. Fully
responsive page about holiday resort in Podlaskie Voivodeship.
</p>
</li>
<li>
<a href="https://intergalactic.shop.pl" target="_blank"
>https://intergalactic.shop.pl</a
>
<p>
This is a page of music band "SPR & Cytrobit". It contains animations at
the top, navigation bar icons disappear during scrolling down (window.addEventListener
scroll). After 1100px of scrolling down, arrow icon appears to go to the top of a page
(scrollTop property)
</p>
</li>
<li>
<a href="https://www.tobasport.pl/" target="_blank">https://www.tobasport.pl</a>
<p>
My first commercial project. Design has been rebuilt in 2022, first standed for last 4
years and was made by me too. This company organizes holidays for kids with special
needs. The page is based on Bootstrap library.
</p>
</li>
<li>
<a href="https://www.lunaweb.pl/" target="_blank">https://www.lunaweb.pl</a>
<p>
This is my own web page written in React JS, Next JS, Three JS and Tailwind. It
includes all my commercial projects I made. Contact form is based on Getform.io
endpoint.
</p>
</li>
</ul>
<h3>GitHub</h3>
<ul>
<li>
<a href="https://github.com/cytrobit/fetch-github-data" target="_blank"
>https://github.com/cytrobit/fetch-github-data</a
>
<p>
Fetching the User data from GitHub API. App will display User picture, User name or
User login, depending if User name exists. If not User login appear. The same with
User blog address - if exists it will be displayed, if not GitHub address will be
shown.
</p>
</li>
<li>
<a href="https://cytrobit.github.io/officeShop/" target="_blank"
>https://cytrobit.github.io/officeShop</a
>
<p>
E-commerce webpage with shopping cart. Its based on Udemy course but I added a lot of
features, like RWD, basket with red dot which says there are items in shopping cart
(red dot vanishes when cart is empty), animations, additional sections to make it more
complex.
</p>
</li>
<li>
<a href="https://github.com/cytrobit/angularMusicMachine" target="_blank"
>https://github.com/cytrobit/angularMusicMachine</a
>
<p>
AKAI Music Machine is a kind of sampler based on music samples. It lets you compose
your own music. Written in Angular and TypeScript for my postgraduate diploma.
Requires installing Angular dependencies. Working version address:
<a href="https://www.cytrobit.com/akai" target="_blank">here</a>
</p>
</li>
<li>
<a href="https://github.com/cytrobit/jsMusicMachine" target="_blank"
>https://github.com/cytrobit/jsMusicMachine</a
>
<p>The same AKAI Music Machine app but written in pure JavaScript.</p>
</li>
<li>
<a href="https://cytrobit.github.io/hamburgers/" target="_blank"
>https://cytrobit.github.io/hamburgers</a
>
<p>
Just playing fun with some CSS animations. Its based on three spans which make
hamburger menu together, transforms, rotations, transformations on them. Significant
part is transform-origin property there.
</p>
</li>
<li>
<a href="https://cytrobit.github.io/passgen/" target="_blank"
>https://cytrobit.github.io/passgen</a
>
<p>
Passgen its a password generator which uses letters and numbers. Additionaly you can
add special chars array. Password is limited from 5 to 24 signs. Current version is
based on polish language however in near future I want to add an option to switch
whole app to english.
</p>
</li>
<li>
<a href="https://cytrobit.github.io/404error/" target="_blank"
>https://cytrobit.github.io/404error</a
>
<p>
Simple 404 Page Not fFound page with 404 numbers in infinity animation mode. Also
there is a small svg bug which floats around whole page and when it comes to the
border of screen it bounce back to opposite direction. It uses window.innerHeight and
innerWidth properties.
</p>
</li>
<li>
<a href="https://cytrobit.github.io/90daysCalc/" target="_blank"
>https://cytrobit.github.io/90daysCalc</a
>
<p>
This app counts 90 days of health insurance for unemployed people. It is in use in
dozens of polish OPS offices around whole Poland. Based on Date() object which helps
to work on date and time data.
</p>
</li>
</ul>
</section>
</main>
</body>
</html>