Zen Eddin Allaham

هي ب نسبة ل رابط ريندر لكنه لا يعمل مع مشروعي https://www-movies-app.netlify.app/ هاد رابط مستودع https://github.com/ZenZN99/Movies-App import React, { useEffect, useState } from "react"; import "./register.css"; import toast from "react-hot-toast"; import { useNavigate } from "react-router-dom"; import AOS from "aos"; import "aos/dist/aos.css"; const Register = () => { const [form, setForm] = useState({ username: "", email: "", password: "", }); const [error, setError] = useState(""); const [loading, setLoading] = useState(false); const navigate = useNavigate(); const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => { setForm({ ...form, [e.target.name]: e.target.value }); }; const handleSubmit = async (e: React.FormEvent) => { e.preventDefault(); setLoading(true); setError(""); try { const res = await fetch("https://movies-app-2-19xd.onrender.com/api/auth/register", { method: "post", headers: { "Content-Type": "application/json", }, body: JSON.stringify(form), }); const data = await res.json(); if (!res.ok) { setError(data.error || "Something went wrong!"); } else { localStorage.setItem("token", data.token); localStorage.setItem("username", data.user.username); toast.success(`Welcome ${data.user.username}`); setForm({ username: "", email: "", password: "" }); navigate("/"); } } catch (error) { console.log(error); setError("Network error. Please try again later."); } finally { setLoading(false); } }; useEffect(() => { if (error) { const timer = setTimeout(() => { setError(""); }, 5000); return () => clearTimeout(timer); } }, [error]); useEffect(() => { const token = localStorage.getItem("token"); if (token) { navigate("/"); toast("You are logged in with action", {duration:3000}); return; } }, []); useEffect(() => { AOS.init({ duration: 2000 }); }, []); return ( <div className="register-container" data-aos="fade-up"> <div className="register-wrapper"> <div className="register-card"> <h1 className="register-title">Create Account</h1> <p className="register-subtitle">Join our community today</p> <form onSubmit={handleSubmit} className="register-form"> {error && <p className="error-message">{error}</p>} <input type="text" name="username" placeholder="Username" value={form.username} onChange={handleChange} required /> <input type="email" name="email" placeholder="Email Address" value={form.email} onChange={handleChange} required /> <input type="password" name="password" placeholder="Password" value={form.password} onChange={handleChange} required /> <button type="submit" className="register-btn"> {loading ? "Creating an account..." : "Register"} </button> </form> <p className="register-footer"> Already have an account? <a href="/login">Login</a> </p> </div> </div> </div> ); }; export default Register; import express from "express"; import dotenv from "dotenv"; import userRouter from "./routes/user.route"; import cors from "cors"; dotenv.config(); const app = express(); const port = process.env.PORT || 3000; app.use( cors({ origin: "https://www-movies-app.netlify.app", credentials: true, }) ); app.use(express.json()); app.use("/api/auth", userRouter); app.get("/", (req, res) => { res.send("Hello Bun!"); }); app.listen(port, () => { console.log(`Server is running on port ${port}`); });

log في ريندر مافيه اي مشاكل ورابط شغال لكن عند استخدامه في fetch لا يعمل وحتى مع app.use(cors());

الخادم يعمل بشكل سليم ولا يوجد أي مشاكل فيه لكن عند رفعه على الريندر توقف الخادم مع اني كل خطوات التي نفذتها صحيحة

اول شي رفعت اكواد على جيت هب وبعدين رفعت على ريندر وحصلت رابط واستخدمته في fetch وعدلت كورس app.use( cors({ origin: "https://www-movies-app.netlify.app", credentials: true, }) );ورجعت رفعت على ريندر واخدت رابط وستخدمه في fetch بدل من رابط ريندر قديم ورجعت رفعت مشروع رياكت https:www-movies-app.netlify.app بنفس رابط ولم يعمل خادم import express from "express"; import dotenv from "dotenv"; import userRouter from "./routes/user.route"; import cors from "cors"; dotenv.config(); const app = express(); const port = process.env.PORT || 3000; app.use( cors({ origin: "https://www-movies-app.netlify.app", credentials: true, }) ); app.use(express.json()); app.use("/api/auth", userRouter); app.get("/", (req, res) => { res.send("Hello Bun!"); }); app.listen(port, () => { console.log(`Server is running on port ${port}`); });

