Flavien (56kode)
@56kode.bsky.social
Frontend developer specializing in all things #React, #TS, and #JS
My posts : https://www.56kode.com/
My posts : https://www.56kode.com/
🚀 Debug web apps directly from #Cursor #IDE with Browser-Tools #MCP! ⚡
🔹 Console logs analysis
🔹 Network requests inspection
🔹 AI-powered debugging
👉 www.56kode.com/posts/connec...
#CursorIDE #AI #debug #chrome
🔹 Console logs analysis
🔹 Network requests inspection
🔹 AI-powered debugging
👉 www.56kode.com/posts/connec...
#CursorIDE #AI #debug #chrome
Connect Cursor to Your Browser with Browser-Tools MCP | 56kode - Web Development Blog on React & TypeScript
Learn how to integrate Browser-Tools MCP with Cursor IDE to debug web applications directly from your code editor using AI assistance
www.56kode.com
September 23, 2025 at 8:17 AM
🚀 Debug web apps directly from #Cursor #IDE with Browser-Tools #MCP! ⚡
🔹 Console logs analysis
🔹 Network requests inspection
🔹 AI-powered debugging
👉 www.56kode.com/posts/connec...
#CursorIDE #AI #debug #chrome
🔹 Console logs analysis
🔹 Network requests inspection
🔹 AI-powered debugging
👉 www.56kode.com/posts/connec...
#CursorIDE #AI #debug #chrome
Back from vacation ✈️ and straight into action!
I let AI handle a full dependency migration on my Astro blog: React 19, Astro 5 Content Layer, Tailwind… all automated ⚡
Curious how it went?
👉 www.56kode.com/posts/automa...
#Astro #AI #cursor #cursorAI
I let AI handle a full dependency migration on my Astro blog: React 19, Astro 5 Content Layer, Tailwind… all automated ⚡
Curious how it went?
👉 www.56kode.com/posts/automa...
#Astro #AI #cursor #cursorAI
Automated Astro dependencies update with Cursor and Claude | 56kode - Web Development Blog on React & TypeScript
Complete migration from Astro 4 to Astro 5 with Content Layer automated by Claude 4 Sonnet. Detailed experience report on breaking changes, new rendering API, and migration of all dependencies like Re...
www.56kode.com
September 10, 2025 at 9:21 AM
Back from vacation ✈️ and straight into action!
I let AI handle a full dependency migration on my Astro blog: React 19, Astro 5 Content Layer, Tailwind… all automated ⚡
Curious how it went?
👉 www.56kode.com/posts/automa...
#Astro #AI #cursor #cursorAI
I let AI handle a full dependency migration on my Astro blog: React 19, Astro 5 Content Layer, Tailwind… all automated ⚡
Curious how it went?
👉 www.56kode.com/posts/automa...
#Astro #AI #cursor #cursorAI
Lost in your codebase? 🤯 Cursor's screenshot search feature is a game-changer! Just paste a UI screenshot and it finds the corresponding file for you. Saves so much time! #Cursor
July 17, 2025 at 1:34 PM
Lost in your codebase? 🤯 Cursor's screenshot search feature is a game-changer! Just paste a UI screenshot and it finds the corresponding file for you. Saves so much time! #Cursor
🚀 Tech Watch #15 is live!
👉 Compound Components in #React
👉 useSyncExternalStore demystified
👉 #AI & the future of dev jobs
👉 #TypeScript in the AI era
👉 Migrating from #ESLint to #BiomeJS
🔗 open.substack.com/pub/56kode/p...
👉 Compound Components in #React
👉 useSyncExternalStore demystified
👉 #AI & the future of dev jobs
👉 #TypeScript in the AI era
👉 Migrating from #ESLint to #BiomeJS
🔗 open.substack.com/pub/56kode/p...
Tech watch #15
A curated selection of articles for React frontend developers, focusing on architecture, performance, and best practices
open.substack.com
June 11, 2025 at 1:18 PM
🚀 Tech Watch #15 is live!
👉 Compound Components in #React
👉 useSyncExternalStore demystified
👉 #AI & the future of dev jobs
👉 #TypeScript in the AI era
👉 Migrating from #ESLint to #BiomeJS
🔗 open.substack.com/pub/56kode/p...
👉 Compound Components in #React
👉 useSyncExternalStore demystified
👉 #AI & the future of dev jobs
👉 #TypeScript in the AI era
👉 Migrating from #ESLint to #BiomeJS
🔗 open.substack.com/pub/56kode/p...
Skip the IDE-to-browser shuffle!
🔄 Make Cursor talk to Jira with MCP
🎯 Get tickets, check specs, even auto-build test plans without leaving your editor.
👉 www.56kode.com/posts/integr... #Jira #CursorAI
🔄 Make Cursor talk to Jira with MCP
🎯 Get tickets, check specs, even auto-build test plans without leaving your editor.
👉 www.56kode.com/posts/integr... #Jira #CursorAI
Integrating Jira into Cursor with the Model Context Protocol | 56kode - Web Development Blog on React & TypeScript
Step-by-step guide to connect Jira to Cursor through the Model Context Protocol and streamline your workflow
www.56kode.com
June 5, 2025 at 3:07 PM
Skip the IDE-to-browser shuffle!
🔄 Make Cursor talk to Jira with MCP
🎯 Get tickets, check specs, even auto-build test plans without leaving your editor.
👉 www.56kode.com/posts/integr... #Jira #CursorAI
🔄 Make Cursor talk to Jira with MCP
🎯 Get tickets, check specs, even auto-build test plans without leaving your editor.
👉 www.56kode.com/posts/integr... #Jira #CursorAI
🚀 New article: Level Up #React - Mastering Context API
🔍 Learn how React's Context API really works under the hood, what’s new in React 19, and when to use it vs Zustand or Redux.
📉 Avoid unnecessary re-renders with proven optimization tips.
📖 Read → www.56kode.com/posts/level-...
🔍 Learn how React's Context API really works under the hood, what’s new in React 19, and when to use it vs Zustand or Redux.
📉 Avoid unnecessary re-renders with proven optimization tips.
📖 Read → www.56kode.com/posts/level-...
Level Up React: Mastering Context API | 56kode - Web Development Blog on React & TypeScript
Explore the internal mechanisms of React's Context API, its optimizations in React 19, and how to use it effectively for global state management. Comparison with Zustand and Redux, advanced optimizati...
www.56kode.com
May 20, 2025 at 3:19 PM
🚀 New article: Level Up #React - Mastering Context API
🔍 Learn how React's Context API really works under the hood, what’s new in React 19, and when to use it vs Zustand or Redux.
📉 Avoid unnecessary re-renders with proven optimization tips.
📖 Read → www.56kode.com/posts/level-...
🔍 Learn how React's Context API really works under the hood, what’s new in React 19, and when to use it vs Zustand or Redux.
📉 Avoid unnecessary re-renders with proven optimization tips.
📖 Read → www.56kode.com/posts/level-...
AI tools like ChatGPT or Claude write way better code with #TypeScript 🤖🧠
Your types give the AI context 👇
Well-typed code = better suggestions, safer refactors, fewer bugs.
TypeScript isn’t a nice-to-have. It’s your AI co-pilot’s map 🗺️
#ts #ai #cursor #windsurf
Your types give the AI context 👇
Well-typed code = better suggestions, safer refactors, fewer bugs.
TypeScript isn’t a nice-to-have. It’s your AI co-pilot’s map 🗺️
#ts #ai #cursor #windsurf
May 14, 2025 at 12:30 PM
AI tools like ChatGPT or Claude write way better code with #TypeScript 🤖🧠
Your types give the AI context 👇
Well-typed code = better suggestions, safer refactors, fewer bugs.
TypeScript isn’t a nice-to-have. It’s your AI co-pilot’s map 🗺️
#ts #ai #cursor #windsurf
Your types give the AI context 👇
Well-typed code = better suggestions, safer refactors, fewer bugs.
TypeScript isn’t a nice-to-have. It’s your AI co-pilot’s map 🗺️
#ts #ai #cursor #windsurf
🚀 Tech Watch #14 is live!
👉 Open-Closed Principle in React
👉 Pattern Matching in TanStack Query
👉 Faster Lazy Loading in React Router
👉 useEffect: Child vs Parent
👉 Cursor Rules for AI Dev in TS
👉 The Hidden Cost of AI Coding
🔗 open.substack.com/pub/56kode/p...
👉 Open-Closed Principle in React
👉 Pattern Matching in TanStack Query
👉 Faster Lazy Loading in React Router
👉 useEffect: Child vs Parent
👉 Cursor Rules for AI Dev in TS
👉 The Hidden Cost of AI Coding
🔗 open.substack.com/pub/56kode/p...
May 7, 2025 at 3:58 PM
🚀 Tech Watch #14 is live!
👉 Open-Closed Principle in React
👉 Pattern Matching in TanStack Query
👉 Faster Lazy Loading in React Router
👉 useEffect: Child vs Parent
👉 Cursor Rules for AI Dev in TS
👉 The Hidden Cost of AI Coding
🔗 open.substack.com/pub/56kode/p...
👉 Open-Closed Principle in React
👉 Pattern Matching in TanStack Query
👉 Faster Lazy Loading in React Router
👉 useEffect: Child vs Parent
👉 Cursor Rules for AI Dev in TS
👉 The Hidden Cost of AI Coding
🔗 open.substack.com/pub/56kode/p...
There's nothing better than full remote work.
April 28, 2025 at 9:36 AM
There's nothing better than full remote work.
🚀 Tech Watch #13 is live!
👉 Master useReducer
👉 React.memo demystified
👉 React Reconciliation
👉 Tailwind's apply feature
👉 Toast in Server Components
🔗 56kode.substack.com/p/tech-watch...
👉 Master useReducer
👉 React.memo demystified
👉 React Reconciliation
👉 Tailwind's apply feature
👉 Toast in Server Components
🔗 56kode.substack.com/p/tech-watch...
Tech watch #13
A curated selection of articles for React frontend developers, focusing on architecture, performance, and best practices
56kode.substack.com
April 17, 2025 at 1:51 PM
🚀 Tech Watch #13 is live!
👉 Master useReducer
👉 React.memo demystified
👉 React Reconciliation
👉 Tailwind's apply feature
👉 Toast in Server Components
🔗 56kode.substack.com/p/tech-watch...
👉 Master useReducer
👉 React.memo demystified
👉 React Reconciliation
👉 Tailwind's apply feature
👉 Toast in Server Components
🔗 56kode.substack.com/p/tech-watch...
📢 Stop managing complex state with multiple useState hooks! Learn how to master useReducer for structured state management in React 🧩
🔹 Centralize business logic
🔹 Create explicit actions
🔹 Improve testability
👉 www.56kode.com/posts/level-...
#React
🔹 Centralize business logic
🔹 Create explicit actions
🔹 Improve testability
👉 www.56kode.com/posts/level-...
#React
Level Up React: Mastering useReducer for structured state management | 56kode - Web Development Blog on React & TypeScript
Complete guide to React's useReducer hook - from basic concepts to advanced implementation. Learn how to structure complex state logic, manage interdependent state, and create maintainable React appli...
www.56kode.com
April 15, 2025 at 2:21 PM
📢 Stop managing complex state with multiple useState hooks! Learn how to master useReducer for structured state management in React 🧩
🔹 Centralize business logic
🔹 Create explicit actions
🔹 Improve testability
👉 www.56kode.com/posts/level-...
#React
🔹 Centralize business logic
🔹 Create explicit actions
🔹 Improve testability
👉 www.56kode.com/posts/level-...
#React
Your React.memo component keeps re-rendering?
Check the children.
JSX passed inline is recreated every render → breaks memo.
✅ Solution: memoize children with useMemo,
or don’t memoize at all if it’s not worth it.
Code ⬇️
Check the children.
JSX passed inline is recreated every render → breaks memo.
✅ Solution: memoize children with useMemo,
or don’t memoize at all if it’s not worth it.
Code ⬇️
April 10, 2025 at 2:32 PM
Your React.memo component keeps re-rendering?
Check the children.
JSX passed inline is recreated every render → breaks memo.
✅ Solution: memoize children with useMemo,
or don’t memoize at all if it’s not worth it.
Code ⬇️
Check the children.
JSX passed inline is recreated every render → breaks memo.
✅ Solution: memoize children with useMemo,
or don’t memoize at all if it’s not worth it.
Code ⬇️
🚀 Tech Watch #12 is live! Must-read for frontend devs:
👉 Real-world uses of TypeScript utility types
👉 Next.js auth with Server Components
👉 Vite vs Turbopack speed test
👉 React View Transitions API
👉 And more...
🔗 Read here: 56kode.substack.com/p/tech-watch...
👉 Real-world uses of TypeScript utility types
👉 Next.js auth with Server Components
👉 Vite vs Turbopack speed test
👉 React View Transitions API
👉 And more...
🔗 Read here: 56kode.substack.com/p/tech-watch...
Tech watch #12
A curated selection of articles for React frontend developers, focusing on architecture, performance, and best practices
56kode.substack.com
April 3, 2025 at 12:53 PM
🚀 Tech Watch #12 is live! Must-read for frontend devs:
👉 Real-world uses of TypeScript utility types
👉 Next.js auth with Server Components
👉 Vite vs Turbopack speed test
👉 React View Transitions API
👉 And more...
🔗 Read here: 56kode.substack.com/p/tech-watch...
👉 Real-world uses of TypeScript utility types
👉 Next.js auth with Server Components
👉 Vite vs Turbopack speed test
👉 React View Transitions API
👉 And more...
🔗 Read here: 56kode.substack.com/p/tech-watch...
Reposted by Flavien (56kode)
Why I stopped using AI code editors: https://lucianonooijen.com/blog/why-i-stopped-using-ai-code-editors/
April 2, 2025 at 7:11 AM
Why I stopped using AI code editors: https://lucianonooijen.com/blog/why-i-stopped-using-ai-code-editors/
🔢 Want to improve your TypeScript skills? Learn how to refine number typing with literal types, branded types, and more! 🛠️🚀
👉 dev.to/56_kode/adva...
#TypeScript #TS
👉 dev.to/56_kode/adva...
#TypeScript #TS
Advanced number typing in TypeScript
Introduction TypeScript significantly enhances number typing beyond the basic number type....
dev.to
March 28, 2025 at 3:28 PM
🔢 Want to improve your TypeScript skills? Learn how to refine number typing with literal types, branded types, and more! 🛠️🚀
👉 dev.to/56_kode/adva...
#TypeScript #TS
👉 dev.to/56_kode/adva...
#TypeScript #TS
🚀 Tech Watch #11 is out! Essential reads for frontend devs:
👉 Storing state in the URL in React
👉 Beyond React.memo for better performance
👉 LLMs for web devs
👉 Web Components guide
👉 SSR deep dive for React
👉And more...
open.substack.com/pub/56kode/p...
👉 Storing state in the URL in React
👉 Beyond React.memo for better performance
👉 LLMs for web devs
👉 Web Components guide
👉 SSR deep dive for React
👉And more...
open.substack.com/pub/56kode/p...
Tech watch #11
A curated selection of articles for React frontend developers, focusing on architecture, performance, and best practices
open.substack.com
March 24, 2025 at 5:08 PM
🚀 Tech Watch #11 is out! Essential reads for frontend devs:
👉 Storing state in the URL in React
👉 Beyond React.memo for better performance
👉 LLMs for web devs
👉 Web Components guide
👉 SSR deep dive for React
👉And more...
open.substack.com/pub/56kode/p...
👉 Storing state in the URL in React
👉 Beyond React.memo for better performance
👉 LLMs for web devs
👉 Web Components guide
👉 SSR deep dive for React
👉And more...
open.substack.com/pub/56kode/p...
New Level Up #React article!
🔄 Stop fighting with useEffect! Master this powerful hook to build truly performant apps.
🧩 Learn execution cycles, avoid infinite loops, and discover when NOT to use effects with practical examples.
👉 www.56kode.com/posts/level-... #reactjs #hooks
🔄 Stop fighting with useEffect! Master this powerful hook to build truly performant apps.
🧩 Learn execution cycles, avoid infinite loops, and discover when NOT to use effects with practical examples.
👉 www.56kode.com/posts/level-... #reactjs #hooks
Level Up React: Mastering useEffect for performant React applications | 56kode - Web Development Blog on React & TypeScript
Learn how to master React's useEffect hook with practical examples. Discover internal mechanisms, avoid common pitfalls, and build performant applications with proper synchronization techniques.
www.56kode.com
March 18, 2025 at 4:10 PM
New Level Up #React article!
🔄 Stop fighting with useEffect! Master this powerful hook to build truly performant apps.
🧩 Learn execution cycles, avoid infinite loops, and discover when NOT to use effects with practical examples.
👉 www.56kode.com/posts/level-... #reactjs #hooks
🔄 Stop fighting with useEffect! Master this powerful hook to build truly performant apps.
🧩 Learn execution cycles, avoid infinite loops, and discover when NOT to use effects with practical examples.
👉 www.56kode.com/posts/level-... #reactjs #hooks
🔍 Tech Watch #10 is out!
Curated frontend insights:
👉 Why unknown > any in #TypeScript
👉 TanStack Form v1 release
👉 Signals in #React: pros & cons
👉 #Cursor AI productivity tips
👉 React Wrapper Pattern
👉 Zod for API validation
👉 TypeScript Map Pattern
Read more: open.substack.com/pub/56kode/p...
Curated frontend insights:
👉 Why unknown > any in #TypeScript
👉 TanStack Form v1 release
👉 Signals in #React: pros & cons
👉 #Cursor AI productivity tips
👉 React Wrapper Pattern
👉 Zod for API validation
👉 TypeScript Map Pattern
Read more: open.substack.com/pub/56kode/p...
Tech watch #10
A curated selection of articles for React frontend developers, focusing on architecture, performance, and best practices
open.substack.com
March 12, 2025 at 3:09 PM
🔍 Tech Watch #10 is out!
Curated frontend insights:
👉 Why unknown > any in #TypeScript
👉 TanStack Form v1 release
👉 Signals in #React: pros & cons
👉 #Cursor AI productivity tips
👉 React Wrapper Pattern
👉 Zod for API validation
👉 TypeScript Map Pattern
Read more: open.substack.com/pub/56kode/p...
Curated frontend insights:
👉 Why unknown > any in #TypeScript
👉 TanStack Form v1 release
👉 Signals in #React: pros & cons
👉 #Cursor AI productivity tips
👉 React Wrapper Pattern
👉 Zod for API validation
👉 TypeScript Map Pattern
Read more: open.substack.com/pub/56kode/p...
💡 TypeScript Tip: Prefer unknown over any for safer, more maintainable code! 🚀
🔹 any bypasses type safety, leading to runtime errors.
🔹 unknown forces type checks, reducing bugs.
Learn why and when to use them:
👉 dev.to/56_kode/clea... #TypeScript #CleanCode
🔹 any bypasses type safety, leading to runtime errors.
🔹 unknown forces type checks, reducing bugs.
Learn why and when to use them:
👉 dev.to/56_kode/clea... #TypeScript #CleanCode
Clean code: Why prefer unknown over any in TypeScript
TypeScript offers two main types for handling values whose type is not known in advance: any and...
dev.to
March 7, 2025 at 2:58 PM
💡 TypeScript Tip: Prefer unknown over any for safer, more maintainable code! 🚀
🔹 any bypasses type safety, leading to runtime errors.
🔹 unknown forces type checks, reducing bugs.
Learn why and when to use them:
👉 dev.to/56_kode/clea... #TypeScript #CleanCode
🔹 any bypasses type safety, leading to runtime errors.
🔹 unknown forces type checks, reducing bugs.
Learn why and when to use them:
👉 dev.to/56_kode/clea... #TypeScript #CleanCode
New Level Up #React article! Master state management with useState - from basics to performance optimization. Learn functional updates, lazy initialization, and avoid common pitfalls with practical examples www.56kode.com/posts/level-... #reactjs #hooks
Level Up React: Deep dive into state and useState | 56kode
Complete guide to React's useState hook - from basics to advanced techniques. Learn state management, avoid common pitfalls, and optimize performance with practical examples for React developers.
www.56kode.com
March 4, 2025 at 5:03 PM
New Level Up #React article! Master state management with useState - from basics to performance optimization. Learn functional updates, lazy initialization, and avoid common pitfalls with practical examples www.56kode.com/posts/level-... #reactjs #hooks
🔍 Tech Watch #9 is out!
Curated frontend insights:
👉Functional programming in React
👉React 19 new features (use hook & cache)
👉Permission systems & design patterns
👉Why Redux might be unnecessary
👉React performance guide
Read more: open.substack.com/pub/56kode/p...
Curated frontend insights:
👉Functional programming in React
👉React 19 new features (use hook & cache)
👉Permission systems & design patterns
👉Why Redux might be unnecessary
👉React performance guide
Read more: open.substack.com/pub/56kode/p...
Tech watch 9
A curated selection of articles for React frontend developers, focusing on architecture, performance, and best practices
open.substack.com
March 3, 2025 at 1:57 PM
🔍 Tech Watch #9 is out!
Curated frontend insights:
👉Functional programming in React
👉React 19 new features (use hook & cache)
👉Permission systems & design patterns
👉Why Redux might be unnecessary
👉React performance guide
Read more: open.substack.com/pub/56kode/p...
Curated frontend insights:
👉Functional programming in React
👉React 19 new features (use hook & cache)
👉Permission systems & design patterns
👉Why Redux might be unnecessary
👉React performance guide
Read more: open.substack.com/pub/56kode/p...