design ~ code

Joined June 2022
66 Photos and videos
Started building the first version of the TinyLogs landing page ⚡ • Turborepo setup done • Working on the first UI screens • Goal: make logs structured, readable & contextual so debugging feels faster and cleaner #buildinpublic #webdev
1
4
135
Built the v1 version of tinylogs[.]dev ~ node/express support ✅ ~ per-request logs cli ✅ ~ async context awareness ( no more guessing ) ✅ What's pending ?? ~ better -typescript support ~ vite/react/browser logging This is how it looks right now:
1
2
83
Building tinylogs[.]dev from today i’ve been debugging node apps and logs just feel bad. either it’s just console.log everywhere or there’s no request context (main part) so you can’t trace anything properly We spend more time reading logs than fixing bugs
1
3
70
So in tinylogs , im planning to add these features for now : ~ node/express support ~ per-request logs cli ~ async context ( no more guessing ) ~ browser client support ( react support , later framework agnostic ) ~ clean DX let’s see how it goes
3
52
Shimmered some text today , Pure CSS, no extra deps: 1) text-transparent bg-clip-text and applied some linear-gradient 2) background-position animated with a linear loop Tiny detail, but it makes the UI feel alive ✨ play.tailwindcss.com/FFhr7cl…
3
4
156
How to build @tailwindcss landing page grid lines ? repeating-linear-gradient is the key 🔑
1
69
🧙Modal w/ nested stacking
4
53
🧑‍🍳Cooking modal for my upcoming project
2
137
Check out how percentage values affect your animations 👇
2
99
Accessibility improvement using focus css pseudo class proper blog will be released soon...
3
133
Built code-block.tsx component with syntax highlighting , specific line highlights, indictators, copy-to-clipboard. Inspirations creds: @pqoqubbw @hybrid_alex @shadcn @base_ui
1
4
168
How im rendering that "Line numbers" 👉 In CSS, we can counter lines using "counter()" here's live demo: play.tailwindcss.com/2ye0FRM…
1
2
118
and finally highlighting specific lines using shiki transformers , data-attributes and css !
2
88
Added Shiki syntax highlighter by @antfu7 in my component which follows *Composition Pattern*
3
195
Added copy-to-clipboard <PackageCopy /> component using *Composition Pattern* #WebDevelopment #react #reactjs #frontend #javascript #typescript #UserExperience #opensource
2
145
Built this amazing component You'll see more variations of it in upcoming posts #Frontend #WebDevelopment #nextjs #reactjs
2
108
Sirji course leliya hai, abh linkedin pr likhdu kya "Ai developer" ? @Hiteshdotcom @piyushgarg_dev
3
56
5,879
🪝Hook #2: type-safe useEventListener.ts ⭐Custom hook to attach event listener to window or dom node.
2
175
🪝useIdle hook in React
2
122
Great post , definitely I'll try nikhilll 💪
things no fullstack roadmap will ever teach you 🔥 (31/100) - Rate Limiting with Redis (Sliding Window) every backend dies the same way: one user decides to refresh 200 times per second. rate limiting is how you protect your api, not just from abuse, but from dumb bugs. most devs stop at “x requests per minute.” let’s fix that. 1. the problem basic counters (reqs/min) are easy but bursty. example → 100 reqs allowed/min. a user can still spam all 100 in the first second. 2. sliding window fix use timestamps instead of reset intervals. store each request timestamp in redis sorted set (ZADD). when a new req comes in: •remove timestamps older than 60s •count remaining •if count > limit → block pseudo logic: ZREMRANGEBYSCORE user:1 0 (now - 60) ZADD user:1 now 1 ZCARD user:1 this creates a true “60-second window” instead of a 1-minute bucket. 3. redis is perfect here it’s fast, atomic, and supports lua scripts to do all 3 ops in one call → zero race conditions. 4. why it scales no memory leaks (keys expire), constant-time ops, accurate throttling. works across multiple servers instantly (since redis = shared state). 5. real use cases • public apis (avoid ddos) • login endpoints (stop brute force) • internal admin panels (prevent loops or bug floods) 👉🏻mini project • build express middleware • store per-ip hits in redis sorted set • log blocked requests • visualize hits per user in a dashboard
2
106