View this email in your browser

Hello,

Welcome to issue #375! 👋
I don't have any interesting personal/work updates this week, so we are just going to bootstrap this week by fast-forwarding into some cool full-stack content! This week we have a mixbag of topics, going from web security, animations, creativity, and performance to responsive design and components systems.
I hope you will enjoy this issue! And if you do, please consider sharing this newsletter with your friends and colleagues! Every little helps 🥰
— Your editor, Luciano.

“It's not that we use technology, we live technology“

— Godfrey Reggio , Director

☠️ Your API Shouldn't Redirect HTTP to HTTPS — How often have you created a redirect from HTTP to HTTPS? I have certainly done it quite a few times. Well, it turns out that is not good in terms of security, especially when you do this for APIs where the user might be sending sensitive information or authentication tokens... Instead of redirecting API calls from HTTP to HTTPS, make the failure visible, and you should also revoke any received API key! Read article

🪄 New magic for animations in CSS —  There are two new features coming to CSS that will make it much easier to further avoid JavaScript when implementing animations. 1. The possibility to animate display: none and 2. the possibility to animate intrinsic properties using auto. Let's see  how this can be quite useful with some examples! Read article

🎨 JS Hacks & Creativity — A mind-bogging website showcasing pure JavaScript Hacks and Creative Coding. Created by Martin Kleppe! Read article

⚡️ From fast loading to instant loading —  In this talk, we'll share how Chrome and the web platform can achieve near-instant page loads using the new Speculation Rules API.Watch video

🛑 Stop resizing your browser: improve testing for responsiveness — When you work on a responsive design, how often do you find yourself constantly resizing the browser window to see the effect of your changes across various screen sizes? A lot? Me too! But we can probably do better than that. This article approaches this exact topic and proposes a few interesting ideas. Read article

🌳 Decision Trees For UI Components — Imagine finally resolving never-ending discussions about UI decisions for good. Here are some practical examples of decision trees for UI components and how to use them effectively. Read article

🔪 Slash pages  —  A guide to common pages you can add to your website. Some of them might be familiar, but did you about /blogroll, /chipotle or /now? I think I have to update my personal blog to include some of these...  Read article

Full Stack GraphQL Applications: With React, Node.js, and Neo4j

by William Lyon

Build hyper-fast and hyper-efficient web applications with GraphQL! This practical, comprehensive guide introduces the powerful GRANDStack for developing full stack web applications based in graph data structures. The GraphQL query language radically reduces over-fetching or under-fetching of data by constructing precise graph-based data requests. In Full Stack GraphQL Applications you'll learn how to build graph-aware web applications that take full advantage of GraphQL's amazing efficiency. Neo4j's William Lyon teaches you everything you need to know to design, deploy, and maintain a GraphQL API from scratch. He reveals how you can build your web apps with GraphQL, React, Apollo, and Neo4j Database, aka “the GRANDstack,” to get maximum performance out of GraphQL.

Some more shenanigans! 🤪

• A Selection of Fonts That Future-Proof Your Web Design
• How 1Password used esbuild to reduce their browser extension build times by 90%
• What is a collision? (fun interactive article)
• littlezipper: Small, fast .zip library using native CompressionStream, suits server and client
• What's new in the Web (Google I/O ‘24)
• How to Make a CSS Timer
• React 19 lets you write impossible components
• How to improve S3 performance (podcast)

👋 That’s all for this week. See you next Monday!

Greetings from your full stack friends Luciano & Andrea