انا بعرف Node js JavaScript ومتقنهم شو لغة يلي لح تخليني Back end engineer Java - Golang - python - rust - cpp

انا صراحة تعبت من Front end و حابب ان اكون Back End developer من خلال Node.js bun.js python golang java هل اذا تركت فرونت اند سيضر بي سببي لترك فرونت اند هو لان فرونت اند ممل و متعب اما باك اند مريح ويوجد تعامل مع برمجة ب كامل

انا نزلت bun.js وتحققت من bun --version وظهر لكن عند تشغيله لا يعمل

انا سويت مشاريع فول ستاك وهم Todolist App - Image gallery app Pintrest clone وبدي مشاريع للمبتدئين ماهي مشاريع

انا اقوم ب انشاء مشاريع فول ستاك لكني استخدم AI دائماً في مساعدتي ب حل مشكلات + توليد افكار + تصميم + مساعدتي ب انشاء شيء معين لا اعلم كيف انجزه لكن بالطبع كل سطر كود يقوم AI ب توليده افهمه ويمكني تعديل عليه لكني اواجه مشاكل مع نفسي عندما اتعاون مع AI والتي هي اشعر ب ضعف لان AI قام ب مساعدتي ولست انا من قام ب انشاء مشروع من 0 الى 100

هل يمكنني استغناء عن Node.js واستخدم bun.js وأيضاً هل Next.js v16 صالح حالياً للاستخدام ام مازال في مرحلة تطوير

