What does navigator.clipboard.writeText('hello') do?
Final Results
44%
Copies 'hello' to the clipboard
25%
Prints 'hello' to the console
19%
Saves 'hello' to localStorage
13%
Shows an alert with 'hello'
New code is live: Back to top in 1 line ⬆️ — Instagram post: https://www.instagram.com/reel/DfRZwz1j0mR/ — full source code in the file below.
2026-11-03-scroll-top.html
1.8 KB
Back to top in 1 line — full source code. Follow @cod.ewithfun on Instagram for daily web dev tips.
What does behavior: 'smooth' do inside window.scrollTo?
Final Results
88%
Scrolls smoothly to the top
0%
Jumps instantly to the top
13%
Scrolls to the bottom of the page
0%
Reloads the page
This or That? 🤔 Tuesday pick — you can only choose ONE for your next project:
Final Results
38%
Flexbox 💪
63%
CSS Grid 🔲
New code is live: Responsive card grid with CSS Grid — no media queries
Instagram post: https://www.instagram.com/p/DfT-ZgAE2hr/
Full source code in the file below 👇
Instagram post: https://www.instagram.com/p/DfT-ZgAE2hr/
Full source code in the file below 👇
2026-11-04-css-grid.html
2 KB
Responsive card grid with CSS Grid — full source code. Follow @cod.ewithfun on Instagram for daily web dev tips.
In grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)), what does auto-fit do?
Final Results
22%
Adds as many columns as fit the screen
44%
Makes the text wrap automatically
33%
Centers the grid on the page
0%
Hides the extra columns
🎁 FREE PROJECT #1 — SkyCast Weather App 🌦️
Full source code — FREE for everyone.
✅ Live weather (Open-Meteo, no API key)
✅ Search any city
✅ Hourly + 7-day forecast
🚀 Live demo: https://codepen.io/codewithfun69/pen/gbmQZWO
📺 Reel: https://www.instagram.com/reel/DfWjnz_iS03/
File attached below 👇 Build it, remix it, show me yours!
Full source code — FREE for everyone.
✅ Live weather (Open-Meteo, no API key)
✅ Search any city
✅ Hourly + 7-day forecast
🚀 Live demo: https://codepen.io/codewithfun69/pen/gbmQZWO
📺 Reel: https://www.instagram.com/reel/DfWjnz_iS03/
File attached below 👇 Build it, remix it, show me yours!
codepen.io
SkyCast — Weather App UI | Code With Fun
...
skycast-weather-app.html
14.9 KB
SkyCast Weather App — full source code. Follow @cod.ewithfun on Instagram for daily web dev tips.
⚡ THURSDAY — ONE LINE WONDER
One line of JavaScript. No library. It finds where in the world you are:
navigator.geolocation.getCurrentPosition(p => console.log(p.coords.latitude, p.coords.longitude))
That's the trick weather apps use to show YOUR city's weather without you typing anything 🤯
Try it in your browser console!
One line of JavaScript. No library. It finds where in the world you are:
navigator.geolocation.getCurrentPosition(p => console.log(p.coords.latitude, p.coords.longitude))
That's the trick weather apps use to show YOUR city's weather without you typing anything 🤯
Try it in your browser console!
In SkyCast's code, what does fetch() return when it calls the weather API?
Final Results
54%
A Promise
38%
The weather directly
0%
An HTML page
8%
A number
New code is live: Show / hide password in 3 lines — Instagram post: https://www.instagram.com/reel/DfZJAU2E5z9/ — full source code in the file below.
2026-11-06-show-hide-password.html
3.1 KB
Show / hide password in 3 lines — full source code. Follow @cod.ewithfun on Instagram for daily web dev tips.
🐛 FRIDAY — SPOT THE BUG
What is wrong with this login button code?
const btn = document.querySelector('#loginBtn');
btn.addEventListener('click', checkLogin());
Vote in the poll below 👇
What is wrong with this login button code?
const btn = document.querySelector('#loginBtn');
btn.addEventListener('click', checkLogin());
Vote in the poll below 👇
🐛 Spot the Bug: what is wrong with the code above?
Final Results
40%
checkLogin() runs immediately — the () should not be there
30%
querySelector cannot select an ID
0%
addEventListener is spelled wrong
30%
console.log is not allowed in a handler
New code is live: Explained Part 1 — Centering a Div (Flex / Grid / Absolute) — Instagram post: https://www.instagram.com/reel/DfbshZyiQhe/ — full source code in the file below.
2026-11-07-centering-a-div.html
5.8 KB
Explained Part 1 — Centering a Div — full source code. Follow @cod.ewithfun on Instagram for daily web dev tips.
🪔🎉 QUIZ HOUR IS LIVE — Happy Diwali! 🎆
5 quick questions. 1 hour. All from this week's reels + projects.
Answer each poll as it drops — then reply with your score out of 5.
Top scorers get a shout-out tomorrow. 👇
Question 1 drops NOW. ⏰
5 quick questions. 1 hour. All from this week's reels + projects.
Answer each poll as it drops — then reply with your score out of 5.
Top scorers get a shout-out tomorrow. 👇
Question 1 drops NOW. ⏰
Which ONE line centres a child inside a grid parent?
Final Results
44%
text-align: center
44%
place-items: center
11%
margin: auto
0%
float: center
In the show/hide password trick, what does pass.type = 'text' do?
Final Results
71%
Shows the password as readable text
0%
Deletes the password from the input
29%
Encrypts the password before sending it
0%
Submits the login form