محمود سعداوي2

السلام عليكم. في المثال التالي: عند الضغط على submit أريد ظهور الpost مباشرة دون إعادة تحديث الصفحة. الكود initialState: { posts: [], error: false, loading: false, }, reducers: { setPosts(state, action) { state.posts = action.payload }, getPosts(state, action) { state.posts = action.payload }, api call // Get All Posts export function getPosts() { return async (dispatch, getState) => { try { dispatch(postActions.setLoading()); const { data } = await axios.get(`${POSTS_URL}`, { headers: { "x-auth-token": getState().auth.user.token, }, }); dispatch(postActions.getPosts(data)) dispatch(postActions.clearLoading()) // console.log(data); } catch (error) { console.log(error); } }; } // Create A Post export function createPost(post) { return async (dispatch, getState) => { try { dispatch(postActions.setLoading()); const data = await axios.post(`${POSTS_URL}`, post, { headers: { "x-auth-token": getState().auth.user.token, }, }); dispatch(postActions.setPosts(data.data)) dispatch(postActions.clearLoading()) console.log(data); } catch (error) { console.log(error); dispatch(postActions.clearLoading()) } }; } postsscreen const dispatch = useDispatch(); const handleCreatePost = () => { dispatch(createPost({ text })); setText(""); dispatch(postActions.getPosts()); }; useEffect(() => { dispatch(getPosts()); }, [dispatch]); شكرا على المساعدة

السلام عليكم. ظهرت لي رسائل الخطأ التالية بشكل مفاجئ. في الكونسول: رسالة الخطأ cookie.js:32 Uncaught Error: Cannot find module 'net' at webpackMissingModule (cookie.js:32:1) at ../node_modules/tough-cookie/lib/cookie.js (cookie.js:32:1) at options.factory (react refresh:6:1) at __webpack_require__ (bootstrap:24:1) at fn (hot module replacement:62:1) at ../node_modules/request/lib/cookies.js (cookies.js:3:1) at options.factory (react refresh:6:1) at __webpack_require__ (bootstrap:24:1) at fn (hot module replacement:62:1) at ../node_modules/request/index.js (index.js:18:1) صفحة الويب: ERROR in ../node_modules/sshpk/lib/private-key.js 7:13-30 Module not found: Error: Can't resolve 'crypto' in 'C:\Users\saadaoui\Desktop\dev_tawassol\node_modules\sshpk\lib' BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default. This is no longer the case. Verify if you need this module and configure a polyfill for it. If you want to include a polyfill, you need to: - add a fallback 'resolve.fallback: { "crypto": require.resolve("crypto-browserify") }' - install 'crypto-browserify' If you don't want to include a polyfill, you can use an empty module like this: resolve.fallback: { "crypto": false } ERROR in ../node_modules/sshpk/lib/signature.js 7:13-30 Module not found: Error: Can't resolve 'crypto' in 'C:\Users\saadaoui\Desktop\dev_tawassol\node_modules\sshpk\lib' BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default. This is no longer the case. Verify if you need this module and configure a polyfill for it. If you want to include a polyfill, you need to: - add a fallback 'resolve.fallback: { "crypto": require.resolve("crypto-browserify") }' - install 'crypto-browserify' If you don't want to include a polyfill, you can use an empty module like this: resolve.fallback: { "crypto": false } ERROR in ../node_modules/sshpk/lib/utils.js 27:13-30 Module not found: Error: Can't resolve 'crypto' in 'C:\Users\saadaoui\Desktop\dev_tawassol\node_modules\sshpk\lib' BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default. This is no longer the case. Verify if you need this module and configure a polyfill for it. If you want to include a polyfill, you need to: - add a fallback 'resolve.fallback: { "crypto": require.resolve("crypto-browserify") }' - install 'crypto-browserify' If you don't want to include a polyfill, you can use an empty module like this: resolve.fallback: { "crypto": false } ERROR in ../node_modules/tough-cookie/lib/cookie.js 33:10-24 Module not found: Error: Can't resolve 'net' in 'C:\Users\saadaoui\Desktop\dev_tawassol\node_modules\tough-cookie\lib' ERROR in ../node_modules/tough-cookie/lib/cookie.js 34:15-35 Module not found: Error: Can't resolve 'url' in 'C:\Users\saadaoui\Desktop\dev_tawassol\node_modules\tough-cookie\lib' BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default. This is no longer the case. Verify if you need this module and configure a polyfill for it. If you want to include a polyfill, you need to: - add a fallback 'resolve.fallback: { "url": require.resolve("url/") }' - install 'url' If you don't want to include a polyfill, you can use an empty module like this: resolve.fallback: { "url": false } ERROR in ../node_modules/tunnel-agent/index.js 3:10-24 Module not found: Error: Can't resolve 'net' in 'C:\Users\saadaoui\Desktop\dev_tawassol\node_modules\tunnel-agent' ERROR in ../node_modules/tunnel-agent/index.js 4:8-22 Module not found: Error: Can't resolve 'tls' in 'C:\Users\saadaoui\Desktop\dev_tawassol\node_modules\tunnel-agent' ERROR in ../node_modules/tunnel-agent/index.js 5:9-24 Module not found: Error: Can't resolve 'http' in 'C:\Users\saadaoui\Desktop\dev_tawassol\node_modules\tunnel-agent' BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default. This is no longer the case. Verify if you need this module and configure a polyfill for it. If you want to include a polyfill, you need to: - add a fallback 'resolve.fallback: { "http": require.resolve("stream-http") }' - install 'stream-http' If you don't want to include a polyfill, you can use an empty module like this: resolve.fallback: { "http": false } ERROR in ../node_modules/tunnel-agent/index.js 6:10-26 Module not found: Error: Can't resolve 'https' in 'C:\Users\saadaoui\Desktop\dev_tawassol\node_modules\tunnel-agent' BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default. This is no longer the case. Verify if you need this module and configure a polyfill for it. If you want to include a polyfill, you need to: - add a fallback 'resolve.fallback: { "https": require.resolve("https-browserify") }' - install 'https-browserify' If you don't want to include a polyfill, you can use an empty module like this: resolve.fallback: { "https": false } ERROR in ../node_modules/tunnel-agent/index.js 8:11-28 Module not found: Error: Can't resolve 'assert' in 'C:\Users\saadaoui\Desktop\dev_tawassol\node_modules\tunnel-agent' BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default. This is no longer the case. Verify if you need this module and configure a polyfill for it. If you want to include a polyfill, you need to: - add a fallback 'resolve.fallback: { "assert": require.resolve("assert/") }' - install 'assert' If you don't want to include a polyfill, you can use an empty module like this: resolve.fallback: { "assert": false } vs code => terminal ERROR in ../node_modules/tunnel-agent/index.js 3:10-24 [1] Module not found: Error: Can't resolve 'net' in 'C:\Users\saadaoui\Desktop\dev_tawassol\node_modules\tunnel-agent' [1] [1] ERROR in ../node_modules/tunnel-agent/index.js 4:8-22 [1] Module not found: Error: Can't resolve 'tls' in 'C:\Users\saadaoui\Desktop\dev_tawassol\node_modules\tunnel-agent' [1] [1] ERROR in ../node_modules/tunnel-agent/index.js 5:9-24 [1] Module not found: Error: Can't resolve 'http' in 'C:\Users\saadaoui\Desktop\dev_tawassol\node_modules\tunnel-agent' [1] [1] BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default. [1] This is no longer the case. Verify if you need this module and configure a polyfill for it. [1] [1] If you want to include a polyfill, you need to: [1] - add a fallback 'resolve.fallback: { "http": require.resolve("stream-http") }' [1] - install 'stream-http' [1] If you don't want to include a polyfill, you can use an empty module like this: [1] resolve.fallback: { "http": false } [1] [1] ERROR in ../node_modules/tunnel-agent/index.js 6:10-26 [1] Module not found: Error: Can't resolve 'https' in 'C:\Users\saadaoui\Desktop\dev_tawassol\node_modules\tunnel-agent' [1] [1] BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default. [1] This is no longer the case. Verify if you need this module and configure a polyfill for it. [1] [1] If you want to include a polyfill, you need to: [1] - add a fallback 'resolve.fallback: { "https": require.resolve("https-browserify") }' [1] - install 'https-browserify' [1] If you don't want to include a polyfill, you can use an empty module like this: [1] resolve.fallback: { "https": false } [1] [1] ERROR in ../node_modules/tunnel-agent/index.js 8:11-28 [1] Module not found: Error: Can't resolve 'assert' in 'C:\Users\saadaoui\Desktop\dev_tawassol\node_modules\tunnel-agent' [1] [1] BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default. [1] This is no longer the case. Verify if you need this module and configure a polyfill for it. [1] [1] If you want to include a polyfill, you need to: [1] - add a fallback 'resolve.fallback: { "assert": require.resolve("assert/") }' [1] - install 'assert' [1] If you don't want to include a polyfill, you can use an empty module like this: [1] resolve.fallback: { "assert": false } شكرا على المساعدة

السلام عليكم. أنا بصدد العمل على مشروع MERN وأستعمل redux toolkit لإدارة حالة التطبيق. في المثال التالي: عند الضغط على زر الحذف، لايتم التفعيل إلا بعد تحديث الصفحة. الكود: slice removeEducation(state, action) { state.profile.education = state.profile.education.filter( (el) => el._id !== action.payload ); }, api call export function deleteEducation(educId) { return async (dispatch, getState) => { try { const { data } = await axios.delete( `${PROFILE_URL}/education/${educId}`, { headers: { "x-auth-token": getState().auth.user.token, }, } ); dispatch(profileActions.removeEducation(data)); // dispatch(profileActions.setProfile()) } catch (error) { const errors = error.response.data.errors; errors?.forEach((err) => { dispatch(alertActions.createAlert(err.msg)); dispatch(alertActions.clearAlert(err.id)); }); dispatch(profileActions.clearLoading()); console.log(error); } }; } المكون Education const handleRemoveEducation = (id) => { dispatch(deleteEducation(id)); }; ********************** {profile?.education.map((educ, index) => ( <tr key={index} className="bg-gray-100 border-b"> <td className="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900"> {index + 1} </td> <td className="text-sm text-gray-900 font-light px-6 py-4 whitespace-nowrap"> {educ.school} </td> <td className="text-sm text-gray-900 font-light px-6 py-4 whitespace-nowrap"> {educ.degree} </td> <td className="text-sm text-gray-900 font-light px-6 py-4 whitespace-nowrap"> {educ.current ? `${moment(educ.from).format( "DD MMM YYYY" )} - present` : `${moment(educ.from).format( "DD MMM YYYY" )} - ${moment(educ.to).format("DD MMM YYYY")}`} </td> <td className="text-sm text-gray-900 font-light px-6 py-4 whitespace-nowrap"> <Button dangerBtn type={"button"} onClick={() => handleRemoveEducation(educ._id)} > Delete </Button> </td> </tr> ))} شكرا على المساعدة.

السلام عليكم. بعد تسجيل الدخول، يتوجه المستخدم ملفه الشخصي للقيام بإضافة ما يتوجب من معطيات. في هذه الحالة تكون المصفوفة profile فارغة لأنه لاتوجد بداخلها بيانات تتعلق بالملف الشخصي للمستخدم. يقوم المستخدم إذن بإنشاء ملفه الشخصي بواسطة الكود التالي: const profileSlice = createSlice({ name: "profile", initialState: { profile: [], loading: false, isProfileCreated: false, }, reducers: { setProfile(state, action) { state.profile = action.payload }, setLoading(state) { state.loading = true }, clearLoading(state) { state.loading = false }, setIsProfileCreated(state) { state.isProfileCreated = true; state.loading = false }, clearIsProfileCreated(state) { state.isProfileCreated = false; }, }, }); *** export function createProfile(newProfile) { return async(dispatch, getState) => { try { dispatch(profileActions.setLoading()) const { data } = await axios.post(PROFILE_URL, newProfile, { headers: { 'x-auth-token': getState().auth.user.token } }) dispatch(profileActions.setProfile(data)) dispatch(profileActions.setIsProfileCreated()) setTimeout( () => dispatch(profileActions.clearIsProfileCreated()), 2000 ); } catch (error) { const err = error.response?.data.msg if (err) { dispatch(alertActions.createAlert(err)); dispatch(alertActions.clearAlert(err)); } const errors = error.response.data.errors errors?.forEach((err) => { dispatch(alertActions.createAlert(err.msg)); dispatch(alertActions.clearAlert(err.id)); }); dispatch(profileActions.clearLoading()) } } } **** const navigate = useNavigate(); const dispatch = useDispatch(); const { loading, isProfileCreated } = useSelector((state) => state.profile); const { alerts } = useSelector((state) => state.alert); const addNewProfile = (e) => { e.preventDefault(); dispatch( createProfile({ status, company, website, location, skills, githubusername, bio, twitter, facebook, instagram, linkedin, youtube, }) ); alerts.map((alert) => dispatch(alertActions.clearAlert(alert.id))); }; useEffect(() => { if (alerts.length > 0) { setShow(true); setTimeout(() => { setShow(false); }, 3000); } }, [alerts]); useEffect(() => { if (isProfileCreated) { navigate("/dashboard"); } }, [navigate, isProfileCreated]); هنا يتم إنشاء الملف الشخصي، ويتم تسجيل كافة المعطيات بقاعدة البيانات. المشكل الذي أواجهه. في الكود التالي const { profile } = useSelector((state) => state.profile); console.log(profile) عندما أقوم بتحديث الصفحة تصبح profile مصفوفة فارغة. أرجو المساعدة.

هذه هي profileSlice const profileSlice = createSlice({ name: "profile", initialState: { profile: [], loading: false, isProfileCreated: false, }, reducers: { setProfile(state, action) { state.profile = action.payload }, setLoading(state) { state.loading = true }, clearLoading(state) { state.loading = false }, setIsProfileCreated(state) { state.isProfileCreated = true; state.loading = false }, clearIsProfileCreated(state) { state.isProfileCreated = false; }, addExperience(state, action) { state.profile.experience = action.payload } }, }); profileApiCall export function createProfile(newProfile) { return async(dispatch, getState) => { try { dispatch(profileActions.setLoading()) const { data } = await axios.post(PROFILE_URL, newProfile, { headers: { 'x-auth-token': getState().auth.user.token } }) dispatch(profileActions.setProfile(data)) dispatch(profileActions.setIsProfileCreated()) setTimeout( () => dispatch(profileActions.clearIsProfileCreated()), 2000 ); } catch (error) { const err = error.response?.data.msg if (err) { dispatch(alertActions.createAlert(err)); dispatch(alertActions.clearAlert(err)); } const errors = error.response.data.errors errors?.forEach((err) => { dispatch(alertActions.createAlert(err.msg)); dispatch(alertActions.clearAlert(err.id)); }); dispatch(profileActions.clearLoading()) } } }

السلام عليكم. في الكود التالي: function DashboardScreen() { const { profile } = useSelector((state) => state.profile); return ( <div className="mt-16"> {profile.length === 0 ? ( <> <Title>Dashboard</Title> <div className="mx-4 mb-4 lg:mx-8"> <p className="text-lg text-zinc-800 my-4"> You have not yet setup a profile, please add some info. </p> <Button> <Link to="/dashboard/create-profile">Create Profile</Link> </Button> </div> </> ) : ( <> <MyComponent/> </> )} </div> ); } export default DashboardScreen; في البداية كل شيء تمام. لكن عندما أقوم بتحديث الصفحة يكون طول المصفوفة صفر. الرجاء المساعدة.

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

المشكل أن الكود يعمل دون تحريك. يعني لم يتم تفعيل animation

السلام عليكم. في الكود التالي لم أعرف لماذا يقع تفعيل التحريك (animation) الكود الأول <div className={`w-20 bg-slate-50 flex flex-col absolute top-14 transition-all duration-500 ease-in-out`} style={{ right: dropdown ? "2px" : "-100%", }} > الكود الثاني <div className={`w-20 bg-slate-50 flex flex-col absolute top-14 transition-all duration-500 ease-in-out ${dropdown ? "right-2" : "right-[-100%]"}`} // style={{ // right: dropdown ? "2px" : "-100%", // }} > شكرا.

لكن الكود الأول لم يعمل علما وأني لم أقم بتغيير الشيفرة غير التي أرفقتها تفضل هذا الكود الخاص بتسجيل الدخول وتعديل المستخدم /** * desc Register user * route POST /api/users * access Public */ const registerUser = asyncHandler(async (req, res) => { const { name, email, password } = req.body; const userExist = await User.findOne({ email }); if (userExist) { res.status(400).json({ message: "User Already Exist" }); } const user = await User.create({ name, email, password, }); if (user) { generateToken(res, user._id); res.status(201).json({ _id: user._id, name: user.name, email: user.email, isAdmin: user.isAdmin, }); } else { res.status(400).json({ message: "Invalid User Data" }); } }); /** * desc Update User profile * route PUT /api/users/profile * access Private */ const updateUserProfile = asyncHandler(async (req, res) => { const user = await User.findById(req.user._id); if (user) { user.name = req.body.name || user.name; user.email = req.body.email || user.email; if (req.body.password) { user.password = req.body.password; } const updatedUser = await user.save(); res.json({ _id: updatedUser._id, name: updatedUser.name, email: updatedUser.email, isAdmin: updatedUser.isAdmin, }); } else { res.status(404); throw new Error('User not found'); } });

السلام عليكم. لو تسمحوا أود معرفة الإختلاف بين الكودين التاليين. الكود الأول: userSchema.methods.matchPassword = async function (enteredPassword) { return await bcrypt.compare(enteredPassword, this.password); }; // Encrypt password using bcrypt userSchema.pre('save', async function (next) { if (!this.isModified('password')) { next(); } const salt = await bcrypt.genSalt(10); this.password = await bcrypt.hash(this.password, salt); }); الكود الثاني: userSchema.methods.matchPassword = async function (enteredPassword) { return await bcrypt.compare(enteredPassword, this.password) } // Encrypt password using bcrypt userSchema.pre('save', async function (next) { if (!this.isModified('password')) { next(); } const salt = await bcrypt.genSalt(10); const hashedPassword = await bcrypt.hash(this.password, salt); this.password = hashedPassword; }); مع العلم أن الكود الأول لم يقم بتشفير كلمة بينما الكود الثاني قام بتشفير كلمة المرور. شكرا على المساعدة.

تفضل

لا توجد لدي إضافات remix لم أجد إضافات remix

كيف أعرف ذلك

نتيجة البحث بدت فارغة. ليس لدي إضافات إذن

السلام عليكم ورمضان مبارك عليكم. يبدو أنني قمت بإضافة إمتداد في vs code مثلما توضح الصورة التالية أرجو المساعدة في معرفة هذا الإمتداد قصد حذفه. أعتذر على الجودة الضعيفة للصورة. شكرا.

السلام عليكم. أريد إضافة أزرار PayPal كمايلي: قمت بالكود التالي: index.js <PayPalScriptProvider deferLoading={true}> <App /> </PayPalScriptProvider> <> <button className="p-2 bg-slate-700 text-slate-100 rounded" onClick={onApproveTest}>Test Pay Order</button> <div className="bg-slate-100"> <PayPalButtons createOrder={createOrder} onApprove={onApprove} onError={onError} ></PayPalButtons> </div> </> المشكل أنه لم يتم التعرف على العنصر PayPalButtons وبالتالي لم تظهر الأزرار شكرا للمساعدة

السلام عليكم. أواجه مشكل في إستعمال الألوان الخاصة بتحديد رسالة خطأ. الكود الذي قمت به لرسالة الخطأ import React from 'react' function Message({ variant, children }) { console.log(variant) return ( <div className={`m-4 rounded-lg py-5 px-6 mb-4 text-base text-${variant}-700 bg-${variant}-100`} > {children} </div> ); } export default Message المشكل هو أنه لم يتسنى قراءة variant. مثلا في الكود التالي <Message variant='red'>ُحصل خطأ ما</Message> في هذه الحالة لم تظهر رسالة الخطأ باللون الأحمر وبخلفية حمراء، بالرغم أن console يظهر red (قيمة variant) شكرا لكم.

ماهو الفرق بين spread operator و array.push في الجافاسكريبت. ومتى نستعمل كليهما. شكرا.

يعني أقوم بشراء نطاق خاص بالإيميل و نطاق آخر خاص بالموقع.

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

يعني ممكن أن يكون portfolio بإيميل إحترافي أيهما أهم. الموقع الشخصي أم البريد الإلكتروني

السلام عليكم. عندي خلط بسيط بين أن تمتلك موقع شخصي أو سابقة أعمال (portfolio) مثل (https://mahmoud.tn) وأن يكون لديك إيميل إحترافي مثل (contact@mahmoud.tn) أعتقد أن لكل مهما فوائد كثيرة لكن لم أعرف أين يكمن الإختلاف بينهما بالضبط. شكرا.

تفضل ملفات المشروع (دون node_odules) test-hsoub.zip

السلام عليكم. أواجه الخطأ التالي: [0] Error [ERR_HTTP_HEADERS_SENT]: Cannot set headers after they are sent to the client [0] at new NodeError (node:internal/errors:400:5) [0] at ServerResponse.setHeader (node:_http_outgoing:663:11) [0] at ServerResponse.header (C:\Users\saadaoui\Desktop\MERN E-commerce\node_modules\express\lib\response.js:794:10) [0] at ServerResponse.json (C:\Users\saadaoui\Desktop\MERN E-commerce\node_modules\express\lib\response.js:275:10) [0] at errorHandler (file:///C:/Users/saadaoui/Desktop/MERN%20E-commerce/backend/middlewares/errorMiddleware.js:14:26) [0] at Layer.handle_error (C:\Users\saadaoui\Desktop\MERN E-commerce\node_modules\express\lib\router\layer.js:71:5) [0] at trim_prefix (C:\Users\saadaoui\Desktop\MERN E-commerce\node_modules\express\lib\router\index.js:326:13) [0] at C:\Users\saadaoui\Desktop\MERN E-commerce\node_modules\express\lib\router\index.js:286:9 [0] at Function.process_params (C:\Users\saadaoui\Desktop\MERN E-commerce\node_modules\express\lib\router\index.js:346:12) [0] at next (C:\Users\saadaoui\Desktop\MERN E-commerce\node_modules\express\lib\router\index.js:280:10) أعتقد أن مكان الخطأ في errorrMiddleware.js errorrMiddleware.js const notFound = (req, res, next) => { const error = new Error(`Not Found - ${req.originalUrl}`); res.status(404); next(error); }; const errorHandler = (err, req, res, next) => { let statusCode = res.statusCode === 200 ? 500 : res.statusCode; let message = err.message; // NOTE: checking for invalid ObjectId moved to it's own middleware // See README for further info. res.status(statusCode).json({ message: message, stack: process.env.NODE_ENV === "production" ? null : err.stack, }); }; export { notFound, errorHandler }; server.js import express from "express"; import dotenv from "dotenv"; import productRoutes from './routes/productRoutes.js' dotenv.config(); import connectDB from "./config/db.js" import { errorHandler, notFound } from "./middlewares/errorMiddleware.js"; const port = process.env.PORT || 5000; connectDB() const app = express() app.use(express.json()); app.use('/api/products', productRoutes) app.get('/', (req, res) => { res.send('API is running ...') }) app.use(notFound) app.use(errorHandler) app.listen(port, () => console.log(`Server is running on port ${port}`)) شكرا للمساعدة