Forem: Amal Amr Zewita

What is useEffect in React?

Amal Amr Zewita — Fri, 30 May 2025 03:56:07 +0000

useEffect is a built-in React Hook that lets you run code after the component renders.

It’s commonly used for:

Fetching data from APIs
Setting up subscriptions
Updating the DOM
Cleaning up on unmount

🧠 Basic Example


tsx
import { useEffect } from 'react';

useEffect(() => {
  console.log("Component mounted!");
}, []);

Understanding Redux Toolkit with React: A Beginner-Friendly Guide

Amal Amr Zewita — Fri, 30 May 2025 03:55:16 +0000

Redux is powerful but can feel overwhelming — especially for beginners. That’s where Redux Toolkit comes in.

Redux Toolkit simplifies state management with minimal boilerplate and built-in best practices. In this post, we'll walk through the basics of using Redux Toolkit in a React app.

✨ Why Redux Toolkit?

Less boilerplate than traditional Redux
Built-in createSlice, createAsyncThunk
Supports Immer for mutation-style syntax
Powerful devtools integration

⚙️ Setup


bash
npm install @reduxjs/toolkit react-redux

How to Build a Portfolio Website with React, Redux, and Dev.to Integration

Amal Amr Zewita — Fri, 30 May 2025 03:46:22 +0000

Creating your own developer portfolio is more than a personal branding project — it's a real-world showcase of your skills. In this post, you'll learn how to build a multi-page React portfolio website with Redux for global state, API integrations, and even a live blog feed using Dev.to's public API.

✨ Features Covered

React Router for client-side navigation
Redux Toolkit for state management
Axios for HTTP requests
Responsive design with custom CSS
Dev.to blog integration (fetching articles via API)
Skeleton loaders for better UX

📁 Project Structure


bash
/src
  ├── components/
  ├── pages/
  ├── redux/
  ├── App.tsx
  └── main.tsx