The latest articles on DEV Community by Ahmed sherif helmy Ahmed (@ahmed_sherif_helmy_ahmed). https://dev.to/ahmed_sherif_helmy_ahmed https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3196518%2Fb207e104-3502-44b7-ac0d-092db9378d92.png https://dev.to/ahmed_sherif_helmy_ahmed en Ahmed sherif helmy Ahmed Thu, 22 May 2025 16:16:22 +0000 https://dev.to/ahmed_sherif_helmy_ahmed/dark-mode-redux-and-quote-apis-a-dev-portfolio-thats-more-than-a-landing-pag-1bm6 https://dev.to/ahmed_sherif_helmy_ahmed/dark-mode-redux-and-quote-apis-a-dev-portfolio-thats-more-than-a-landing-pag-1bm6 <p>Most portfolios look great—but are static. I wanted mine to be interactive and functional. Instead of just saying “I know React and Redux,” I built a portfolio that shows it.</p> <p>🖼 On the homepage, I fetch a quote from the Quotable API using Axios and store it in Redux. Why Redux? Because I may want to show that quote elsewhere, like in a footer or meta tag.</p> <p>💡 I added a global dark/light mode toggle, also via Redux, which updates the entire layout using Bootstrap’s utility classes (bg-dark, text-light, etc.). All pages—including cards—reactively adapt to the selected theme.</p> <p>🛠 Tech Stack:</p> <p>React (TypeScript)</p> <p>Redux Toolkit</p> <p>Axios</p> <p>React Router</p> <p>Bootstrap + Bootstrap Icons</p> <p>This project not only looks good but also reflects production-ready architecture. Got tips or ideas to improve it? Let’s chat.</p> react darkmode webdev frontend