Sign in

kolonatalie

@kolonatalie.bsky.social
35 followers 64 following 69 posts

Creative Developer (Frontend) Engineering immersive web apps with React, TS, GSAP, and Three.js Focusing on 60fps motion, clean architecture & 3D. Ex-AR Creator solving the design-to-code gap. kolonatalie.vercel.app/go

PostsRepliesMedia
kolonatalie @kolonatalie.bsky.social · 26/03/2026
Interactive 3D Liquid Glass Experience exploring glassmorphism and real-time physics. • Three.js & WebGL • Rapier WASM Physics • Dynamic Marching Cubes • GSAP • Optimized for with adaptive resolution. Live: liquid-glass-experience.vercel.app #Threejs #CreativeCoding #WebGL #Typescript #GSAP
050
kolonatalie @kolonatalie.bsky.social · 16/03/2026
People say "animations should only solve problems." My magnetic button solves zero problems. It just looks cool and proves I can code complex effects without killing your CPU. I’m just here for the smooth hover effects, honestly. ✨ #CreativeDev #GSAP #Frontend
000
kolonatalie @kolonatalie.bsky.social · 26/01/2026
Frontend wisdom: If it looks great but lags – it’s broken. Just optimized this button explosion effect, slashing latency from 700ms to <30ms using WebGL pre-rendering.👌🏻 Mental state: 75% frustrated, 100% in love with Three.js and GSAP #frontend #webdev #juniordev #threejs #GSAP #react #typescript
240
kolonatalie @kolonatalie.bsky.social · 19/01/2026
Just gave my CodePen profile a makeover via custom CSS. Gosh, I love frontend development.💟 codepen.io/kolonatalie #CodePen #Frontend #CSS3 #Glassmorphism #JuniorDeveloper
010
kolonatalie @kolonatalie.bsky.social · 18/12/2025
Giving a classic React tutorial a major glow-up! ✨ Refactored to TypeScript , integrated GSAP for those smooth animations, & finally threw in React Snowfall.❄️ Gosh, I love web dev! 💜 #ReactJS #TypeScript #GSAP #WebDevelopment #Frontend #CodeNewbie
260
kolonatalie @kolonatalie.bsky.social · 25/11/2025
One of the most common JavaScript interview questions: 🟣 What are JavaScript data types? ➜ Primitive Types (Stored by Value) • string • number • boolean • null • undefined • symbol • bigint ➜ Non-Primitive Type (Stored by Reference) • object
100
kolonatalie @kolonatalie.bsky.social · 24/11/2025
There are 22 input types in HTML: ➜ Text: text, password, search, tel, email, url ➜ Numbers: number, range ➜ Dates: date, month, week, time, datetime-local ➜ Choices: checkbox, radio ➜ Buttons: button, submit, reset ➜ Other: file, color, hidden, image #frontend
010
kolonatalie @kolonatalie.bsky.social · 23/11/2025
🟣 JavaScript is the #1 most used programming language in the world. Every major global survey (StackOverflow, GitHub, JetBrains) ranks it #1 year after year. 🟣 React is the most in-demand frontend framework. 🟣 TypeScript is now the default in many companies using React. #frontend #web #javascript
030
kolonatalie @kolonatalie.bsky.social · 22/11/2025
I made a cool analogy: Git branches are like parallel timelines in a sci-fi movie. The main branch is the sacred, final reality. You clone it to a new timeline (your feature branch) to experiment. If the experiment works, you merge it back into the main reality. If not, you delete the timeline. #git
010
kolonatalie @kolonatalie.bsky.social · 20/11/2025
What I focus on to grow as a frontend dev: • DOM (understand the structure) • Async (timing is everything) • Semantic HTML (accessibility = respect) Advanced tools come and go. Strong basics stay forever.👌🏻 #frontend #webdevelopment #softwareengineer #webdev
020
kolonatalie @kolonatalie.bsky.social · 19/11/2025
✖️ STOP using magic numbers in CSS “Magic numbers” = random pixel values like margin-top: 37px; used just to make things look right for now. They work… until anything changes — then everything breaks.
100
kolonatalie @kolonatalie.bsky.social · 18/11/2025
Today my friend told me: If you want real frontend progress, don’t rely on vibes - build a system. Your go-to structure should be: HTML → CSS → JS → React → Clean Code. Weekly plan: a few focused sessions, one tiny project, one honest self-check. That’s enough. More than enough.👌🏻 #frontend
020
kolonatalie @kolonatalie.bsky.social · 17/11/2025
Everyone says junior frontend devs hate CSS… I love it. It’s where logic meets aesthetics and that’s my sweet spot.💟 Which side are you on? #css #frontend #webdev
020
kolonatalie @kolonatalie.bsky.social · 16/11/2025
5 skills that get junior Frontend Engineers hired fast: 🟣 Clean, readable, minimalistic code. 🟣 Ability to learn tools, APIs, and libraries quickly 🟣 Strong debugging mindset. 🟣 Solid HTML/CSS/JavaScript fundamentals. 🟣 Clear communication: asking questions, updating progress, working async. #code
030
kolonatalie @kolonatalie.bsky.social · 15/11/2025
🟣 Core Principles of Clean Code: ➜ DRY (Don't Repeat Yourself): Avoid duplicating logic. Keep each piece of knowledge in one place. ➜ KISS (Keep It Simple, Stupid): Prioritize simplicity over unnecessary complexity.
110
kolonatalie @kolonatalie.bsky.social · 14/11/2025
Top HTML&CSS Questions for FRONTEND INTERVIEW: 1️⃣ What is HTML? 2️⃣ What are semantic tags in HTML? 3️⃣ What are forms and input types in HTML? 4️⃣ What are key features of HTML5? 5️⃣ How do you create an SEO-friendly HTML structure? 6️⃣ What is the Box Model in CSS?
100
kolonatalie @kolonatalie.bsky.social · 13/11/2025
The minimum viable professional level for a junior frontend developer: 👉🏻 Hard Skills: • HTML5 / CSS3 • JavaScript (ES6+) • React • TypeScript • Sass • Git • GitHub / GitFlow • REST API • English — B1 or higher
110
kolonatalie @kolonatalie.bsky.social · 21/08/2025
Built the classic random quotes page. ✔️ Frontend rite of passage complete. What’s the next cliché project? 😁 #frontend #javaScript #webdev #learningInPublic
Quote of the day web page made with vanilla JavaScript
140
kolonatalie @kolonatalie.bsky.social · 15/08/2025
Learning frontend is fun. I just made a button for a hypothetical website. Now, just a tiny detail: learn how to make the actual site. 🙈😅 #frontend #webdev #CantDoYetButTrying #learninginpublic #CSS
010
kolonatalie @kolonatalie.bsky.social · 14/08/2025
💛 My first portfolio page is live! A playground where I mixed design skills with fresh front-end tricks — CSS variables, radial-gradient backgrounds, fade-in animations, and more. 💡 Always learning, always building: kolonatalie.github.io/portfolio/ #frontend #webdev #CSS #HTML #LearningInPublic
000
kolonatalie @kolonatalie.bsky.social · 12/08/2025
Pastels are cute. Manually picking shades is not. So I built a gradient generator instead. Frontend studies: 1 Frustration: 0 #frontend #webdev #FrontendDev #CSS #JavaScript #WomenWhoCode #HTML #JuniorDev #CareerSwitchToCode #LearningInPublic #learningtocode #coding #frontenddeveloper
120
kolonatalie @kolonatalie.bsky.social · 08/08/2025
🔘 Overflow — like trying to shove too many clothes into a suitcase. Zipper decides. When your content is too much for the container, overflow decides what to do: ▪️visible: let it spill out ▪️hidden: chop it off ▪️scroll: add scrollbars ▪️auto: be smart about it #CantDoYetButTrying #frontend
🔘 Overflow — like trying to shove too many clothes into a suitcase. Zipper decides.

When your content is too much for the container, overflow decides what to do:
 
▪️visible: let it spill out
▪️hidden: chop it off
▪️scroll: add scrollbars
▪️auto: be smart about it

 #CantDoYetButTrying #frontend
010
kolonatalie @kolonatalie.bsky.social · 02/08/2025
I'm so happy I found this fun little web game to practice Flexbox! 24/24 levels — done 👌🏻🐸 I seriously love these frogs ❤️ flexboxfroggy.com #frontend #Flexbox #CSS #webDev #FrontendDev #LearnToCode
020
kolonatalie @kolonatalie.bsky.social · 31/07/2025
Today I came across a new concept in code for me – obfuscation.🙈 I googled it and I already have an awesome analogy, how to remember it: 🔘 Obfuscation is like taking a finished puzzle, then cutting each piece into random shapes. It’s still the same image… somewhere. #CantDoYetButTrying #frontend
110
kolonatalie @kolonatalie.bsky.social · 31/07/2025
🔘 Refactoring is like reorganizing your closet. You're not adding anything new – just tidying what's there: removing duplicates, organizing clothes (variables), putting out-of-season items (functions) where they belong. The goal? Making sure others (or you) can understand it. #CantDoYetButTrying
010
kolonatalie @kolonatalie.bsky.social · 30/07/2025
I’ve realized how confusing some frontend concepts can be. So I’m explaining it using simple analogies. Think: 🔘 z-index is like putting stickers on glass sheets. Whichever one’s higher in the stack, wins. This is part of my series: #CantDoYetButTrying — learning code one messy metaphor at a time
110
kolonatalie @kolonatalie.bsky.social · 29/07/2025
Junior frontend devs — what kind of tasks do you usually get at work? Mids & seniors, what do you pass down to your juniors? 😁 #webdev #frontend #junior
010
kolonatalie @kolonatalie.bsky.social · 26/07/2025
If you had to sum up yourself (or your life right now) in one sentence — what would it be? Mine: Artist at heart, coder in training.
010
kolonatalie @kolonatalie.bsky.social · 22/07/2025
Coding progress update: I can already joke about it. Does that mean I’ve reached the next level? 😁 #frontend #JavaScript #webdev #junior
020
kolonatalie @kolonatalie.bsky.social · 05/07/2025
{⚔️} Day 13 of #CSSBattleDaily streak: Jul 5 — 613.7 score / 354 chars cssbattle.dev/play/9pmoNJO... #CSSBattleChallenge via @cssbattle.dev
cssbattle.dev
CSSBattle
The funnest CSS game for web designers & developers
010
kolonatalie @kolonatalie.bsky.social · 04/07/2025
Today's dilemma. Frontend edition. Should a dev’s portfolio be a Pixar-level animation show, with blinking buttons and a star-shaped cursor — or just a white screen saying: “I know flexbox. Leave me alone”? 😅 What’s your portfolio vibe? #frontend
210
kolonatalie @kolonatalie.bsky.social · 04/07/2025
{⚔️} Day 12 of #CSSBattleDaily streak: Jul 4 — 607.17 score / 422 chars cssbattle.dev/play/lj2GGgG... #CSSBattleChallenge via @cssbattle.dev
cssbattle.dev
CSSBattle
The funnest CSS game for web designers & developers
000
kolonatalie @kolonatalie.bsky.social · 02/07/2025
{⚔️} Day 10 of #CSSBattleDaily streak: Jul 2 — 608.19 score / 408 chars cssbattle.dev/play/qoEpGLP... #CSSBattleChallenge via @cssbattle.dev
cssbattle.dev
CSSBattle
The funnest CSS game for web designers & developers
000
kolonatalie @kolonatalie.bsky.social · 01/07/2025
I'm now a 6 kyū yellow belt on @codewars.bsky.social ! Come join me #codewarriors! codewars.com/r/uyQQaA
codewars.com
Codewars - Achieve mastery through coding practice and developer mentorship
A coding practice website for all programming levels – Join a community of over 3 million developers and improve your coding skills in over 55 programming languages!
000
kolonatalie @kolonatalie.bsky.social · 01/07/2025
Celebrating a little win — created this figure with just 275 characters of CSS! 😍 That’s my smallest code yet in the #CSSBattleChallenge via @cssbattle.dev👌🏻 Jul 1 — 629.09 score / 275 chars cssbattle.dev/play/EcElU81...
cssbattle.dev
CSSBattle
The funnest CSS game for web designers & developers
021
kolonatalie @kolonatalie.bsky.social · 30/06/2025
Jun 30 — 601.08 score / 621 chars {⚔️} Day 8 of #CSSBattleDaily cssbattle.dev/play/MDtNGE9... #CSSBattleChallenge via @cssbattle.dev
cssbattle.dev
CSSBattle
The funnest CSS game for web designers & developers
000
kolonatalie @kolonatalie.bsky.social · 28/06/2025
{⚔️} Day 6 of #CSSBattleDaily streak: Jun 28 — 604.05 score / 482 chars cssbattle.dev/play/b1PeaEW... #CSSBattleChallenge via @cssbattle.dev
cssbattle.dev
CSSBattle
The funnest CSS game for web designers & developers
000
kolonatalie @kolonatalie.bsky.social · 27/06/2025
While solving a task on @codewars.bsky.social today, I remembered the good old Triangle Inequality Theorem — the sum of the lengths of any two sides of a triangle must be greater than the length of the third side. Not sure who else needs this, but I’m leaving it here just in case.😁
000
kolonatalie @kolonatalie.bsky.social · 27/06/2025
{⚔️} Day 5 of #CSSBattleDaily streak: Jun 27 — 624.5 score / 293 chars cssbattle.dev/play/0jHOqAn... #CSSBattleChallenge via @cssbattle.dev
cssbattle.dev
CSSBattle
The funnest CSS game for web designers & developers
010
kolonatalie @kolonatalie.bsky.social · 26/06/2025
{⚔️} Day 3 of #CSSBattleDaily streak: Jun 26 — 596.88 score / 658 chars cssbattle.dev/play/i4qDcCU... #CSSBattleChallenge via @cssbattle.dev
cssbattle.dev
CSSBattle
The funnest CSS game for web designers & developers
010
kolonatalie @kolonatalie.bsky.social · 26/06/2025
My kata today on @codewars.bsky.social You know what I’m most proud of? I actually managed to write that!! 😄 P.S. Two months ago, I would’ve looked at this and said, “What the heck is that?!” #careerchange #javascript #codingjourney #juniorwebdeveloper
010
Reposted by kolonatalie
Amit Sheen @amitsheen.bsky.social · 23/06/2025
✨ New article: Understanding CSS corner-shape and the Power of the Superellipse! A deep dive into the new property, and a little dig into the math behind it, with lots of cool examples, but they only work on Chrome 139+. 🔗 Check it out on @frontendmasters.com: frontendmasters.com/blog/underst...
2469
kolonatalie @kolonatalie.bsky.social · 25/06/2025
Practice for today — done ✅ Honestly, it went faster than I expected! 😊 #CSSBattleDaily Jun 25 — 613.31 score / 357 chars cssbattle.dev/play/xAWKZ9B... #CSSBattleChallenge via @cssbattle.dev
cssbattle.dev
CSSBattle
The funnest CSS game for web designers & developers
021
kolonatalie @kolonatalie.bsky.social · 25/06/2025
Transitioning to IT, frontend focus. Avoiding burnout before my first contract is key 😅. Juggling coding lessons, mentorship, hard skills certs, and daily HTML/CSS/JS practice on multiple resources is a HUGE challenge! Brain's fried, but processing. Confident all this hard work will pay off! ❤️
media.tenor.com
a woman is laying on an office chair in a room with the words `` brain fried '' written on the floor .
ALT: a woman is laying on an office chair in a room with the words `` brain fried '' written on the floor .
010
kolonatalie @kolonatalie.bsky.social · 24/06/2025
{⚔️} Day 2 of #CSSBattleDaily streak: Jun 24 — 605.54 score / 449 chars cssbattle.dev/play/7nlhjaK... #CSSBattleChallenge via @cssbattle.dev
cssbattle.dev
CSSBattle
The funnest CSS game for web designers & developers
010
kolonatalie @kolonatalie.bsky.social · 23/06/2025
{⚔️}Jun 23 — 615.81 score / 339 chars cssbattle.dev/play/xOUPIcx... #CSSBattleDaily #CSSBattleChallenge via @cssbattle.dev
cssbattle.dev
CSSBattle
The funnest CSS game for web designers & developers
010
kolonatalie @kolonatalie.bsky.social · 21/06/2025
{⚔️} #CSSBattleDaily: Jun 21 — 597.23 score / 484 chars cssbattle.dev/play/S9P3lP0... #CSSBattleChallenge via @cssbattle.dev
cssbattle.dev
CSSBattle
The funnest CSS game for web designers & developers
010
kolonatalie @kolonatalie.bsky.social · 20/06/2025
My daily practice for #CSSBattleDaily: Jun 20 — 621.44 score / 307 chars cssbattle.dev/play/cWfGYKq... #CSSBattleChallenge via @cssbattle.dev
cssbattle.dev
CSSBattle
The funnest CSS game for web designers & developers
020
Reposted by kolonatalie
Roberto Ranon @robertoranon.bsky.social · 18/06/2025
The Crushing Silences of Boredom made with JavaScript code #digitalart · #generativeart · #creativecoding · #abstractart
Abstract digital artwork, made with JavaScript code
0161
Reposted by kolonatalie
Master.dev (Formerly Frontend Masters) @frontendmasters.com · 19/06/2025
Drawing CSS Shapes using corner-shape After you've got a `border-radius`, you can control the shape of the corner with `corner-shape`, which unlocks a simpler and more powerful way to make shapes compared to `clip-path()`.
frontendmasters.com
Drawing CSS Shapes using corner-shape
After you've got a `border-radius`, you can control the shape of the corner with `corner-shape`, which unlocks a simpler and more powerful way to make shapes compared to `clip-path()`.
0156