Django for Front-End Engineers
Familiar web concepts, handled on the server
Fotis Adamakis - Frontend Architecture & DX
Notes on frontend tooling, large-codebase migrations, and the boring engineering that pays for itself.
Latest posts
Understanding OpenSpec & Spec-Driven Development
Why spec-driven development turns AI coding agents from unpredictable chatbots into good programming assistants, and how OpenSpec makes it work.
Mocking in Storybook
Learn how to effectively mock dependencies in Storybook for isolated component testing and improve your development workflow.
SKILL.md has 14+ metadata fields. Use them correctly.
A comprehensive guide to the 14+ metadata fields in SKILL.md files, explaining the Agent Skills spec fields and Claude Code extensions for writing better skills.
Your Skills Might Be Lint Rules In Disguise
Once you discover the power of skills, you will be tempted to turn every repeated prompt, checklist, convention, and internal process into one.
Understanding Cursor Pricing
I'm obsessed with Cursor lately.
How React Codebases Become Hard to Maintain
Let’s assume you start a React project with good intentions and the goal to keep the codebase clean and maintainable.
How to Think in a Front-End System Design Interview
A structured approach to front-end system design interviews, covering requirements gathering, UI structure, data modeling, and API design with practical tips.
You probably don’t need useCallback here
Why most useMemo and useCallback usage in React is unnecessary, explaining how React re-rendering actually works and when these hooks truly help performance.
5+1 MCP Servers for Cursor
Imagine browsing the web without an ad blocker.
Next.js was great, until it wasn't
And I was mad at Vercel before it was cool.
Accessible Modals in 5 Steps
A step-by-step tutorial on building accessible modal dialogs in 5 steps, covering focus management, keyboard navigation, and ARIA attributes.
Using ARIA Labels Like a Pro
One of the first issues any automated a11y tool will flag is missing ARIA labels. And honestly, it’s one of the easiest fixes to make.
You Might Already Know React Native
How React Native takes a fundamentally different approach from WebView-based tools like Cordova and Ionic to deliver truly native mobile app experiences.
No AI Mondays
Why I started a No AI Mondays practice to stay sharp as a developer, maintain my coding skills, and avoid over-reliance on AI tools.
What If We Made Bugs Illegal?
A humorous thought experiment exploring what would happen if bugs were made illegal, and why the real solution lies in better testing and engineering practices.
RIP Styled-Components. Now What?
What to do now that styled-components is in maintenance mode, covering migration paths to CSS Modules, Tailwind, and other modern styling solutions.
Don’t Sleep on the European Accessibility Act
By 28 June 2025, every company operating in the EU must be accessibility-compliant.
Vue is Too Easy
An exploration of why Vue's deliberately simple design makes it easy to learn yet extremely powerful, covering component declaration, reactivity, and routing.
CSS inherited Vs non inherited properties
A clear explanation of which CSS properties are inherited by child elements and which are not, and why this matters for debugging layouts.
Learning Vue for React Developers
A side-by-side comparison of Vue and React concepts to help React developers learn Vue quickly, covering components, templating, and state management.
Time to Stop Using BEM
Why BEM CSS methodology has become outdated and what modern alternatives like CSS Modules, scoped styles, and utility frameworks offer instead.
Text to Speech with Vue
Building a text-to-speech application using Vue and the Web Speech API, demonstrating how to convert text to speech without any additional library.
Better Vue Components with TypeScript [12 examples]
The debate between JavaScript and TypeScript has been going on for years, and I thought by 2024 we would have reached a clear conclusion.
Vue Meets GraphQL
A side-by-side comparison of REST and GraphQL in Vue applications, showing how GraphQL eliminates over-fetching and under-fetching for cleaner data loading.
Recreating the Queens Game in Vue
Building a clone of LinkedIn's Queens puzzle game using Vue 3, exploring game logic, grid-based UI, and reactive state management for interactive apps.
Using AWS Amplify with Vue
A hands-on guide to using AWS Amplify with Vue, covering CLI setup, authentication, storage, and hosting for building and deploying full-stack applications.
Custom vs Third-Party Component Libraries
A comparison of building a custom component library versus using a third-party solution, weighing flexibility, maintenance cost, and developer experience.
Ref vs. Reactive - Pick one, Kill the Other
A practical comparison of ref and reactive in Vue 3's Composition API, explaining when to use each and why picking one as your default simplifies code.
Can Vue Query Replace State Management?
An exploration of whether Vue Query can replace traditional state management solutions like Vuex or Pinia and where the two approaches overlap.
Hidden Responsibilities of a Front-End Engineer
An exploration of the often-overlooked responsibilities of a front-end engineer, from responsive design and accessibility to performance and security.
Handling Environment Variables in Vue
Vue uses the widely adopted dotenv module to load build configuration from the following files in your environment directory:
Kind of Annoyed at Vue-Router Lately
A candid look at the pain points of Vue Router with Vue 3's Composition API, including outdated documentation, confusing syntax, and missing features.
Composables as State Management in Vue3
How to use Vue 3 composables as a lightweight state management solution, replacing Vuex with a simpler and more scalable approach.
Prefer Const Over Let. Forget the Var.
Why you should prefer const over let and forget about var in modern JavaScript, with practical examples and best practices for variable declarations.
Polling with SetInterval Vs SetTimeout in JavaScript
A comparison of setInterval and setTimeout for polling in JavaScript, explaining the differences, use cases, and common pitfalls to avoid.
Vue Render Optimization with v-once and v-memo
Front-end frameworks, like Vue and React, gained popularity as a response to JavaScript’s lack of reactivity.
[Quiz] Dependencies Vs devDependencies
A quiz to test your knowledge of the difference between dependencies and devDependencies and why proper categorization matters for build speed, bundle size, and security.
Handling Hacky CSS
A practical approach to managing temporary CSS hacks and workarounds by collecting them in a dedicated file that acts as a team to-do list.
The Difference Between Composition, Composition API, and Composables in Vue 3
Clarifying the difference between Vue 3's Composition, Composition API, and Composables — three related but distinct concepts often confused by developers.
Data Fetching in Vue 3
A practical guide to data fetching in Vue 3, comparing lifecycle hooks and real-life scenarios for choosing the right approach for each type of API call.
The Building Blocks of a Greenfield Vue Application in 2024
The essential building blocks for starting a greenfield Vue application in 2024, covering tooling, state management, routing, and architecture choices.
You Are Writing Too Many Unit Tests
Why the testing pyramid is outdated and how the testing trophy approach encourages more integration and end-to-end tests for better ROI on testing efforts.
[Vue 3] Creating a Reusable Modal Component
A step-by-step guide to building a reusable and accessible modal component in Vue 3 using the Composition API and a clean architecture.
[Vue 3] Implement a Base Input Component the Right Way
A practical guide to implementing a base input component in Vue 3, covering naming conventions, CSS resets, props, and accessibility.
Vue 2 is Dead, Long Live Vue 2!
Vue 2 is officially no longer supported.
Supabase: Build in a Weekend, Scale to Millions
An introduction to Supabase as an open-source Firebase alternative, covering its features, pricing advantages, and why it stands out for scalable applications.
Express + Mongo Application Architecture and Folder Structure
A practical guide to structuring an Express and MongoDB application with a clean folder architecture that scales for real-world CRUD applications.
Setting up Express + Typescript
Express and TypeScript is a powerful combination. This is a no-fuss guide to get you started with them.
Open Props: A CSS Framework for the Modern Web
An introduction to Open Props, a modern CSS framework that provides a comprehensive set of design tokens and custom properties for styling web applications.