لوحة المتصدرين
المحتوى الأكثر حصولًا على سمعة جيدة
المحتوى الأعلى تقييمًا في 06/10/24 في كل الموقع
-
السلام عليكم. بعد تقييم منتج محدد أريد إظهار التقييم على الواجهة البرمجية. Slice import { createSlice } from "@reduxjs/toolkit"; const bookSlice = createSlice({ name: "book", initialState: { books: [], reviews: [], error: false, loading: false, }, reducers: { addReviews(state, action) { state.books = action.payload }, getReviews(state, action) { state.reviews = action.payload; }, setLoading(state) { state.loading = true; }, clearLoading(state) { state.loading = false; }, } }) const bookReducer = bookSlice.reducer; const bookActions = bookSlice.actions; export {bookActions, bookReducer} apiCall // Get Book Reviews export function getBookReviews(bookId) { return async (dispatch, getState) => { try { dispatch(bookActions.setLoading()) const {data} = await axios.get(`${BOOK_URL}/${bookId}/reviews`, { headers: { "authorization": getState().auth.user.accessToken } }); dispatch(bookActions.getReviews(data)); dispatch(bookActions.clearLoading()); } catch (error) { toast.error(error?.response?.data.message); dispatch(bookActions.clearLoading()); } }; } // Post Review export function postReview(bookId, review) { return async (dispatch, getState) => { try { dispatch(bookActions.setLoading()) const {data} = await axios.post(`${BOOK_URL}/${bookId}/reviews`, review, { headers: { "authorization": getState().auth.user.accessToken } }); toast.success(data?.message) dispatch(bookActions.addReviews()) dispatch(bookActions.getReviews(review)); dispatch(bookActions.clearLoading()); } catch (error) { toast.error(error?.response?.data.message); dispatch(bookActions.clearLoading()); } }; } React Component // Get Book Reviews export function getBookReviews(bookId) { return async (dispatch, getState) => { try { dispatch(bookActions.setLoading()) const {data} = await axios.get(`${BOOK_URL}/${bookId}/reviews`, { headers: { "authorization": getState().auth.user.accessToken } }); dispatch(bookActions.getReviews(data)); dispatch(bookActions.clearLoading()); } catch (error) { toast.error(error?.response?.data.message); dispatch(bookActions.clearLoading()); } }; } // Post Review export function postReview(bookId, review) { return async (dispatch, getState) => { try { dispatch(bookActions.setLoading()) const {data} = await axios.post(`${BOOK_URL}/${bookId}/reviews`, review, { headers: { "authorization": getState().auth.user.accessToken } }); toast.success(data?.message) dispatch(bookActions.addReviews()) dispatch(bookActions.getReviews(review)); dispatch(bookActions.clearLoading()); } catch (error) { toast.error(error?.response?.data.message); dispatch(bookActions.clearLoading()); } }; } Review.jsx import moment from "moment"; import React from "react"; import Rating from "../rating/Rating"; import { Oval } from "react-loader-spinner"; import { useSelector } from "react-redux"; function Reviews() { const { loading, reviews } = useSelector((state) => state.book); return ( <div className="get-reviews"> <h2 className="get-reviews-title">Reviews ({reviews?.length})</h2> <div className="reviews"> {loading ? ( <Oval height={120} width={120} color="rgb(247, 96, 14)" wrapperStyle={{ height: "90vh", display: "flex", alignItems: "center", justifyContent: "center", }} wrapperClass="" visible={true} ariaLabel="oval-loading" secondaryColor="#E2E2E2" strokeWidth={3} strokeWidthSecondary={3} /> ) : ( Array.isArray(reviews) && reviews.map((el, key) => ( <div className="user-review" key={key}> <p> <span>{el?.username ? el?.username : "Unknown User"}</span>{" "} {`- `} {moment(el?.createdAt).format("DD MMM YYYY")} </p> <Rating rating={el?.rate} /> <p>{el?.comment}</p> </div> )) )} </div> </div> ); } export default Reviews; شكرا1 نقطة
-
1 نقطة
-
مرحباً عبد السلام , اختيار أفضل نسخة لينكس يعتمد على احتياجاتك وتفضيلاتك الشخصية، ولكن هناك بعض التوزيعات الشهيرة والمحبوبة التي تتميز بتوفر عدد كبير من المستودعات ودعم واسع من المجتمع: Ubuntu واحدة من أكثر التوزيعات شهرة وسهولة في الاستخدام. مستودعات كبيرة مع دعم واسع للتطبيقات. تحديثات منتظمة ودعم طويل الأجل للإصدارات LTS. Debian: الأساس للعديد من التوزيعات الأخرى، بما في ذلك Ubuntu. مستودعات ضخمة تحتوي على آلاف الحزم. معروفة باستقرارها وموثوقيتها. Fedora: تقدم أحدث التقنيات والابتكارات في عالم لينكس. مستودعات جيدة ودعم متقدم للتطبيقات الحديثة. مدعومة من Red Hat، مما يجعلها خيارا قويًا لمطوري البرمجيات. Arch Linux: مثالية للمستخدمين المتقدمين الذين يريدون تخصيص نظامهم من الألف إلى الياء. مستودعات AUR (Arch User Repository) تحتوي على آلاف الحزم التي يتم صيانتها بواسطة المجتمع. توفر تحديثات مستمرة (rolling release). أيضاً كل من هذه التوزيعات تتمتع بدعم مجتمعي قوي، وتوفر مستودعاتها كمية كبيرة من البرمجيات والتطبيقات المختلفة.1 نقطة
-
1 نقطة
-
السلام عليكم، في موقع خمسات مثلا، حين أود أن أقدم خدمة، كإنشاء تطبيق واب أو هاتف من الصفر، بإستعمال React و React Nativeو Node، أي أن التطبيق Fullstack. كيف يمكنني تحديد المدة اللازمة لإنشاء التطبيق؟ أعني بذلك كيف يمكنني تحديد المجال الزمني المناسب و اللازم لإنشاء التطبيق؟ أعلم أنه ليست هناك إجابة محددة، كون تواجد العديد من العوامل المتحكمة و المتغيرات، كالخبرة و درجة تعقيد التطبيق وماشابه. ولكن على الأقل هناك ما يساعدني على تحديد مجال زمني مناسب ؟ شكرا مسبقا.1 نقطة
-
كما تم التوضيح في التعليقات السابقة فتحديد المدة الزمنية اللازمة لإنشاء تطبيق يعتمد على العديد من العوامل، ولكن هناك بعض الخطوات والنصائح التي يمكن أن تفيدك كمايلي أولاً يجب عليك تحديد ومعرفة جميع المتطلبات والوظائف التي يجب أن يحتويها التطبيق. بعد ذلك ستقوم بتقسيم المشروع إلى مهام صغيرة مع تقدير الزمن اللازم لكل مهمة على حدة. ومع خبرتك السابقة في مشاريع مشابهة ستجد أنه لا يوجد مشكلة هنا. كما أنه دائمًا ما تكون هناك مهام غير متوقعة أو تأخيرات في المشاريع. لذلك، يفضل إضافة وقت احتياطي إلى تقديرك الكلي. ومع ذلك يجب معرفة المدة الزمنية التي يتوقع العميل أن تقوم بإنجاز العمل بها فإذا كان لا يهمه كثيراً الوقت يمكنك تنفيذه في مدة زمنيه مناسبة بالنسبة لك ولكن إذا كان مستعجلاً فيفضل إنجاز العمل سريعاً1 نقطة
-
1 نقطة
-
لا يوجد جواب دقيق ولا يمكن أن يوجد. السبب أن الصفحة في تطبيق ويب ليست صفحة نصية مثل صفحات ملف PDF. الصفحة تتفاعل مع كود الواجهة الخلفية، وقد يكون فيها وظائف معقدة، وقد يكون فيها تحريكات (Animations) مميزة، وهذا كله يزيد في تعقيد الصفحة، كما أن الصفحات في كثير من الأحيان تكون مرتبطة ببعضها البعض، وتغيير في واحدة يؤثر على الصفحات الأخرى. لذلك هناك كثير من المتغيرات كما ترى. فلا يمكن أن نحسب "الزمن المتوسط للمبرمجين" في إنشاء الصفحات. إذا كنت تتوقع أنه بإمكانك إنجاز المطلوب بين يومين أو 7 أيام، فربما من الأحسن أن تقول 5 أيام، أو حتى 7 أيام، لكي تعطي لنفسك الوقت الكافي. وهذا في حالة ما لم يكن العميل مستعجلا. وإلا فحاول إنجاز العمل في أقرب الآجال.1 نقطة
-
1 نقطة
-
لا داعي لذكر مدة زمنية محددة وإلزام نفسك بها، بل اطرح ما تستطيع فعله وذكر المهارات التي تمتلكها وما الفائدة التي ستعود على العميل من تلك المهارات فهو لا يدري ما معنى Full-Stack. ويجب أن تظهر بمظهر إحترافي ومنظم وعدم الإنجراف وراء ما يطرحه الآخرين. مع ذكر شرط أنه يتم تحديد مدة المشروع بناءًا على المتطلبات ومدى تعقيد المشروع، وعند إعطاء مدة زمنية للعميل قم بمضاعفتها ففي البداية لن تكون لديك خبرة بتحديد المدة اللازمة، وفي حال قمت بإنجاز المشروع في أقل من ذلك فستكون تلك نقطة جيدة لصالحك وليس العكس. يمكنك ذكر مثلاً أن تطبيق بسيط مكون من 5 صفحات يستغرق مدة زمنية تساوي كذا1 نقطة
-
مرحبا احتاج خبير استعداد حساب مهكر في الانستقرام. الهكر غير الايميل و رقم التلفون و حط F2A. احتاج استراجعه باسرع وقت، مستعدة ادفع المبلغ المطلوب، بس بدي يرجعلي حسابي ضروري. ارجو الرد بسرعة1 نقطة
-
أولاً لديك خطأ في حساب متوسط التقييمات في السطر الذي يحسب فيه المتوسط النهائي finalRate. فالمتغير rate ربما يتم إرساله كقيمة غير صحيحة مثل قيمة نصية من الواجهة الأمامية، لذا لنتأكد من أن rate يتم تحويله إلى رقم صحيح قبل استخدامه في الحساب، وأيضًا التأكد من صحة قيم التقييم المرسلة من الواجهة الأمامية. أيضًا بعد إضافة المراجعة إلى قاعدة البيانات، عليك إعادة بيانات الكتاب المحدثة إلى الواجهة الأمامية، بما في ذلك التقييم الجديد، وبعد تلقي بيانات الكتاب المحدثة من الخادم، يجب تحديث حالة الكتاب في الواجهة الأمامية لتعكس التقييم الجديد. ثم استخدام البيانات المحدثة للكتاب في المكون لعرض التقييم الجديد. إليك التعديلات مع تعليقات لتوضيح أماكن التعديل. تعديل في bookController.js: const addReview = asyncHandler(async(req, res) => { const { id } = req.params const { comment, rate } = req.body const book = await Book.findById(id) const user = await User.findById(req.userId) // التحقق من وجود الكتاب if (!book) { return res.status(404).json({ message: "Book Not Found" }) } // التحقق من أن المستخدم لم يقيم الكتاب مسبقاً const isRated = book.reviews.findIndex(m => m.user == req.userId) if (isRated > -1){ return res.status(403).send({ message: "Review Is Already Added" }); } // تحويل تقييم المستخدم إلى رقم صحيح والتحقق من صحته const numericRate = parseInt(rate, 10); if (isNaN(numericRate) || numericRate < 1 || numericRate > 5) { return res.status(400).send({ message: "Invalid rating value" }); } // حساب التقييم النهائي const totalRate = book.reviews.reduce((sum, review) => sum + review.rate ,0) const finalRate = (totalRate + numericRate) / (book.reviews.length + 1) // تحديث بيانات الكتاب بإضافة المراجعة الجديدة وتحديث التقييم await Book.updateOne( { _id: id }, { $push: { reviews: { user: req.userId, username: user.name, comment, rate: numericRate } }, $set: { rate: finalRate } } ) // إعادة بيانات الكتاب المحدثة بعد الإضافة const updatedBook = await Book.findById(id); res.status(201).json(updatedBook) }) تحديث الدالة postReview في apiCall: export function postReview(bookId, review) { return async (dispatch, getState) => { try { dispatch(bookActions.setLoading()) const {data} = await axios.post(`${BOOK_URL}/${bookId}/reviews`, review, { headers: { "authorization": getState().auth.user.accessToken } }); // عرض رسالة نجاح باستخدام toast toast.success(data?.message) // تحديث بيانات الكتاب المحدثة في الحالة dispatch(bookActions.updateBook(data)); dispatch(bookActions.clearLoading()); } catch (error) { // عرض رسالة خطأ باستخدام toast toast.error(error?.response?.data.message); dispatch(bookActions.clearLoading()); } }; } تعديل في الواجهة الأمامية Modal.js const Modal = ({ showModal, handleClose, book }) => { const [rate, setRating] = useState(0); const [comment, setComment] = useState(""); const dispatch = useDispatch(); const navigate = useNavigate(); const submitReview = (e) => { e.preventDefault(); if (comment === "") { // التحقق من وجود تعليق وعرض رسالة خطأ في حال عدم وجوده return toast.error("Comment is required") } // تحويل تقييم المستخدم إلى رقم صحيح والتحقق من صحته const numericRate = parseInt(rate, 10); if (isNaN(numericRate) || numericRate < 1 || numericRate > 5) { return toast.error("Invalid rating value"); } // إرسال المراجعة باستخدام الدالة postReview dispatch(postReview(book._id, { rate: numericRate, comment })) }; return ( <div className={`modal ${showModal ? "show" : ""}`}> <div className="modal-content"> <span className="close" onClick={handleClose}>×</span> <h2>Submit Your Review</h2> <form onSubmit={submitReview}> <div className="rating-input"> <label>Rating:</label> <select value={rate} onChange={(e) => setRating(e.target.value)} required> <option value="" disabled>Select a rating</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> </select> </div> <div className="comment"> <label>Comment:</label> <textarea value={comment} onChange={(e) => setComment(e.target.value)} required /> </div> <button className='modal-btn' type="submit">Submit</button> </form> </div> </div> ); }; export default Modal; تحديث bookSlice لتضمين الدالة updateBook: const bookSlice = createSlice({ name: "book", initialState: { books: [], error: false, loading: false, }, reducers: { getBooks(state, action) { state.books = action.payload; }, findBook(state, action) { state.books = action.payload; }, addReviews(state, action) { state.books = action.payload; }, updateBook(state, action) { // البحث عن الكتاب المحدث وتحديثه const updatedBook = action.payload; const index = state.books.findIndex(book => book._id === updatedBook._id); if (index !== -1) { state.books[index] = updatedBook; } }, setLoading(state) { state.loading = true; }, clearLoading(state) { state.loading = false; }, setError(state) { state.error = true; }, clearError(state) { state.error = false; }, } }); export const bookActions = bookSlice.actions; export default bookSlice.reducer;1 نقطة
-
بالنسبة لإعطاء المشروع وقته التقريبي حاول أولا دراسة المشروع مجملا وقسّمه إلى أجزاء ,مثلا ستقوم بتطوير موقع وهذا الموقع به جزء Back-End و Front-End إذا كنت ستقوم بهما معا قسم كلا منهما إلى مهمات أو أجزاء متفرقة بحيث تعرف مدة كل مهمة ,ويمكن تجزئة المهمات إلى مهمات ضمنها بحيث يسهل عليك معرفة المدة بالتحديد,وأكتبها كلها في ورقة و بجانب كل واحدة المدة الزمنية لإنجازها,ثم اجمع حاصلها جميعا و أصف إليها 30بالمئة من الوقت المحصل عليه لإصلاح الثغرات ووقت البحث ان صادفت مهمة لم تعمل مثلها من قبل ,وحسب حدسك إن رأيت أن المشروع قد يأخذ منك وقتل أكثر من النتيجة المحصل عليها لا تتردد في إضافةبعض الوقت. أما مشكلتك الحالية مع مشروعك أنصحك بالتواص مع صاحب المشروع وأخبره بالمشكلة,فإن قدم لك تعويضا فبها ,أما إن رفض وكان الجزء المتبقي لا يحتاج وقال كبيرا فحاول أن تعمله وأنت الرابح طبعا -سمعتك-,أما في حالة كان الأمر يحتاج مدة أطول فأنهي المشروع, ولا تكمله.1 نقطة