می خوام که واقعا برنامه لاگین داشته باشه و ورود همچنین با توضیحا نی که دادم نمی خوام نمایشی باشه می خوام واقعی کار کنه

client/src/components/PrivateRoute.jsx

@@ -0,0 +1,19 @@
+import { useAuth } from '../context/AuthContext';
+import { Navigate, Outlet } from 'react-router-dom';
+import { toast } from 'react-toastify';
+
+export default function PrivateRoute({ roles, children }) {
+  const { user, isAuthenticated, hasRole } = useAuth();
+
+  if (!isAuthenticated()) {
+    toast.error('لطفا ابتدا وارد شوید');
+    return <Navigate to="/login" />;
+  }
+
+  if (roles && !roles.some(role => hasRole(role))) {
+    toast.error('شما مجوز دسترسی به این صفحه را ندارید');
+    return <Navigate to="/" />;
+  }
+
+  return children ? children : <Outlet />;
+}

client/src/context/AuthContext.jsx

@@ -1,70 +1,105 @@
+
 import { createContext, useContext, useState, useEffect } from 'react';
 import axios from 'axios';
 import { useNavigate } from 'react-router-dom';
+import { toast } from 'react-toastify';
 
 const AuthContext = createContext();
 
 export function AuthProvider({ children }) {
   const [user, setUser] = useState(null);
-  const [token, setToken] = useState(localStorage.getItem('token'));
   const [loading, setLoading] = useState(true);
   const navigate = useNavigate();
 
-  // Check for token and load user
+  // Set axios defaults
+  axios.defaults.withCredentials = true;
+
+  // Check auth status on app load
   useEffect(() => {
-    if (token) {
-      axios.defaults.headers.common['Authorization'] = `Bearer ${token}`;
-      getUser();
-    } else {
-      setLoading(false);
-    }
-  }, [token]);
+    const checkAuth = async () => {
+      try {
+        const res = await axios.get('/api/auth/me');
+        setUser(res.data.user);
+      } catch (err) {
+        setUser(null);
+      } finally {
+        setLoading(false);
+      }
+    };
 
-  const getUser = async () => {
-    try {
-      const res = await axios.get('/api/auth/me');
-      setUser(res.data);
-    } catch (err) {
-      logout();
-    } finally {
-      setLoading(false);
-    }
-  };
+    checkAuth();
+  }, []);
 
+  // Register user
   const register = async (formData) => {
     try {
+      setLoading(true);
       const res = await axios.post('/api/auth/register', formData);
-      setToken(res.data.token);
-      localStorage.setItem('token', res.data.token);
       setUser(res.data.user);
+      toast.success('ثبت‌نام با موفقیت انجام شد');
       navigate('/dashboard');
+      return res.data;
     } catch (err) {
-      throw err.response.data;
+      const errorMessage = err.response?.data?.message || 'خطا در ثبت‌نام';
+      toast.error(errorMessage);
+      throw errorMessage;
+    } finally {
+      setLoading(false);
     }
   };
 
+  // Login user
   const login = async (formData) => {
     try {
+      setLoading(true);
       const res = await axios.post('/api/auth/login', formData);
-      setToken(res.data.token);
-      localStorage.setItem('token', res.data.token);
       setUser(res.data.user);
+      toast.success('ورود با موفقیت انجام شد');
       navigate('/dashboard');
+      return res.data;
     } catch (err) {
-      throw err.response.data;
+      const errorMessage = err.response?.data?.message || 'خطا در ورود';
+      toast.error(errorMessage);
+      throw errorMessage;
+    } finally {
+      setLoading(false);
     }
   };
 
