Salah Eddin Beriani2

أنشئ ملف manager.py في مجلد users from django.contrib.auth.base_user import BaseUserManager from django.utils.translation import ugettext_lazy as _ class CustomUserManager(BaseUserManager): """ موديل معدل لجعل الدخول ب ايميل بدل اسم المستخدم """ def create_user(self, email, password, **extra_fields): """ انشاء المستخدم """ if not email: raise ValueError(_('The Email must be set')) email = self.normalize_email(email) user = self.model(email=email, **extra_fields) user.set_password(password) user.save() return user def create_superuser(self, email, password, **extra_fields): """ انشاء المستخدم ادمن """ extra_fields.setdefault('is_staff', True) extra_fields.setdefault('is_superuser', True) extra_fields.setdefault('is_active', True) if extra_fields.get('is_staff') is not True: raise ValueError(_('Superuser must have is_staff=True.')) if extra_fields.get('is_superuser') is not True: raise ValueError(_('Superuser must have is_superuser=True.')) return self.create_user(email, password, **extra_fields) من هنا يمكنك الاختيار اما استخدام AbstractUser أو AbstractBaseUser والشيفرة المستخدم في model.py على التوالي AbstractUser from django.contrib.auth.models import AbstractUser from django.db import models from django.utils.translation import ugettext_lazy as _ from .managers import CustomUserManager class CustomUser(AbstractUser): username = None email = models.EmailField(_('email address'), unique=True) USERNAME_FIELD = 'email' REQUIRED_FIELDS = [] objects = CustomUserManager() def __str__(self): return self.email AbstractBaseUser from django.contrib.auth.models import AbstractBaseUser, PermissionsMixin from django.db import models from django.utils import timezone from django.utils.translation import gettext_lazy as _ from .managers import CustomUserManager class CustomUser(AbstractBaseUser, PermissionsMixin): email = models.EmailField(_('email address'), unique=True) is_staff = models.BooleanField(default=False) is_active = models.BooleanField(default=True) date_joined = models.DateTimeField(default=timezone.now) USERNAME_FIELD = 'email' REQUIRED_FIELDS = [] objects = CustomUserManager() def __str__(self): return self.email تبقى الان أن تعدل settings.py AUTH_USER_MODEL = 'users.CustomUser'

يمكنك فتح ال console وتفقد اذا كان يظهر لك خطأ عند الضغط على الزر لأنه قد يكون حدث خطأ قبل الوصول لتلك الشيفرة ولكن في العموم لتفريغ ال form فأنت تحتاج ال formObject لأنه يحتوي على reset ويمكنك الحصول عليه عادة عبر $("#messages")[0].reset() أو $("#messages").get(0).reset() يمكنك استخدام trigger وهي تستخدم جزء من الشيفرة فوق لتفعيل ال reset مباشرة $("#messages").trigger("reset"); ويمكنك استخدام vanilla javascript document.getElementById("#messages").reset();

