Web Development
4.39K subscribers
539 photos
33 videos
116 files
113 links
Web development learning path

Frontend and backend resources.

HTML, CSS, JavaScript, React, APIs and project ideas.

Join 👉 https://rebrand.ly/bigdatachannels

DMCA: @disclosure_bds
Contact: @mldatascientist
Download Telegram
This media is not supported in your browser
VIEW IN TELEGRAM
🚨Someone open-sourced the Kage landing page and the Three.js skills behind it.

Every section scrolls through a 3D world and the whole thing is under 1MB of Three.js and code, 3MB with high quality images.

For a fully 3D scroll experience that's surprisingly lean.

Three skills included: build-threejs-scroll-worlds, falling-leaves and pointer-trail-emitter.
All open source on GitHub.

🔗Check it out: https://github.com/MengTo/kage
👍4
VS Code Extensions You Need
❤5
The Truth About CORS

CORS (Cross-Origin Resource Sharing) is a browser security mechanism that decides whether one website is allowed to request resources from another.


Suppose your frontend runs on:
http://localhost:5173

Your API runs on:
http://localhost:3000


Same computer. Different ports. That makes them different origins.

Your browser blocks the request because the API never explicitly allowed requests from that origin.

"But it works in Postman..." Of course it does. Postman isn't a browser. It doesn't enforce browser security rules.

If Postman works but your browser doesn't, the problem usually isn't your API logic. It's your server's CORS configuration.
👍1
Forwarded from Programming Quiz Channel
Which SQL clause is used to filter groups after a GROUP BY?
Anonymous Quiz
18%
WHERE
51%
HAVING
14%
FILTER
18%
ORDER BY
📖 Read The Source

When you're stuck with a library, stop searching YouTube after 20 minutes.

Open its documentation. If that doesn't explain it, read the source code.

You don't need to understand every file. Find the function you're calling and follow the execution.

You'll often discover hidden options, edge cases, or implementation details that never made it into the docs.

Reading source code is one of the fastest ways to become a stronger developer.
❤6
TypeScript Mapped Types in API Responses
❤2👍1
Forwarded from Programming Quiz Channel
What HTTP status code indicates a resource was not found?
Anonymous Quiz
8%
200
7%
301
82%
404
4%
500
❌ Stop Returning 200

One habit that makes debugging APIs much harder is returning HTTP 200 OK for every request.

An HTTP status code tells the client what happened before it even reads the response body.

Examples:
200 → Success
201 → Resource created
400 → Client sent invalid data
401 → Authentication required
403 → Authenticated, but not allowed
404 → Resource doesn't exist
500 → Server failed unexpectedly

If every response is 200, frontend developers have to inspect every response body just to know whether something failed.

Let HTTP do its job. That's what it was designed for.
❤2👍1
Why React Hydration Exists

When a server sends HTML to your browser, the page already looks complete before any JavaScript finishes loading.

But looks can be misleading. Buttons don't respond. Forms don't submit. Dropdowns don't open.

Hydration is the process where React attaches JavaScript to that existing HTML, making it interactive instead of rebuilding the page from scratch.


This is also why JavaScript bundle size matters so much. The browser can't hydrate components until it has downloaded, parsed, and executed their JavaScript.

That's why modern frameworks push more work to the server. Not because JavaScript is bad, but because sending less of it usually means users can interact with the page sooner.
❤3
Top API Tools For Different Purposes
❤4
What is Next.js Middleware❔
🔥3