-  const logout = () => {
-    localStorage.removeItem('token');
-    delete axios.defaults.headers.common['Authorization'];
-    setToken(null);
-    setUser(null);
-    navigate('/');
+  // Logout user
+  const logout = async () => {
+    try {
+      await axios.get('/api/auth/logout');
+      setUser(null);
+      toast.success('خروج با موفقیت انجام شد');
+      navigate('/');
+    } catch (err) {
+      toast.error('خطا در خروج از سیستم');
+    }
+  };
+
+  // Check if user is authenticated
+  const isAuthenticated = () => {
+    return !!user;
+  };
+
+  // Check if user has specific role
+  const hasRole = (role) => {
+    return user?.role === role;
   };
 
   return (
-    <AuthContext.Provider value={{ user, token, loading, register, login, logout }}>
+    <AuthContext.Provider 
+      value={{ 
+        user, 
+        loading, 
+        register, 
+        login, 
+        logout, 
+        isAuthenticated,
+        hasRole
+      }}
+    >
       {children}
     </AuthContext.Provider>
   );
@@ -72,4 +107,4 @@ export function AuthProvider({ children }) {
 
 export function useAuth() {
   return useContext(AuthContext);
-}
+}

client/src/pages/Login.jsx

@@ -0,0 +1,121 @@
+import { useState } from 'react';
+import { useNavigate } from 'react-router-dom';
+import { useAuth } from '../context/AuthContext';
+import { toast } from 'react-toastify';
+
+export default function Login() {
+  const [formData, setFormData] = useState({
+    email: '',
+    password: ''
+  });
+  const [loading, setLoading] = useState(false);
+  const { login } = useAuth();
+  const navigate = useNavigate();
+
+  const handleChange = (e) => {
+    setFormData({
+      ...formData,
+      [e.target.name]: e.target.value
+    });
+  };
+
+  const handleSubmit = async (e) => {
+    e.preventDefault();
+    setLoading(true);
+
+    try {
+      await login(formData);
+      toast.success('ورود با موفقیت انجام شد');
+      navigate('/dashboard');
+    } catch (err) {
+      toast.error(err.message || 'خطا در ورود');
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  return (
+    <div className="min-h-screen flex items-center justify-center bg-gray-50 py-12 px-4 sm:px-6 lg:px-8">
+      <div className="max-w-md w-full space-y-8 bg-white p-8 rounded-lg shadow-md">
+        <div className="text-center">
+          <h2 className="mt-6 text-3xl font-extrabold text-gray-900">ورود به حساب کاربری</h2>
+        </div>
+        <form className="mt-8 space-y-6" onSubmit={handleSubmit}>
+          <div className="rounded-md shadow-sm space-y-4">
+            <div>
+              <label htmlFor="email" className="block text-sm font-medium text-gray-700 mb-1">
+                آدرس ایمیل
+              </label>
+              <input
+                id="email"
+                name="email"
+                type="email"
+                autoComplete="email"
+                required
+                className="appearance-none relative block w-full px-3 py-2 border border-gray-300 placeholder-gray-500 text-gray-900 rounded-md focus:outline-none focus:ring-primary focus:border-primary focus:z-10 sm:text-sm"
+                placeholder="example@domain.com"
+                value={formData.email}
+                onChange={handleChange}
+              />
+            </div>
+            <div>
+              <label htmlFor="password" className="block text-sm font-medium text-gray-700 mb-1">
+                رمز عبور
+              </label>
+              <input
+                id="password"
+                name="password"
+                type="password"
+                autoComplete="current-password"
+                required
+                className="appearance-none relative block w-full px-3 py-2 border border-gray-300 placeholder-gray-500 text-gray-900 rounded-md focus:outline-none focus:ring-primary focus:border-primary focus:z-10 sm:text-sm"
+                placeholder="••••••••"
+                value={formData.password}
+                onChange={handleChange}
+              />
+            </div>
+          </div>
+
+          <div className="flex items-center justify-between">
+            <div className="flex items-center">
+              <input
+                id="remember-me"
+                name="remember-me"
+                type="checkbox"
+                className="h-4 w-4 text-primary focus:ring-primary border-gray-300 rounded"
+              />
+              <label htmlFor="remember-me" className="mr-2 block text-sm text-gray-900">
+                مرا به خاطر بسپار
+              </label>
+            </div>
+
+            <div className="text-sm">
+              <a href="/forgot-password" className="font-medium text-primary hover:text-primary-600">
+                فراموشی رمز عبور؟
+              </a>
+            </div>
+          </div>
+
+          <div>
+            <button
+              type="submit"
+              disabled={loading}
+              className={`group relative w-full flex justify-center py-2 px-4 border border-transparent text-sm font-medium rounded-md text-white bg-primary hover:bg-primary-600 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary ${loading ? 'opacity-70 cursor-not-allowed' : ''}`}
+            >
+              {loading ? 'در حال ورود...' : 'ورود'}
+            </button>
+          </div>
+        </form>
+
+        <div className="text-center text-sm">
+          <p className="text-gray-600">
+            حساب کاربری ندارید؟{' '}
+            <a href="/register" className="font-medium text-primary hover:text-primary-600">
+              ثبت‌نام کنید
+            </a>
+          </p>
+        </div>
+      </div>
+    </div>
+  );
+}

client/src/pages/Register.jsx

@@ -0,0 +1,158 @@
+import { useState } from 'react';
+import { useNavigate } from 'react-router-dom';
+import { useAuth } from '../context/AuthContext';
+import { toast } from 'react-toastify';
+
+export default function Register() {
+  const [formData, setFormData] = useState({
+    username: '',
+    email: '',
+    fullName: '',
+    password: '',
+    confirmPassword: ''
+  });
+  const [loading, setLoading] = useState(false);
+  const { register } = useAuth();
+  const navigate = useNavigate();
+
+  const handleChange = (e) => {
+    setFormData({
+      ...formData,
+      [e.target.name]: e.target.value
+    });
+  };
+
+  const handleSubmit = async (e) => {
+    e.preventDefault();
+    
+    if (formData.password !== formData.confirmPassword) {
+      toast.error('رمز عبور و تکرار آن مطابقت ندارند');
+      return;
+    }
+
+    setLoading(true);
+
+    try {
+      await register({
+        username: formData.username,
+        email: formData.email,
+        password: formData.password,
+        fullName: formData.fullName
+      });
+      toast.success('ثبت‌نام با موفقیت انجام شد');
+      navigate('/dashboard');
+    } catch (err) {
+      toast.error(err.message || 'خطا در ثبت‌نام');
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  return (
+    <div className="min-h-screen flex items-center justify-center bg-gray-50 py-12 px-4 sm:px-6 lg:px-8">
+      <div className="max-w-md w-full space-y-8 bg-white p-8 rounded-lg shadow-md">
+        <div className="text-center">
+          <h2 className="mt-6 text-3xl font-extrabold text-gray-900">ثبت‌نام در پایتون مستری</h2>
+        </div>
+        <form className="mt-8 space-y-6" onSubmit={handleSubmit}>
+          <div className="rounded-md shadow-sm space-y-4">
+            <div>
+              <label htmlFor="fullName" className="block text-sm font-medium text-gray-700 mb-1">
+                نام کامل
+              </label>
+              <input
+                id="fullName"
+                name="fullName"
+                type="text"
+                required
+                className="appearance-none relative block w-full px-3 py-2 border border-gray-300 placeholder-gray-500 text-gray-900 rounded-md focus:outline-none focus:ring-primary focus:border-primary focus:z-10 sm:text-sm"
+                placeholder="نام و نام خانوادگی"
+                value={formData.fullName}
+                onChange={handleChange}
+              />
+            </div>
+            <div>
+              <label htmlFor="username" className="block text-sm font-medium text-gray-700 mb-1">
+                نام کاربری
+              </label>
+              <input
+                id="username"
+                name="username"
+                type="text"
+                required
+                className="appearance-none relative block w-full px-3 py-2 border border-gray-300 placeholder-gray-500 text-gray-900 rounded-md focus:outline-none focus:ring-primary focus:border-primary focus:z-10 sm:text-sm"
+                placeholder="نام کاربری دلخواه"
+                value={formData.username}
+                onChange={handleChange}
+              />
+            </div>
+            <div>
+              <label htmlFor="email" className="block text-sm font-medium text-gray-700 mb-1">
+                آدرس ایمیل
+              </label>
+              <input
+                id="email"
+                name="email"
+                type="email"
+                required
+                className="appearance-none relative block w-full px-3 py-2 border border-gray-300 placeholder-gray-500 text-gray-900 rounded-md focus:outline-none focus:ring-primary focus:border-primary focus:z-10 sm:text-sm"
+                placeholder="example@domain.com"
+                value={formData.email}
+                onChange={handleChange}
+              />
+            </div>
+            <div>
+              <label htmlFor="password" className="block text-sm font-medium text-gray-700 mb-1">
+                رمز عبور
+              </label>
+              <input
+                id="password"
+                name="password"
+                type="password"
+                required
+                className="appearance-none relative block w-full px-3 py-2 border border-gray-300 placeholder-gray-500 text-gray-900 rounded-md focus:outline-none focus:ring-primary focus:border-primary focus:z-10 sm:text-sm"
+                placeholder="••••••••"
+                value={formData.password}
+                onChange={handleChange}
+              />
+            </div>
+            <div>
+              <label htmlFor="confirmPassword" className="block text-sm font-medium text-gray-700 mb-1">
+                تکرار رمز عبور
+              </label>
+              <input
+                id="confirmPassword"
+                name="confirmPassword"
+                type="password"
+                required
+                className="appearance-none relative block w-full px-3 py-2 border border-gray-300 placeholder-gray-500 text-gray-900 rounded-md focus:outline-none focus:ring-primary focus:border-primary focus:z-10 sm:text-sm"
+                placeholder="••••••••"
+                value={formData.confirmPassword}
+                onChange={handleChange}
+              />
+            </div>
+          </div>
+
+          <div>
+            <button
+              type="submit"
+              disabled={loading}
+              className={`group relative w-full flex justify-center py-2 px-4 border border-transparent text-sm font-medium rounded-md text-white bg-primary hover:bg-primary-600 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary ${loading ? 'opacity-70 cursor-not-allowed' : ''}`}
+            >
+              {loading ? 'در حال ثبت‌نام...' : 'ثبت‌نام'}
+            </button>
+          </div>
+        </form>
+
+        <div className="text-center text-sm">
+          <p className="text-gray-600">
+            قبلا ثبت‌نام کرده‌اید؟{' '}
+            <a href="/login" className="font-medium text-primary hover:text-primary-600">
+              ورود به حساب کاربری
+            </a>
+          </p>
+        </div>
+      </div>
+    </div>
+  );
+}

server/routes/auth.js

@@ -3,25 +3,70 @@ const jwt = require('jsonwebtoken');
 const bcrypt = require('bcryptjs');
 const User = require('../models/User');
 const router = express.Router();
-
 // Register
 router.post('/register', async (req, res) => {
   try {
-    const { username, email, password } = req.body;
+    const { username, email, password, fullName } = req.body;
     
-    let user = await User.findOne({ email });
-    if (user) return res.status(400).json({ message: 'User already exists' });
+    // Validate input
+    if (!username || !email || !password || !fullName) {
+      return res.status(400).json({ message: 'همه فیلدهای ضروری را پر کنید' });
+    }
+
+    // Validate email format
+    const emailRegex = /\S+@\S+\.\S+/;
+    if (!emailRegex.test(email)) {
+      return res.status(400).json({ message: 'فرمت ایمیل نامعتبر است' });
+    }
+
+    // Check if user exists
+    let user = await User.findOne({ $or: [{ email }, { username }] });
+    if (user) {
+      return res.status(400).json({ 
+        message: 'کاربر با این ایمیل یا نام کاربری وجود دارد' 
+      });
+    }
+
+    // Create new user
+    user = new User({ 
+      username, 
+      email, 
+      password,
+      profile: { fullName }
+    });
 
-    user = new User({ username, email, password });
     await user.save();
 
+    // Generate JWT token
     const token = jwt.sign({ id: user._id }, process.env.JWT_SECRET, {
       expiresIn: '30d'
     });
 
-    res.status(201).json({ token, user: { id: user._id, username, email, role: user.role } });
+    // Set cookie
+    res.cookie('token', token, {
+      httpOnly: true,
+      secure: process.env.NODE_ENV === 'production',
+      maxAge: 30 * 24 * 60 * 60 * 1000, // 30 days
+      sameSite: 'strict'
+    });
+
+    res.status(201).json({ 
+      success: true,
+      token, 
+      user: { 
+        id: user._id, 
+        username, 
+        email, 
+        role: user.role,
+        fullName
+      } 
+    });
   } catch (err) {
-    res.status(500).json({ message: 'Server error' });
+    console.error('Registration error:', err);
+    res.status(500).json({ 
+      success: false,
+      message: 'خطای سرور. لطفا دوباره تلاش کنید' 
+    });
   }
 });
 
@@ -29,28 +74,130 @@ router.post('/register', async (req, res) => {
 router.post('/login', async (req, res) => {
   try {
     const { email, password } = req.body;
-    const user = await User.findOne({ email });
     
-    if (!user || !(await user.comparePassword(password))) {
-      return res.status(400).json({ message: 'Invalid credentials' });
+    // Validate input
+    if (!email || !password) {
+      return res.status(400).json({ message: 'ایمیل و رمز عبور را وارد کنید' });
+    }
+
+    // Find user
+    const user = await User.findOne({ email });
+    if (!user) {
+      return res.status(401).json({ 
+        success: false,
+        message: 'ایمیل یا رمز عبور اشتباه است' 
+      });
+    }
+
+    // Check password
+    const isMatch = await user.comparePassword(password);
+    if (!isMatch) {
+      return res.status(401).json({ 
+        success: false,
+        message: 'ایمیل یا رمز عبور اشتباه است' 
+      });
     }
 
+    // Generate JWT token
     const token = jwt.sign({ id: user._id }, process.env.JWT_SECRET, {
       expiresIn: '30d'
     });
 
+    // Set cookie
+    res.cookie('token', token, {
+      httpOnly: true,
+      secure: process.env.NODE_ENV === 'production',
+      maxAge: 30 * 24 * 60 * 60 * 1000, // 30 days
+      sameSite: 'strict'
+    });
+
     res.json({ 
+      success: true,
       token, 
       user: { 
         id: user._id, 
         username: user.username, 
         email: user.email, 
-        role: user.role 
+        role: user.role,
+        fullName: user.profile?.fullName || ''
       } 
     });
   } catch (err) {
-    res.status(500).json({ message: 'Server error' });
+    console.error('Login error:', err);
+    res.status(500).json({ 
+      success: false,
+      message: 'خطای سرور. لطفا دوباره تلاش کنید' 
+    });
   }
 });
 
-module.exports = router;
+// Get current user
+router.get('/me', async (req, res) => {
+  try {
+    const token = req.cookies.token || req.headers.authorization?.split(' ')[1];
+    if (!token) {
+      return res.status(401).json({ 
+        success: false,
+        message: 'Not authorized' 
+      });
+    }
+
+    const decoded = jwt.verify(token, process.env.JWT_SECRET);
+    const user = await User.findById(decoded.id).select('-password');
+
+    if (!user) {
+      return res.status(404).json({ 
+        success: false,
+        message: 'User not found' 
+      });
+    }
+
+    res.json({ 
+      success: true,
+      user 
+    });
+  } catch (err) {
+    console.error('Auth error:', err);
+    res.status(401).json({ 
+      success: false,
+      message: 'Not authorized' 
+    });
+  }
+});
+
+// Logout
+router.get('/logout', (req, res) => {
+  res.clearCookie('token');
+  res.json({ 
+    success: true,
+    message: 'Logged out successfully' 
+  });
+});
+// Auth middleware
+function auth(req, res, next) {
+  const token = req.cookies.token || req.headers.authorization?.split(' ')[1];
+  
+  if (!token) {
+    return res.status(401).json({ 
+      success: false,
+      message: 'Not authorized' 
+    });
+  }
+
+  try {
+    const decoded = jwt.verify(token, process.env.JWT_SECRET);
+    req.user = decoded;
+    next();
+  } catch (err) {
+    console.error('Auth error:', err);
+    res.status(401).json({ 
+      success: false,
+      message: 'Not authorized' 
+    });
+  }
+}
+
+module.exports = {
+  router,
+  auth
+};

server/server.js

@@ -20,7 +20,7 @@ mongoose.connect(process.env.MONGODB_URI, {
 .catch(err => console.error('MongoDB connection error:', err));
 
 // Routes
-const authRoutes = require('./routes/auth');
+const { router: authRoutes, auth } = require('./routes/auth');
 const courseRoutes = require('./routes/courses');
 const userRoutes = require('./routes/users');