Refactoring Junior React Code to Clean Code - SOLID

Published: 12 May 2024
on channel: CoderOne

9,837

339

📚 Learn to write cleaner React code with the new SOLID React book:
https://solidreact.dev

Explain how to properly refactor your legacy Junior React code to follow clean-code SOLID principles. We'll go through an old Button component I wrote back in 2020 that was very ugly and bad.

🎉Our Newsletter is live! Join thousands of other developers
https://islemmaboud.com/join-newsletter

⭐ Timestamps ⭐
00:00 Intro
01:39 Understanding our old code
05:17 Refactoring code
06:37 Refactoring component logic
14:02 From vanilla CSS to Tailwind
28:33 Cleaning up props
30:05 New component demo

🎥 Watch This is the Only Right Way to Write React clean-code - SOLID
   • This is the Only Right Way to Write React ...

-- Special Links

✨ Join Figma for Free and start designing now!
https://psxid.figma.com/69wr7zzb1mxm

👉 ✨ Join Figma For Professionals And Start Designing with your Team ✨
https://psxid.figma.com/ucwkx28d18fo-...

⚡️ S.O.L.I.D Principles implementation in React ✨
https://github.com/ipenywis/react-solid

📕S.O.L.I.D blogs get a better grasp on the principles
  / the-s-o-l-i-d-principles-in-pictures

-- Special Links

✨ Join Figma for Free and start designing now!
https://psxid.figma.com/69wr7zzb1mxm

👉 ✨ Join Figma For Professionals And Start Designing with your Team ✨
https://psxid.figma.com/ucwkx28d18fo-...

-- Watch More Videos

🧭 Build Login/Register API Server w/ Authentication | JWT Express AUTH using Passport.JS and Sequelize
   • Build Login/Register API Server w/ Authent...

🧭 Turn Design into React Code | From prototype to Full website in no time
   • Turn Design into React Code | From prototy...

🧭 Watch Tutorial on Designing the website on Figma
   • I Design a onecolor Website in 1 hour | De...

🧭 Watch Create a Modern React Login/Register Form with smooth Animations
   • Create a Modern React Login/Register Form ...

🧭 Debug React Apps Like a Pro | Master Debugging from Zero to Hero with Chrome DevTools
   • Debug React Apps Like a Pro | Master Debug...

🧭 Master React Like Pro w/ Redux, Typescript, and GraphQL | Beginner to Advanced in React
   • Master React Like Pro w/ Redux, Typescript...

🧭 Learn Redux For Beginners | React Redux from Zero To Hero to build a real-world app
   • Debug React Apps Like a Pro | Master Debug...

🧭 Introduction to GraphQL with Apollo and React
   • Introduction to GraphQL with Apollo and React

🐦 Follow me on Twitter:   / ipenywis
💻 Github Profile: https://github.com/ipenywis

Made with 💗 by Coderone

On this page of the site you can watch the video online Refactoring Junior React Code to Clean Code - SOLID with a duration of hours minute second in good quality, which was uploaded by the user CoderOne 12 May 2024, share the link with friends and acquaintances, this video has already been watched 9,837 times on youtube and it was liked by 339 viewers. Enjoy your viewing!

468