design-code.tips
by ositaka
Latest episode
60 | Renaming Files in Bulk Using the Command Line: A Step-by-Step…
60 | Renaming Files in Bulk Using the Command Line: A Step-by-Step…
About this podcast
Welcome to design-code.tips — the podcast where modern web-dev, thoughtful UI design, and practical AI workflows converge. Each episode expands on a blog post from design-code.tips, adding audio-only extras: hands-on demos, performance tricks, and real stories from shipping products. Expect clear take-aways on React, Tailwind, accessibility, and how to leverage AI for faster prototyping and smarter coding. Created by Nuno Marques (a.k.a. ositaka) – your calm, actionable learning companion.
(Episodes created with the help of Notebook LM.)
Episodes
The newest 20 of 61 episodes
- 60 | Renaming Files in Bulk Using the Command Line: A Step-by-Step Guide · 9 min · Season 1 Episode 60Renaming multiple files manually? That’s a productivity killer! In this episode, we explore a step-by-step guide to bulk file renaming using the command line. Learn how to create…
- 59 | "PodRocket" — A web development podcast from LogRocket · 3 min · Season 1 Episode 59In this episode, we’re highlighting PodRocket, a web development podcast by LogRocket. Covering topics like accessibility, design, and open-source software, PodRocket delivers…
- 58 | The Ultimate Guide to BEM: From Basics to Advanced Techniques · 23 min · Season 1 Episode 58In this episode, we unravel BEM (Block, Element, Modifier)—a powerful CSS methodology for writing scalable, maintainable, and structured styles. We’ll cover the fundamentals…
- 57 | Creating a Table of Contents for a Successful Design System · 15 min · Season 1 Episode 57A well-structured Table of Contents (ToC) is essential for a successful design system, especially in Storybook. It serves as a roadmap, making key components, guidelines, and…
- 56 | "The Stack Overflow" — A Podcast for Developers · 10 min · Season 1 Episode 56In this episode, we dive into The Stack Overflow Podcast—a go-to resource for web developers and open-source enthusiasts. Whether you're a seasoned coder or just starting out…
- 55 | Screaming Frog: SEO Spider Website Crawler · 5 min · Season 1 Episode 55In this episode, we explore Screaming Frog’s SEO Spider, an essential tool for auditing and optimizing websites for search engines. Learn how it helps detect broken links…
- 54 | Tailwind CSS: Mouse-Only Device Targeting with Custom Variant · 13 min · Season 1 Episode 54Ever wished you could fine-tune hover effects for mouse users without affecting touchscreen devices? In this episode, we explore a custom Tailwind CSS variant, mouse-only, which…
- 53 | Aspect Ratio Calculator: A Must-Have Tool for Designers and Developers · 6 min · Season 1 Episode 53In this episode, we explore the Aspect Ratio Calculator, a free online tool that makes it easy to determine and maintain correct proportions for images, videos, and UI elements…
- 52 | Open-Sourcing Starter Templates: Pros, Cons, and Considerations · 16 min · Season 1 Episode 52Should you open-source your starter template project? In this episode, we explore the pros and cons of making your Next.js and Tina CMS-based project public. From increased…
- 51 | PerfectPixel by WellDoneCode: Your Pixel-Perfect Companion · 4 min · Season 1 Episode 51In this episode, we showcase PerfectPixel by WellDoneCode, a must-have Chrome extension for pixel-perfect web development. Learn how it helps developers overlay semi-transparent…
- 50 | "Voice of Design" — A Podcast for Designers · 3 min · Season 1 Episode 50In this episode, we’re highlighting "Voice of Design," a podcast that explores the intersection of business and design. If you’re a designer looking for insights on strategy…
- 49 | Flawless Mobile Experience: Understanding Viewport Orientation Change Times · 5 min · Season 1 Episode 49In this episode, we explore optimizing viewport orientation changes for a better mobile experience. Learn how factors like device model, CPU/GPU load, and background processes…
- 48 | Iconly: SVG Stroke to Fill Conversion Tool · 5 min · Season 1 Episode 48In this episode, we showcase Iconly: Convert SVG Strokes to Fills, a handy tool for graphic designers and developers. Iconly effortlessly transforms SVG strokes into fills…
- 47 | Why Use Getters and Setters in JavaScript and TypeScript? · 12 min · Season 1 Episode 47In this episode, we dive into getters and setters—language features that let you run logic whenever a property is read or written. You’ll learn how getters and setters enable…
- 46 | VS Code: Code Editing. Redefined · 5 min · Season 1 Episode 46In this episode, we’re exploring Visual Studio Code (VS Code)—one of the most powerful and versatile code editors. With its customizable interface, extensive plugin ecosystem…
- 45 | HTTrack: Website Copier · 4 min · Season 1 Episode 45In this episode, we take a closer look at HTTrack, a website copier that lets you download full websites for offline use while preserving their structure. Learn how this tool…
- 44 | Themeable SVG Favicons · 13 min · Season 1 Episode 44Ever wondered how to create a favicon that adapts to light and dark mode? In this episode, we break down a step-by-step tutorial on building a themeable SVG favicon using CSS…
- 43 | Docusaurus: The Ultimate Tool for Documentation Websites · 13 min · Season 1 Episode 43In this episode, we delve into Docusaurus, an open-source static site generator created by Facebook. By leveraging React and Markdown, Docusaurus simplifies both setup and…
- 42 | Code Examples of the Media Creators website · 13 min · Season 1 Episode 42In this episode, we explore website performance optimization through responsive media handling. Based on a blog post from the Code Examples of the Media Creators (NodeJS)…
- 41 | draw.io: A Free Online Diagramming Tool · 4 min · Season 1 Episode 41In this episode, we explore draw.io, a free and versatile diagramming tool perfect for creating flowcharts, network diagrams, UML sketches, and more. With an easy-to-use…
