Compare commits
No commits in common. "b82e4f99f893dc1727f50a702363d710e45c2e93" and "3cdce4f4037491f570ff1cadf6d0d5ee2adfdeca" have entirely different histories.
b82e4f99f8
...
3cdce4f403
164
index.html
@ -16,7 +16,11 @@
|
|||||||
|
|
||||||
<body>
|
<body>
|
||||||
|
|
||||||
<div id="scroll-container-element" class="scroll-container h-screen overflow-y-scroll" autofocus>
|
<div
|
||||||
|
id="scroll-container-element"
|
||||||
|
class="scroll-container h-screen overflow-y-scroll"
|
||||||
|
autofocus
|
||||||
|
>
|
||||||
|
|
||||||
<div class="h-screen mx-auto relative">
|
<div class="h-screen mx-auto relative">
|
||||||
|
|
||||||
@ -43,173 +47,21 @@
|
|||||||
Front-End, soon to be Back-End developer from Perú 🇵🇪
|
Front-End, soon to be Back-End developer from Perú 🇵🇪
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<p class="font-xanh text-center text-4xl absolute w-full bottom-10">
|
<h2 class="font-xanh text-center text-4xl absolute w-full bottom-10">
|
||||||
What I've done over the years
|
What I've done over the years
|
||||||
<br>
|
<br>
|
||||||
<br>
|
<br>
|
||||||
↓
|
↓
|
||||||
</p>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="bg-slate-800 h-screen grid grid-cols-2">
|
|
||||||
|
|
||||||
<div class="flex justify-center flex-col">
|
|
||||||
|
|
||||||
<div class="max-w-[90%] mx-auto">
|
|
||||||
<h2 class="font-xanh text-4xl">
|
|
||||||
Horarios UNSA
|
|
||||||
</h2>
|
</h2>
|
||||||
|
|
||||||
<p>
|
|
||||||
<span>
|
|
||||||
<a class="underline" href="https://horarios-v1.araozu.dev/" target="_blank">
|
|
||||||
https://horarios-v1.araozu.dev/</a>
|
|
||||||
</span>
|
|
||||||
·
|
|
||||||
<span>
|
|
||||||
<a class="underline" href="https://git.araozu.dev/fernando/horarios-v1" target="_blank">
|
|
||||||
Git repo
|
|
||||||
</a>
|
|
||||||
</span>
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<img class="rounded-xl" src="/public/img/horarios_1.png" alt="Image of Horarios UNSA">
|
|
||||||
|
|
||||||
<div class="py-4">
|
|
||||||
<img class="h-12 rounded-md" src="/public/icons/js.png" alt="JS logo">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="flex justify-center flex-col">
|
<div class="bg-slate-800 h-screen">
|
||||||
<p class="my-2">
|
a
|
||||||
At my university, the schedule is a mess. We would be given images with the schedule
|
|
||||||
for all the courses, and we would have to manually search & match the courses we
|
|
||||||
wanted to take.
|
|
||||||
</p>
|
|
||||||
<p class="my-2">
|
|
||||||
So I made a website where you could see which courses overlap, their professors,
|
|
||||||
and the classrooms they were in, in a interactive table.
|
|
||||||
</p>
|
|
||||||
<p class="my-2">
|
|
||||||
I made the page completely in vanilla JS, all elements & animations were created dynamically
|
|
||||||
using DOM primitives. It was deployed on a free hosting service.
|
|
||||||
</p>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="bg-red-950 h-screen grid grid-cols-2">
|
|
||||||
|
|
||||||
<div class="flex justify-center flex-col">
|
|
||||||
|
|
||||||
<div class="max-w-[90%] mx-auto">
|
|
||||||
<h2 class="font-xanh text-4xl">
|
|
||||||
PseudoSubs
|
|
||||||
</h2>
|
|
||||||
|
|
||||||
<p>
|
|
||||||
<span>
|
|
||||||
<a class="underline" href="https://pseudosubs-v1.araozu.dev/" target="_blank">
|
|
||||||
https://pseudosubs-v1.araozu.dev/</a>
|
|
||||||
</span>
|
|
||||||
·
|
|
||||||
<span>
|
|
||||||
<a class="underline" href="https://git.araozu.dev/fernando/pseudosubs-v1" target="_blank">
|
|
||||||
Git repo
|
|
||||||
</a>
|
|
||||||
</span>
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<img class="rounded-xl" src="/public/img/pseudo_1.png" alt="Image of Horarios UNSA">
|
|
||||||
|
|
||||||
<div class="py-4">
|
|
||||||
<img class="h-12 rounded-md inline-block" src="/public/icons/php.png" alt="PHP logo">
|
|
||||||
/
|
|
||||||
<img class="h-12 rounded-md inline-block" src="/public/icons/vue.png" alt="VueJS logo">
|
|
||||||
<img class="h-12 rounded-md inline-block" src="/public/icons/sass.png" alt="Sass logo">
|
|
||||||
·
|
|
||||||
<img class="h-12 rounded-md inline-block" src="/public/icons/node.png" alt="Node logo">
|
|
||||||
<img class="h-12 rounded-md inline-block" src="/public/icons/ts.png" alt="TS logo">
|
|
||||||
<img class="h-12 rounded-md inline-block bg-white p-1" src="/public/icons/express.png"
|
|
||||||
alt="Express logo">
|
|
||||||
·
|
|
||||||
<img class="h-12 rounded-md inline-block bg-white" src="/public/icons/mysql.png"
|
|
||||||
alt="MySQL logo">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="flex justify-center flex-col">
|
|
||||||
<p class="my-2">
|
|
||||||
Between 2017 & 2019 I became interested in fansubbing anime. I made a website
|
|
||||||
where you could download subtitles for anime.
|
|
||||||
</p>
|
|
||||||
<p class="my-2">
|
|
||||||
The website was first made in PHP, although most of the pages were static.
|
|
||||||
At the time I didn't know about databases, so I made my own file based database,
|
|
||||||
with a custom format in PHP. Unfortunately I lost the code for this version.
|
|
||||||
</p>
|
|
||||||
<p class="my-2">
|
|
||||||
I later remade the website in VueJS and Express. I also learned about databases
|
|
||||||
and used MySQL.
|
|
||||||
</p>
|
|
||||||
<p class="my-2">
|
|
||||||
I also learned about domain names, A/AAAA/CNAME records, shared hosting &
|
|
||||||
integrating with external services like analytics & disqus.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="bg-lime-950 h-screen grid grid-cols-2">
|
|
||||||
|
|
||||||
<div class="flex justify-center flex-col">
|
|
||||||
|
|
||||||
<div class="max-w-[90%] mx-auto">
|
|
||||||
<h2 class="font-xanh text-4xl">
|
|
||||||
Web Hostal
|
|
||||||
</h2>
|
|
||||||
|
|
||||||
<p>
|
|
||||||
<span>
|
|
||||||
<a class="underline" href="https://pseudosubs-v1.araozu.dev/" target="_blank">
|
|
||||||
https://pseudosubs-v1.araozu.dev/</a>
|
|
||||||
</span>
|
|
||||||
·
|
|
||||||
<span>
|
|
||||||
<a class="underline" href="https://git.araozu.dev/fernando/WebHostal" target="_blank">
|
|
||||||
Git repo
|
|
||||||
</a>
|
|
||||||
</span>
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<img class="rounded-xl" src="/public/img/pseudo_1.png" alt="Image of Horarios UNSA">
|
|
||||||
|
|
||||||
<div class="py-4">
|
|
||||||
<img class="h-12 rounded-md inline-block bg-white" src="/public/icons/java.png" alt="Java logo">
|
|
||||||
<img class="h-12 rounded-md inline-block" src="/public/icons/tomcat.webp" alt="Tomcat logo">
|
|
||||||
<img class="h-12 rounded-md inline-block" src="/public/icons/git.png" alt="Git logo">
|
|
||||||
<img class="h-12 rounded-md inline-block" src="/public/icons/gcloud.png"
|
|
||||||
alt="Google cloud logo">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="flex justify-center flex-col">
|
|
||||||
<p class="my-2">
|
|
||||||
A simple system for a fictional hostel, made for my university's web development course.
|
|
||||||
</p>
|
|
||||||
<p class="my-2">
|
|
||||||
Here I learned more about Java, JSP, Servlets, JDBC, Git, Tomcat, and deploying
|
|
||||||
to the cloud.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
@ -1,43 +0,0 @@
|
|||||||
2017
|
|
||||||
|
|
||||||
Horarios UNSA 1
|
|
||||||
|
|
||||||
2018
|
|
||||||
? PseudoSubs 1
|
|
||||||
July Web Hostal
|
|
||||||
|
|
||||||
|
|
||||||
2019
|
|
||||||
|
|
||||||
June acechanime
|
|
||||||
Nov horarios UNSA 2
|
|
||||||
Nov modoki
|
|
||||||
|
|
||||||
2020
|
|
||||||
|
|
||||||
April misti-lang
|
|
||||||
March kscript-web
|
|
||||||
July emisa
|
|
||||||
July to_games
|
|
||||||
Sept rimajon_be
|
|
||||||
Sept rimajon
|
|
||||||
|
|
||||||
2021
|
|
||||||
|
|
||||||
Jan horarios UNSA 3
|
|
||||||
April misti-web
|
|
||||||
|
|
||||||
2022
|
|
||||||
|
|
||||||
All fac-psicologia
|
|
||||||
|
|
||||||
2023
|
|
||||||
|
|
||||||
July thp-lang
|
|
||||||
July thp-web
|
|
||||||
July md-docs
|
|
||||||
July eegsac
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
Before Width: | Height: | Size: 10 KiB |
|
Before Width: | Height: | Size: 9.3 KiB |
|
Before Width: | Height: | Size: 11 KiB |
|
Before Width: | Height: | Size: 24 KiB |
|
Before Width: | Height: | Size: 213 KiB |
|
Before Width: | Height: | Size: 94 KiB |
|
Before Width: | Height: | Size: 159 KiB |
|
Before Width: | Height: | Size: 156 KiB |
|
Before Width: | Height: | Size: 18 KiB |
|
Before Width: | Height: | Size: 3.2 KiB |
|
Before Width: | Height: | Size: 29 KiB |
|
Before Width: | Height: | Size: 7.8 KiB |
|
Before Width: | Height: | Size: 137 KiB |
|
Before Width: | Height: | Size: 104 KiB |
|
Before Width: | Height: | Size: 236 KiB |