يمكنك استخدام line clump <div class="box"> <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.</p> </div> .box p { display: -webkit-box; -webkit-line-clamp: 3; // الرقم هنا هو عدد الأسطر المراد اظهارها -webkit-box-orient: vertical; overflow: hidden; }

يمكنك استخدام celery لتنفيذ المطلوب pip install -U Celery لاستدعاء مهمة بشكل دوري ، يجب عليك إضافة إدخال إلى قائمة beat schedule. from celery import Celery from celery.schedules import crontab app = Celery() @app.on_after_configure.connect def setup_periodic_tasks(sender, **kwargs): # Calls test('hello') every 10 seconds. sender.add_periodic_task(10.0, test.s('hello'), name='add every 10') # Calls test('world') every 30 seconds sender.add_periodic_task(30.0, test.s('world'), expires=10) # Executes every Monday morning at 7:30 a.m. sender.add_periodic_task( crontab(hour=7, minute=30, day_of_week=1), test.s('Happy Mondays!'), ) @app.task def test(arg): print(arg) @app.task def add(x, y): z = x + y print(z) يمكنك الجدولة كل يوم اثنين مثلا from celery.schedules import crontab app.conf.beat_schedule = { # Executes every Monday morning at 7:30 a.m. 'add-every-monday-morning': { 'task': 'tasks.add', 'schedule': crontab(hour=7, minute=30, day_of_week=1), 'args': (16, 16), }, }

مواقع حل المسائل هدفها تحديث المعلومات للمطورين الذين يعرفون مسبقا كيفية توظيف اللغة في العالم الواقعي لذا فبالنسبة لمطور مبتدأ لن تكون مناسبة و ستصاب بمتلازمة التقليل من الذات لأنك ستحس أنك بإمكانك حل المشاكل لكن لن تعرف كيف توظف معرفتك . نصيحتي لك هي أن تصقل مهاراتك جيدا في الأساسيات و توظفها في مشاريع صغيرة جدا وأحد هذه المشاريع التي أقترحها ستكون تطبيق في المتصفح وهو todo list ويمكنك بناءها بنسخ وعلى مراحل في كل مرة تتعلم توظيف جديد تضيفه لها ستكون رحلتك كالتالي طرح السؤال ما هو todo list تبحث في google لترى نماذج وستجد نماذج متطورة جدا لا تحاول بناءها الان الان لديك مفهوم عن كيفية عمل todo list والمفاهيم هي انشاء و تعديل وقراءة وحذف ال todos الان ستبحث عن ماذا تحتاج ستجد نفسك تحتاج مربع ادخال وزر للإدخال ومكان للعرض ستنشأ الخطوة السابقة ب html والان لديك واجهة ميتة ب html الان سترى أنها قبيحة وستريد تزيينها قليلا ستبحث في google عن كيفية تزيين الأزرار ومربعات الادخال الان ستبدأ في التفكير كيف يمكنك توظيف javascript في مفاهيم الخطوة الثالثة وهكذا توالي خطوة وراء خطوة وبالتوفيق.

افتح shell Django ، وانتقل إلى المجلد حيث يوجد ملف manager.py. يمكنك استخدام الأمر ls للتحقق من وجود ملف manager.py في الدليل الحالي. ثم قم بتشغيل هذا الأمر لفتح Django shell . python manage.py shell لإعادة تعيين كلمة مرور المستخدم ، يجب أولاً استيراد نموذج المستخدم. إذا كنت تستخدم نموذج مستخدم Django الافتراضي ، فيمكن استخدام الكود التالي لاستيراد نموذج المستخدم. from django.contrib.auth.models import User على الأرجح ستستخدم نموذج مستخدم مخصصًا. إذا كانت الإجابة بنعم ، فلن تعمل الطريقة المذكورة أعلاه من أجلك. على سبيل المثال ، إذا قمت بإنشاء نموذج مستخدم مخصص في تطبيق يسمى accounts، فاستخدم هذا الأمر بدلاً من ذلك. from accounts.models import User استبدل accounts باسم التطبيق و User باسم نموذج المستخدم الخاص بك. يمكننا أيضًا استخدام طريقة get_user_model () التي يوفرها Django للوصول إلى نموذج المستخدم. from django.contrib.auth import get_user_model User = get_user_model() يمكن جلب جميع حسابات المسؤول عن طريق تمرير is_superuser = المعلمة الحقيقية إلى طريقة التصفية. users = User.objects.filter(is_superuser=True) يمكننا استخدام طريقة set_password () لإعادة تعيين كلمة مرور أي مستخدم. user.set_password('new_password')

حسب ما فهمت من سؤالك أنك تريد طريقة لجلب بيانات قديمة ووضعها في form ثم تغييرها والتعديل عليها ثم حفظها ولقد حاولت تقريب العملية لهذا المنطق في الشيفرة في الاسفل import React, { useState } from 'react'; export default function App() { const [data, setData] = useState({ name: 'salah', email: 's@gmail.com' }); const handleChange = (e) => { //هنا المنطق لتغيير input setData((prv) => ({ ...prv, [e.target.name]: e.target.value })); }; console.log(data); const submit = () => { //حفظ البيانات الجديدة }; useEffect(() => { //هنا المنطق لجلب البيانلت القديمة ووضعها في الحالة const res = getdata(); setData(res); }, []); return ( <div> <form onsubmit={submit()} action=""> <input onChange={handleChange} type="text" name="name" defaultValue={data.name} /> <input onChange={handleChange} type="text" name="email" defaultValue={data.email} /> <button type="submit">تعديل</button> </form> </div> ); }

حسنا قد يكون لديك زر يحمل عدد اللايكات الحالية وعند ضغطه يزيد عدد اللايكات يمكنك تطبيق ش مشابه وهذا سيعطيك النتيجة المرادة import React, { useState, useEffect } from 'react'; import axios from 'axios'; export default function App() { const [likes, setLikes] = useState(8); const updateLikes = async () => { try { const res = await axios.post('/api/likes'); setLikes(res.data.likes); } catch (error) { console.log(error); } }; return ( <div> <button onClick={updateLikes}>{likes}</button> </div> ); }

Redux Persist هي مكتبة شهيرة تتيح لك إضافة الحفظ إلى المتجر. ستقوم المكتبة تلقائيًا بحفظ المتجر في كل مرة يتم فيها تحديث الحالة. لست بحاجة إلى كتابة أي رمز للحفظ في actions او reducers. import {createStore} from "redux"; import {persistStore, persistReducer} from "redux-persist"; import storage from "redux-persist/lib/storage"; const state = {authenticated: false}; const reducer = (state, action) => ({...state, ...action}); const persistConfig = { key: "root", storage }; const persistedReducer = persistReducer(persistConfig, reducer); const store = createStore(persistedReducer, state); const persistor = persistStore(store); تقبل الدالة persistReducer () كائن التكوين كمعاملها الأول. يجب تحديد المفتاح وخصائص التخزين. يعيّن المفتاح اسم خاصية المستوى الأعلى في الكائن المستمر. سيتم حفظ حالة متجرك كقيمة لهذه الخاصية. يحدد التخزين محرك التخزين المراد استخدامه. يدعم Redux Persist العديد من خلفيات التخزين المختلفة اعتمادًا على البيئة. لاستخدام الويب ، يتم دعم كل من واجهات برمجة تطبيقات التخزين المحلي و sessionStorage بالإضافة إلى ملفات تعريف الارتباط الأساسية. تتوفر الخيارات أيضًا لـ React Native و Node.js و Electron والعديد من الأنظمة الأساسية الأخرى. يمكنك تحديد محرك التخزين المراد استخدامه عن طريق استيراده من الحزمة الخاصة به. يجب بعد ذلك تمرير كائن تنفيذ API الرئيسي كخيار تخزين إلى Redux Persist. الكائن الثابت الذي تم إرجاعه من استدعاءات persistStore () له عدة طرق مساعدة للسماح لك بإدارة الحفظ. يمكنك إيقاف الحفظ مؤقتًا واستئنافها باستخدام أساليب الإيقاف pause() resume() على التوالي. يمكنك فرض كتابة فورية على محرك التخزين باستخدام flush (). يمكن أن يكون هذا مفيدًا إذا كنت بحاجة إلى ضمان استمرار حالتك بعد عملية معينة. يمكنك مسح كافة البيانات المستمرة من محرك التخزين باستخدام .purge (). في معظم الحالات ، يجب تجنب ذلك - يجب عليك استخدام إجراء Redux لمسح متجرك ، والذي سينتشر تلقائيًا بعد ذلك إلى البيانات الدائمة.

يبدو أنك لم تبدأ فرعك الرئيسي بشكل صحيح. هل طبقتي commit لملفاتك؟ جربي (على افتراض أنك في فرع master): git add . git commit -m "First commit" git push heroku master (على افتراض أنك في فرع main) git add . git commit -m "First commit" git push heroku master

تحميل الملف إلى الخادم باستخدام Django هو مهمة سهلة للغاية. يوفر Django طرق مضمنة تساعد في تحميل ملف على الخادم. يتم استخدام طريقة Forms.FileField () لإنشاء إدخال ملف وإرسال الملف إلى الخادم. أثناء العمل مع الملفات ، تأكد من أن علامة نموذج HTML تحتوي على خاصية enctype = "multipart / form-data". لنرى مثالاً index.html إنشاء نموذج HTML يحتوي على مكون إدخال ملف. <body> <form method="POST" class="post-form" enctype="multipart/form-data"> {% csrf_token %} {{ form.as_p }} <button type="submit" class="save btn btn-default">Save</button> </form> </body> forms.py from django import forms class StudentForm(forms.Form): firstname = forms.CharField(label="Enter first name",max_length=50) lastname = forms.CharField(label="Enter last name", max_length = 10) email = forms.EmailField(label="Enter Email") file = forms.FileField() # for creating file input views.py هنا ، طلب param إضافي واحد. الملفات مطلوبة في المنشئ. تحتوي هذه الوسيطة على نسخة الملف الذي تم تحميله. from django.shortcuts import render from django.http import HttpResponse from myapp.functions.functions import handle_uploaded_file from myapp.form import StudentForm def index(request): if request.method == 'POST': student = StudentForm(request.POST, request.FILES) if student.is_valid(): handle_uploaded_file(request.FILES['file']) return HttpResponse("File uploaded successfuly") else: student = StudentForm() return render(request,"index.html",{'form':student}) urls.py from django.contrib import admin from django.urls import path from myapp import views urlpatterns = [ path('admin/', admin.site.urls), path('index/', views.index), ] Upload Script تُستخدم هذه الوظيفة لقراءة الملف الذي تم تحميله وتخزينه في الموقع المتوفر. ضع هذا الرمز في ملف functions.py. لكن قم أولاً بإنشاء هذا الملف في المشروع. def handle_uploaded_file(f): with open('myapp/static/upload/'+f.name, 'wb+') as destination: for chunk in f.chunks(): destination.write(chunk)

get و post هي طلبات لخادم في مكان ما فرضا أن تطور على حاسوبك ولديك خادم يحتوي على endpoint app.post("/post/add", (req,res) => { ....... }) app.listen(5000) الخادم يشتغل محليا على port 5000 في هذه الحالة يمكنك اجراء طلب بهذه الطريقة axios.post("http://localhost:5000/post/add", JSON.stringify({ Nom: Nom, Maison: Maison, Adresse: Adresse, Mdps: Mdps, }))

تأكدي أن C:\coffee> هو مجلد المشروع أولا ثم بعد ذلك قومي بإزالة مجلد node_modules و package.lock.json ثم قومي بإعادة تثبيت المكتبات عن طريق npm install ثم جربي تشغيل الخادم مرة أخرى

هي وظيفة يمكنك مناداتها بعد انتهاء العملية للتنظيف const client = await pool.connect() try { const res = await client.query('SELECT * FROM users WHERE id = $1', [1]) console.log(res.rows[0]) } catch (error) { console.log(err.stack) } finally { // تحرير العملية client.release() }

نغم يمكنك حفظها في قاعدة البيانات هذا بديهي ولكن أيضا يمكنك تضمين المعلومات في ال token المرسل بمعنى عند فك تشفير ال token في backend ستحصل على معلومات ال user بما فيها النوع و يمكنك التصرف على ذلك الأساس

هذه العملية تستلزم حجب في frontend و backend أيضا لنفترض أن user schema هي كالتالي { username:salah, password:fqffza, type:"user" } في ال type للمستخدم العادي user ومثلا للمدير admin { username:vergil, password:fqffza, type:"admin" } سيكون لديك middlewrae في bakend خصيصا للroutes التي تتطلب صلاحيات مدير وستجلب من خلاله المستخدم وتتاكد من انه مدير قبل السماح له بتفعيل ال route

منذ الإصدار 11.0.0 ، يوفر Next.js تجربة ESLint متكاملة خارج الصندوق. أضف next lint على هيئة نص برمجي إلى package.json: "scripts": { "lint": "next lint" } إذا لم يكن لديك بالفعل ESLint تم تكوينه في التطبيق الخاص بك ، فسيتم إرشادك خلال عملية التثبيت والتكوين. yarn lint # You'll see a prompt like this: # # ? How would you like to configure ESLint? # # ❯ Base configuration + Core Web Vitals rule-set (recommended) # Base configuration # None سيقوم Next.js تلقائيًا بتثبيت eslint و eslint-config-next كاعتمادات تطوير في تطبيقك وإنشاء ملف .eslintrc.json في جذر مشروعك الذي يتضمن التكوين الذي اخترته.

حبذا لو استخدمت دالة خارجية ثم قمت بعملك هناك وتمرير ما تريد const MainCard = ({ image, title, price, onPress, onFavPress }) => { const [isFav, setIsFav] = useState(false); const onPress1 = (params) => {//يمكنك تمرير ما تريد هنا setIsFav(!isFav); //يمكنك التعامل هنا } return ( <TouchableOpacity onPress={onPress} style={styles.container}> <TouchableOpacity // onPress={() => setIsFav(!isFav)} onPress={onPress1} style={styles.iconContainer} > {isFav ? ( <Icon name="favorite-border" size={phoneWidth * 0.05} /> ) : ( <Icon name="favorite" size={phoneWidth * 0.05} color="red" /> )} </TouchableOpacity> <Image style={styles.imageBackground} source={image} resizeMode="cover" /> <Text numberOfLines={2} style={styles.title}> {title} </Text> <Text style={styles.price}>{price} SAR</Text> </TouchableOpacity> ); };

لا أدري بالضبط عن أي إضافة أنت تتحدث لكن من مضمون الشيفرة فهمت انك تبحث عن Item لتضيفها الى سلة المفضلة وذلك عبر تغيير القيمة المنطقية if (itemFav === true) return { ...state, myAllAds: state.myAllAds.map((content, i) => i === action.payload.id - 1 ? { ...content, isFav: false } : content ), }; if (itemFav === false) return { ...state, myAllAds: state.myAllAds.map((content, i) => i === action.payload.id - 1 ? { ...content, isFav: true } : content ), }; قمت بتعديل الشيفرة لتتماشى مع ما فهمت انك تريد تحقيقه

هذا يعتمد على كيفية تعامل الخادم مع الكوكيز المذكورة وكيفية البرمجة التي تمت للتعامل مع المصادقة ولكن اذا كنت تعتمد على تلك الكوكيز لابقاء المصادقة وكان هذا يتم التعامل معه من الخادم في كل مرة فنعم يعتبر هذا مصادقة تلقائية

نظرًا لأن Next.js يحتاج إلى بعض الوقت ليكون جاهزًا عند التشغيل الأول ، يجب أن تعلن عن مساراتك داخل callback ، بعد تسجيل المكون الإضافي. سيعرض المكون الإضافي واجهة برمجة التطبيقات التالية في Fastify والتي ستتعامل مع العرض نيابة عنك. const fastify = require('fastify')() fastify .register(require('fastify-nextjs')) .after(() => { fastify.next('/hello') }) fastify.listen(3000, err => { if (err) throw err console.log('Server listening on http://localhost:3000') }) إذا كنت بحاجة إلى التعامل مع جزء العرض بنفسك ، فما عليك سوى تمرير callback إلى next fastify.next('/hello', (app, req, reply) => { // your code // `app` is the Next instance app.render(req.raw, reply.raw, '/hello', req.query, {}) }) إذا كان لديك معالجة مسبقة مخصصة لطلبات _next / * ، فيمكنك منع هذا المعالجة باستخدام noServeAssets: الخاصية true لخيارات المكون الإضافي fastify .register(require('fastify-nextjs'), { noServeAssets: true }) .after(() => { fastify.next(`${process.env.BASE_PATH || ''}/_next/*`, (app, req, reply) => { // your code app.getRequestHandler()(req.raw, reply.raw).then(() => { reply.sent = true }) }) })

اختصار ، طالما أن المصادقة ليست تلقائية (عادةً ما يوفرها المتصفح) ، فلا داعي للقلق بشأن حماية CSRF. إذا كان تطبيقك يقوم بإرفاق بيانات الاعتماد Headers فلن يتمكن المتصفح من مصادقة الطلبات تلقائيًا ، ولن يكون CSRF ممكنًا. لذلك لا يعني ذلك أن Bearer Tokens هي أفضل دفاع ضد هجمات CSRF ، ولكن ببساطة CSRF عبارة عن هجوم يهاجم على وجه التحديد الطلبات حيث يوفر المتصفح تلقائيًا المصادقة (عادةً ملفات تعريف الارتباط والمصادقة الأساسية) ، وبالتالي لا يهم CSRF إذا كان المتصفح لا يمكنه مصادقتك.

هذا الجزء من الشيفرة const tasks = document.getElementById('tasks'); اذا قمنا بطباعته سوف يعطينا <div id="tasks"> <h3>sqsqs</h3> <h3>sqsqs</h3> <h3>sqsqs</h3> <h3>sqsqs</h3> <h3>sqsqs</h3> </div> أنت تحتاج الى مجموعة ال h3 التي يمكن ان تتواجد في الداخل او بالتحديد النص المتواجد داخل كل h3 لذا ستحتاج الى NodeList tasks.childNodes tasks.childNodes.forEach((node) => { if (node.nodeName === 'H3') { console.log(node.innerText); } }); الشيفرة بالأعلى كفيلة بان تأتي لك بكل النصوص الخاصة ب h3

هذا الجزء <div id="treexil-right"> © جميع الحقوق محفوظة <a href="https://art-demo-be.blogspot.com/">Art Demo</a> </div> يمتلك margin-right: 426px في كل الشاشات لذا يتحتم عليك تعديلها في الشاشات الصغيرة @media screen and (max-width: 900px) .treexil-wrapper #treexil-right, .treexil-wrapper #treexil-left { float: none; text-align: center; margin-right: auto;//////// }

أعتقد أن كلاهما متماثل. لكن pool.query سيسمح لك بتنفيذ استعلام فردي أساسي عندما تحتاج إلى التنفيذ من عميل يمكن الوصول إليه من مجموعة مؤشرات ترابط العميل. لذلك يمكن استخدام pool.query لتشغيل الاستعلام مباشرة بدلاً من الحصول على عميل ثم تشغيل الاستعلام مع هذا العميل. يمكنك استخدام pool بهذه الطريقة const { Pool } = require('pg') const pool = new Pool() pool.connect((err, client, release) => { if (err) { return console.error('Error acquiring client', err.stack) } client.query('SELECT NOW()', (err, result) => { release() if (err) { return console.error('Error executing query', err.stack) } console.log(result.rows) }) }) نفس العملية في الأعلى بدون استخدام pool const { Client } = require('pg').Client const client = new Client() client.connect() client.query('SELECT NOW()', (err, res) => { if (err) throw err console.log(res) client.end() }) مباشرة استدعاء query من pool const { Pool } = require('pg') const pool = new Pool() // Direct query without acquiring client object. pool.query('SELECT $1::text as name', ['brianc'], (err, result) => { if (err) { return console.error('Error executing query', err.stack) } console.log(result.rows[0].name) // brianc })