Building My Portfolio: Showcasing My Work as a Frontend Developer

Himanshu Rank — Thu, 27 Feb 2025 08:12:29 +0000

Hey everyone! 👋

I recently completed my portfolio website to showcase my work as a frontend developer specializing in React, Next.js, and software architecture. You can check it out here: Visit Portfolio

🔹 Why I Built This Portfolio
As a developer, having an online presence is crucial. I wanted a place where I could:
✅ Showcase my projects and technical skills
✅ Share my experience in frontend development, architecture, and clean code
✅ Provide a quick way for recruiters and clients to view my work

🔹 Tech Stack
I built the portfolio using:
🔹 Next.js for performance and SEO
🔹 Tailwind CSS for rapid styling
🔹 Framer Motion for smooth animations
🔹 Netlify for easy deployment

🔹 Projects Feature

🔹 Lessons Learned
While building this, I focused on:
📌 Optimizing performance (lazy loading, image optimization)
📌 Better folder structure for scalability
📌 Improving UI/UX with micro-interactions

💡 What’s Next?
I’m planning to write more about frontend best practices, clean code, and architecture patterns. Stay tuned! 🚀

Would love your feedback! Let me know what you think or if you have any suggestions. 😊

webdevelopment #react #nextjs #framermotion #portfolio #frontend #javascript #tailwindcss

If your Redux state has changed but React doesn't trigger a re-render, it could be due to several reasons

Himanshu Rank — Tue, 20 Feb 2024 11:21:59 +0000

Immutable Data: Redux encourages the use of immutable data structures. If you're mutating the state directly instead of creating a new state object or using immutable update patterns (like spread syntax or immutability libraries such as Immutable.js), React might not detect the change because it relies on shallow equality checks to determine if props or state have changed.

Component Should Update: If you're using class components, ensure that shouldComponentUpdate or React.PureComponent is implemented correctly. These methods perform shallow comparisons of props and state to determine if a component should re-render. If your props or state haven't changed in a way that triggers a re-render, React won't update the component.

React.memo or useMemo: If you're using functional components, ensure that you're properly memoizing components or values using React.memo or useMemo hook. These optimizations prevent unnecessary re-renders by comparing previous and current props or values. If the props haven't changed, the component won't re-render.

Subscription to Redux Store: Make sure your components are properly subscribed to the Redux store. Components connected to Redux via connect or useSelector will only re-render when the relevant slice of state they're subscribed to changes. If the subscription is incorrect or missing, the component won't update.

Middleware or Side Effects: If you're performing asynchronous actions or side effects in Redux (e.g., with middleware like Redux Thunk or Redux Saga), ensure that they're updating the Redux state correctly and triggering re-renders when necessary. Improper handling of side effects might lead to state changes that React doesn't detect.

React-Redux Connect Configuration: When using connect from React-Redux, make sure you have correctly configured the mapStateToProps function to extract the relevant parts of the state that your component depends on. If the connected component isn't subscribed to the relevant state changes, it won't re-render.

By carefully inspecting these potential issues and ensuring that your Redux state updates are properly reflected in your React components, you should be able to diagnose why React isn't triggering a re-render when the Redux state changes.

DEV Community: Himanshu Rank

Building My Portfolio: Showcasing My Work as a Frontend Developer

webdevelopment #react #nextjs #framermotion #portfolio #frontend #javascript #tailwindcss

If your Redux state has changed but React doesn't trigger a re-render, it could be due to several reasons