مشكلة لم تنحل هكذا استخدمته في axios import express from 'express'; import dotenv from 'dotenv'; import { connectDB } from './libs/connectDB.js'; import userRouter from './routes/user.route.js'; import imageRouter from './routes/image.route.js'; import cors from 'cors'; import path from 'path'; dotenv.config(); const app = express(); app.use(express.json()) app.use(cors({ origin: 'https://mern-image-gallery-app.netlify.app', credentials: true })); connectDB(); const port = process.env.PORT || 3000; app.get('/' , (req , res) => { res.send("Hello World!"); }); app.use('/api/auth' ,userRouter); app.use('/api/images' ,imageRouter); app.use('/uploads', express.static(path.join(process.cwd(), 'public', 'uploads'))); app.listen(port , () => { console.log(`Server is running on port ${port}`) }); import { useState, useEffect } from 'react'; import axios from 'axios'; import { FaHeart, FaRegHeart } from 'react-icons/fa'; import { useNavigate } from 'react-router-dom'; import toast from 'react-hot-toast'; const Home = () => { const [images, setImages] = useState([]); const [loading, setLoading] = useState(true); const [message, setMessage] = useState(""); const [modalImage, setModalImage] = useState(null); const navigate = useNavigate(); const token = localStorage.getItem("token"); useEffect(() => { const fetchImages = async () => { try { const res = await axios.get("https://mern-stack-image-gallery-app.onrender.com/api/images"); setImages(res.data); } catch (err) { console.error(err); setMessage("حدث خطأ أثناء جلب الصور"); } finally { setLoading(false); } }; fetchImages(); }, []); const handleLike = async (id) => { if (!token) { toast.error("يجب تسجيل الدخول اولاُ", { duration: 3000 }); navigate("/login"); return; } try { const res = await axios.post( `https://mern-stack-image-gallery-app.onrender.com/api/images/like/${id}`, {}, { headers: { Authorization: `Bearer ${token}` } } ); setImages(images.map((img) => img._id === id ? { ...img, likes: res.data.likes } : img )); } catch (error) { console.error(error); toast.error(error.response?.data?.message || "حدث خطأ أثناء الإعجاب بالصورة"); } }; if (loading) return <p className="text-center mt-10">جارٍ تحميل الصور...</p>; if (message) return <p className="text-center mt-10 text-red-500">{message}</p>; return ( <div className="container mx-auto p-4 grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-4"> {images.map((img) => ( <div key={img._id} className="border rounded shadow p-2 bg-white relative h-72"> <img src={`https://mern-stack-image-gallery-app.onrender.com${img.imageUrl}`} alt={img.title || "img"} className="w-full h-48 object-cover rounded cursor-pointer" onClick={() => setModalImage(img)} /> <h3 className=" mt-2 font-semibold">{img.title}</h3> <p className='text-gray-800'>{img.description}</p> <button onClick={() => handleLike(img._id)} className="absolute top-2 right-2 text-red-500 text-xl" > {img.likes && img.likes > 0 ? <FaHeart /> : <FaRegHeart />} <span className="ml-1">{img.likes || 0}</span> </button> </div> ))} {modalImage && ( <div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50"> <div className="bg-white rounded p-4 max-w-lg w-full relative"> <button onClick={() => setModalImage(null)} className="absolute top-2 right-2 text-xl font-bold text-gray-600 hover:text-black" > ❌ </button> <img src={`https://mern-stack-image-gallery-app.onrender.com${modalImage.imageUrl}`} alt={modalImage.title} className="w-full h-auto rounded mb-4" /> <h2 className="text-xl font-bold mb-2">{modalImage.title}</h2> <p className="text-gray-700">{modalImage.description}</p> </div> </div> )} </div> ); }; export default Home;

عندي مشروع React + Express.js ورفعت مجلد خادم على render و تم رفعه بنجاح وعطاني رابط واستخدمته بدل من localhost:3000 وبعدين حطيت رابط مشروع في cors بهذه شكل app.use(cors({ origin: 'https://mern-image-gallery-app.netlify.app/', credentials: true })); ورفعت مجلد عميل على Netlify وخادم لم يعمل.

ماهي مشكلة التي ظهرت لم استطع حلها Todolist full stack.zip

هل رسالتي وصلت الى مركز مساعدة ام يوجد ضغط اصبح ثلاث ايام من تسليم مستودع مشروع تخرج لكن لحد الان لم يتم رد

هل سيستغرق وقت طويلاً في معالجة خادم MongoDB atlas

استخدمت IP عالمي في mongodb atlas لكن مر وقت حوالي نصف ساعة وهي قيد الانتظار Pending ما سبب وكيف يمكن حلها

الان انا ب انتظار مراجعة مشروع تخرج لكي احصل على شهادة بس بدي اعرف شهادة اكاديمية حسوب هل لها فترة انتهاء صلاحية وتصبح فقط ورقة

السلام عليكم انتهيت من مشروع تخرج وسلمته للمركز مساعدة بس ليش مركز مساعدة يتأخرو برد

الان بدأ يرفع صور بنجاح لكن لا يتم عرض صور في واجهة رئيسية بعد ما استخدمنت Cloudinary برغم انها تحفظ في قاعدة بيانات https://image-gallery-llmy3g4pa-zen-allahams-projects.vercel.app/ "use server"; import { NextRequest, NextResponse } from "next/server"; import { connectDB } from "@/app/libs/connectDB"; import { isAuthenticate } from "@/app/libs/isAuthenticate"; import Image from "@/app/models/Image"; import { v2 as cloudinary } from "cloudinary"; import { Readable } from "stream"; cloudinary.config({ cloud_name: process.env.CLOUDINARY_CLOUD_NAME, api_key: process.env.CLOUDINARY_API_KEY, api_secret: process.env.CLOUDINARY_API_SECRET, }); function bufferToStream(buffer: Buffer) { const readable = new Readable(); readable._read = () => {}; readable.push(buffer); readable.push(null); return readable; } export async function POST(request: NextRequest) { try { await connectDB(); const user = await isAuthenticate(request); if (!user) { return NextResponse.json({ message: "غير مصرح" }, { status: 401 }); } const formData = await request.formData(); const title = formData.get("title") as string; const description = formData.get("description") as string; const file = formData.get("file") as File; if (!file) { return NextResponse.json({ message: "اختر صورة أولاً" }, { status: 400 }); } const fileBuffer = Buffer.from(await file.arrayBuffer()); const uploadResult = await new Promise<any>((resolve, reject) => { const stream = cloudinary.uploader.upload_stream( { folder: "images" }, (error, result) => { if (error) reject(error); else resolve(result); } ); bufferToStream(fileBuffer).pipe(stream); }); // إنشاء مستند جديد في MongoDB const newImage = await Image.create({ title, description, imageUrl: uploadResult.secure_url, userId: user._id, likes: 0, likedBy: [], }); return NextResponse.json({ success: "تم رفع الصورة بنجاح", image: newImage, }); } catch (err) { console.log(err); return NextResponse.json( { message: "حدث خطأ في السيرفر" }, { status: 500 } ); } } import { connectDB } from "@/app/libs/connectDB"; import Image from "@/app/models/Image"; import { NextRequest, NextResponse } from "next/server"; export async function GET(request:NextRequest){ try{ await connectDB(); const images = await Image.find().sort({createdAt: -1}); return NextResponse.json(images); }catch(err){ console.log(err); return NextResponse.json({ message: "حدث خطأ في السيرفر" }, { status: 500 }); } }

الان بدأ يرفع صور بنجاح لكن لا يتم عرض صور في واجهة رئيسية بعد ما استخدمنت Cloudinary https://image-gallery-72gqvgbz9-zen-allahams-projects.vercel.app/ "use server"; import { NextRequest, NextResponse } from "next/server"; import { connectDB } from "@/app/libs/connectDB"; import { isAuthenticate } from "@/app/libs/isAuthenticate"; import Image from "@/app/models/Image"; import { v2 as cloudinary } from "cloudinary"; import { Readable } from "stream"; cloudinary.config({ cloud_name: process.env.CLOUDINARY_CLOUD_NAME, api_key: process.env.CLOUDINARY_API_KEY, api_secret: process.env.CLOUDINARY_API_SECRET, }); function bufferToStream(buffer: Buffer) { const readable = new Readable(); readable._read = () => {}; readable.push(buffer); readable.push(null); return readable; } export async function POST(request: NextRequest) { try { await connectDB(); const user = await isAuthenticate(request); if (!user) { return NextResponse.json({ message: "غير مصرح" }, { status: 401 }); } const formData = await request.formData(); const title = formData.get("title") as string; const description = formData.get("description") as string; const file = formData.get("file") as File; if (!file) { return NextResponse.json({ message: "اختر صورة أولاً" }, { status: 400 }); } const fileBuffer = Buffer.from(await file.arrayBuffer()); const uploadResult = await new Promise<any>((resolve, reject) => { const stream = cloudinary.uploader.upload_stream( { folder: "images" }, (error, result) => { if (error) reject(error); else resolve(result); } ); bufferToStream(fileBuffer).pipe(stream); }); // إنشاء مستند جديد في MongoDB const newImage = await Image.create({ title, description, imageUrl: uploadResult.secure_url, userId: user._id, likes: 0, likedBy: [], }); return NextResponse.json({ success: "تم رفع الصورة بنجاح", image: newImage, }); } catch (err) { console.log(err); return NextResponse.json( { message: "حدث خطأ في السيرفر" }, { status: 500 } ); } } import { connectDB } from "@/app/libs/connectDB"; import Image from "@/app/models/Image"; import { NextRequest, NextResponse } from "next/server"; export async function GET(request:NextRequest){ try{ await connectDB(); const images = await Image.find().sort({createdAt: -1}); return NextResponse.json(images); }catch(err){ console.log(err); return NextResponse.json({ message: "حدث خطأ في السيرفر" }, { status: 500 }); } }

يعني لازم اعدل كود مشروعي بالكامل

رفعت مشروع في Vercel لكن انا استخدم وحدات fs path في رفع صور لكن لماذا vercel يطلب Cloudinary ولا يستطيع تعامل مع fs path

الحمدلله انتهيت من مشروع تخرج وباقي فقط رفع لكن اريد معرفة ماذا يعني قصور في مشروع

هل مسموح إذا انتهيت من مشروع التخرج قبل الموعد التسليم أن أقوم بتقديمه؟

الحمد لله، قربت أنتهي من مشروع التخرج، لكن أريد ملاحظة في حول التصميم. هلق أنا سويت المنطق البرمجي بشكل رائع ومنظم، لكنني لا أركز على التصميم. بالطبع، الموقع متجاوب مع جميع الأجهزة، لكنني في التصميم يعني ليس احترافي. هل يوجد مشكلة بذلك؟