The first spark
Got curious about how games and websites were made, opened a code editor for the first time, and wrote my very first lines of code. I was hooked immediately.
hi, i’m
Cyrus Daniel Madriaga
cyrus@portfolio:~$ whoami
Junior developer at Club Mobile App and Web Development.I started writing code in Grade 7 and never stopped. Today I build responsive web and mobile experiences as a Junior Developer with my club, turning ideas into things people can actually click, tap, and use.
// about me
From curiosity to code
Every developer has a first spark. Mine happened in Grade 7, and it never faded.
It started with a simple question: how are websites and games actually made? One answer led to another, and soon I was writing my first lines of code. Since then, programming has grown from a hobby into the thing I want to do for a living.
Through junior high school and senior high, I kept building — small pages at first, then complete mini apps like a calculator and a weather app. I care about how things look and feel as much as how they work, which is why I spend extra time on clean layouts, smooth interactions, and interfaces that feel good to use.
Today I'm a Junior Developer at the Club Mobile App and Web Development, where I build alongside other student developers and learn what it means to ship real projects as a team. I'm still early in my journey — and that's exactly what makes it exciting.
- Role
- Junior Developer
- Club
- Mobile App and Web Development
- Focus
- Web & mobile interfaces
- Stack
- HTML · CSS · JavaScript
- Started
- Grade 7 — still going
// journey
How I got here
Six years of curiosity, practice, and a lot of broken code that eventually worked.
Building the foundations
Learned HTML, CSS, and JavaScript properly. Practiced by rebuilding pages I liked, breaking them, and figuring out how to fix them — which is still my favorite way to learn.
Shipping real apps
Started finishing what I started: a full calculator, a weather app, and other mini projects. Shifted my focus to clean, responsive interfaces that work on any screen.
Junior Developer at the Club
Now contributing to real projects with the Club Mobile App and Web Development team — writing code with others, reviewing, iterating, and learning what it takes to build software as a team.
// projects
Things I’ve built
These aren’t screenshots — every app below is running live, right here on this page. Try them; the task list and expense tracker even remember your changes after a refresh.
Calculator
0
Made with ♥ by Cyrus Daniel Madriaga
A calculator that does the math right
A glassy calculator with a hand-written expression evaluator — operator precedence included, and no eval(). Division by zero shows a friendly error instead of crashing.
HTMLCSSJavaScript
Weather App
☀️
31°C
Sunny
Manila, PH
Humidity74%
Wind12 km/h
Feels like33°C
Visibility10 km
Weather, one search away
Search a city to see its current conditions — temperature, humidity, wind, feels-like, and visibility — with quick-pick chips for the cities I check most.
HTMLCSSJavaScript
Grade Tracker
General average
—
Know where you stand
A student grade book that computes your general average live, flags passing marks at 75, and keeps the list tidy with per-subject delete.
HTMLCSSJavaScript
Club Attendance
0/0 present
Who showed up today
A meeting check-in tool for club sessions: tap a member to toggle present or absent, and the attendance bar updates in real time.
HTMLCSSJavaScript
Study Timer
25:00
focus session
0 sessions completed
Focus, then rest
A Pomodoro-style study timer — 25 minutes of focus, then a 5-minute break. The ring drains as time runs out, and every finished session is counted.
HTMLCSSJavaScriptSVG
Task Manager
0 tasks left
A list that remembers
Add, check off, filter, and clear tasks. Everything is saved in localStorage, so your list is still there after a refresh.
HTMLCSSJavaScriptlocalStorage
Web Dev Quiz
Question 1 of 5
Five questions, instant feedback
A five-question web development quiz with right-or-wrong feedback the moment you answer, a progress bar, and a score screen at the end.
HTMLCSSJavaScript
Typing Speed Test
Speed0 wpm
Accuracy100%
Time left30s
How fast can you type?
A 30-second typing test that measures your speed and accuracy live, with per-character feedback on the sentence as you go.
HTMLCSSJavaScript
Password Generator
Press generate
—
Strong passwords, one click
Generate passwords with the Web Crypto API — pick a length, choose your character sets, and watch the strength meter react.
HTMLCSSJavaScriptWeb Crypto
Expense Tracker
Total spent₱0
Where the money goes
Track daily spending in pesos: add expenses by category, watch the total update, and see the breakdown in the category bars. Saved in localStorage.
HTMLCSSJavaScriptlocalStorage
// toolkit
What I work with
The tools I reach for every day, and the ones I’m teaching myself next.
Comfortable with
The everyday tools behind every project on this page.
- HTML5
- CSS3
- JavaScript
- Tailwind CSS
- Responsive design
- Git & GitHub
- UI design
Currently learning
What I’m studying now to level up as a developer.
- React
- Node.js
- UI animation
- Mobile app development
// contact
Let’s build something
I’m always up for a new project, a club collaboration, or just talking about code.