لوحة المتصدرين

أتعلم أستخدام React وفي الفيديو التعليمي إستخدم المدرب العنصر <> </> في الكود التالي: class Component extends Component { render() { return <> <Post/> <Post/> </> } } ولا أعرف ما غائدة هذا العنصر، وعندما أقوم بإزالته يظهر لي هذا الخطأ multiple components must wrapt with end

هذا كود مختصر للعنصر Fragment return <React.Fragment> <Post/> <Post/> </React.Fragment> // هذا كود مختصر للسطر السابق return <> <Post/> <Post/> </> يعتمد React على بناء هيكل الصفحة يشبه الشجرة ويستخدم العنصر Fragment عند إرجاع مكونات متعددة، فإن افتراض أن هذه الشجرة من العناصر سيكون لها عنصر جذر واحد (عنصر رئيسي) فإنه سيكون من الصعب معالجة هذه الشجرة من المكونات. لذلك يجب أن يتم إرجاع عنصر واحد فقط ولحل هذه المشكلة يتم إستخدام العنصر React.Fragment لإحتواء كل العناصر الأخرى المرجعة، وهكذا يتم إرجاع عنصر واحد فقط. لاحظ أنه من الإصدار 16.2 في React يمكن إرجاع مصفوفة Array من العناصر بدلًا من إستخدام العنصر React.Fragment بهذا الشكل: return[ <div> Div 1</div>, <div> Div 2</div>, <div> Div 3</div>, <div> Div 4</div> ];

صحيح أنه يمكنك وضع الدوال المساعدة في أي مكان تريده ولكن المتعارف عليه أن يكون بداخل مجلد App مباشرة أو في المسار App/Http أو هنالك من ينشئ مجلداً خاصة في المجلد App ويعيطه الاسم Helpers ثم بداخله يضع الملف الذي سيحتوي على الدوال المساعدة ويمكنك بهذه الحالة تنظيم الدوال المساعدة حسب كل فئة لتنظيم الكود أكثر. كذلك التسمية المعروفة لهذا الملف هي helpers ولكن بالطبع يمكنك تسميته بأي اسم تريده. هذه بعض الأمور المتعارف عليها حيث في حال قام أي شخص آخر برؤية الكود سيعرف أن هذا هو الملف للدوال المساعدة, لكن بالطبع يمكنك التعديل عليه كما تريد في حال تم التوضيح على ان هذا الملف هو للدوال المساعدة. باقي الأمور من تعريف المشروع على ملف الدوال تم ذكره في الرد السابق.

يُمكنك ذلك من خلال إنشاء ملف php عادي في أي مسار تريده مثلاً في: tests |_ Utilities |_|___ functions.php و تضع الدوال التي تحتاجها فيه مثلاً: <?php function create($class, $attributes = []) { return $class::factory()->create($attributes); } function make($class, $attributes = []) { return $class::factory()->make($attributes); } الآن ستقوم بإضافة عملية التحميل التلقائي للملف من خلال composer و لعمل ذلك تحتاج التعديل على ملف composer.json: إن كنت تحتاج أن تتم عملية التحميل التلقائي للملف فقط في مرحلة التطوير ستُضيف مسار الملف داخل مصفوفة files ضمن الخاصية autoload-dev: "autoload-dev": { "psr-4": { "Tests\\": "tests/" }, "files": ["tests/Utilities/functions.php"] }, أما إن أردت أن تشمل العملية مرحلة الإنتاج فستضع مسار الملف داخل مصفوفة files في الخاصية autoload: "autoload": { "psr-4": { "App\\": "app/", "Database\\Factories\\": "database/factories/", "Database\\Seeders\\": "database/seeders/" }, "files": ["tests/Utilities/functions.php"] }, بعد ذلك قم بتنفيذ أمر: composer dump-autoload ثم ستتمكن من إستخدام الدوال التي أنشأتها في أي مكان تريد، في المثال أرفقت دالتين إحداهما لإنشاء سجل جديد من نموذج معين و الثانية تُنشئ السجل و تقوم بتخزينه في قاعدة البيانات، و هاتين الدالتين تحتاج لهما كثيرا في الإختبارات: و هذا مثال عن إستخدامها: <?php /** @test */ function an_authenticated_user_may_participate_in_forum_threads() { $this->signIn(); $reply = make(Reply::class); $this->post($this->thread->path . "/replies", $reply->toArray()); $this->get($this->thread->path) ->assertSee($reply->body); }

تحدث هذه المُشكلة لك بسبب أنك حددت إسم المُجلد في المُعامل الأول للدالة put، مثلاً إن كنت تريد وضع الملفات داخل مُجلد images يُمكنك ذلك من خلال: public function test(Request $request) { $fileInForm = 'file'; if ($request->hasFile($fileInForm)) { $file = $request->file($fileInForm); if ($file->isValid()) { // Filename is hashed filename + part of timestamp $hashedName = hash_file('md5', $file->path()); $timestamp = microtime(); $newFilename = $hashedName . $timestamp . '.' . $file->getClientOriginalExtension(); Storage::disk('local')->putFile('images', $file); } } } في هذه الحالة سيتم حفظ الملفات داخل مُجلد images و ستُعطي لارافيل إسم مُختلف للملف المرفوع في كل مرة تلقائياً، و ستُرجع الدالة putFile المسار الذي تم حفظ الملف فيه يُمكنك حفظه إن احتجت له. إن كنت ترغب في وضع الإسم الذي يُحفظ به الملف بنفسك يُمكنك إستخدام الدالة putFileAs بنفس الطريقة و تُمرر الإسم الذي ترغب فيه كمعامل ثالث: public function test(Request $request) { $fileInForm = 'file'; if ($request->hasFile($fileInForm)) { $file = $request->file($fileInForm); if ($file->isValid()) { // Filename is hashed filename + part of timestamp $hashedName = hash_file('md5', $file->path()); $timestamp = microtime(); $newFilename = $hashedName . $timestamp . '.' . $file->getClientOriginalExtension(); Storage::disk('local')->putFileAs('images', $file, $newFilename); } } } تُرجع الدالة أيضاً مسار الملف. تُتيح لارافيل أيضاً دالتي store و storeAs لكن هاتين الدالتين لا تُستخدمان بإستعمال الfacade بل مُباشرة على الملف بهذا الشكل مثلاً: $path = $request->file('file')->store('images'); $path = $request->file('file')->storeAs( 'images', $newName );

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

اريد ان اغير ايقونه البرجر التي تظهر عند عرض 768px الى ايقونه اغلاق عند الضغط عليها لكن لم تعمل معي هل يمكنك مساعدتي ؟ Restaurant_website_1.zip

السلام عليكم .. أريد ان اكتب هذا الاكشن ولكن باستخدام Axios وليس باستخدام ال Fetch .. ما هى التغييرات التى يجب ان أجريها هنا ؟؟ export const fetchProducts = () => { return async (dispatch) => { try { const response = await fetch( "https://rn-shopping-app-69186.firebaseio.com/products.json" ); if (!response.ok) { throw new Error("Error - something went wrong"); } const resData = await response.json(); const loadedProducts = []; for (const key in resData) { loadedProducts.push( new Product( key, resData[key].title, resData[key].imageUrl, resData[key].description, resData[key].price ) ); } dispatch({ type: SET_PRODUCTS, products: loadedProducts, }); } catch (error) { throw error; } }; };

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

إن التحقق من صحة المدخلات أو البيانات يمكن أن يتم في منطقتين: إما عند المستخدم أي متصفح الويب وبذلك يتم التأكد من المدخلات قبل إرسالها إلى خادم الويب. وأيضاً عند خادم الويب نفسه، بحيث عند وصول البيانات إليه يقوم بالتحقق من صحتها قبل البدء بعملية معالجتها أو تخزينها في قاعدة البيانات. للتحقق من البيانات عند طرف المستخدم (أي متصفح الويب) يتم استخدام javascript في ال forms المستخدمة والتي يتم إدخال البيانات فيها، مثال ليكن لدينا حقل البريد الالكتروني التالي: <form name="myForm" action="/action_page.php" onsubmit="return validateForm()" method="post"> Name: <input type="text" name="email"> <input type="submit" value="Submit"> </form> وعندها يمكن عند الضغط على زر submit التحقق من حقل البريد الالكتروني قبل إرسال الطلب إلى خادم الويب كالتالي: function validateForm() { var x = document.forms["myForm"]["email"].value; if (x == "") { alert("يرجى تعبئة حقل البريد الالكتروني"); return false; } وبالتالي سيظهر رسالة خطأ في حال كانت خانة البريد الالكتروني فارغة. وبنفس الطريقة يمكنك وضع الشروط الأخرى حسب الطلب مثل أن يكون البريد الالكتروني صحيح أو كلمة المرور أكبر من عدد محدد من المحارف،...إلخ. أما من جهة خادم الويب، فإن ذلك يعتمد على حسب لغة البرمجة التي تقوم باستخدامها من طرف الخادم، ولكن عموماً المبدأ هو نفسه فعند استقبال البيانات يتم أيضاً التحقق من صحتها عن طريق وضع شروط if else وفي حال لم تكن البيانات موافقة للشروط المذكورة يتم إرسال رسالة خطأ من الخادم إلى المستخدم. بعد التعديل على سؤالك: يمكنك عند القيام بجلب بيانات المستخدم من القاعدة وتخزينها في الجلسة التأكد من الحقول الفارغة في سجله في قاعدة البيانات وإرسال الرسالة المطلوبة إلى المستخدم.

لدي API مبنية بواسطة لارافيل وتتصل مع تطبيق Angular موجود على اسم نطاق وخادم ويب مختلف. أحاول استخدام Sanctum للتحقق من الطلبات المستقبلة من Angular ولكنها لا تحوي CSRF Token ولذلك احصل على الخطأ: CSRF token mismatch error حاولت إرسال طلب التحقق من المستخدم للخادم كالتالي: this.http.get('sanctum/csrf-cookie') .pipe( switchMap(result => this.http.post('auth/login', {'email': email, 'password': password})) ); ولكن لم تعالج المشكلة

المشكلة تحدث هنا لأن متصفح الويب أو تطبيق Angular سيقوم فقط بإرفاق الـ cookie للطلبات التي تنتمي لنفس اسم النطاق التي يتم عبره استقبال الطلبات. لحل هذه المشكلة أولاً تأكد من أنك تقوم باستخدام relative routes فمثلاً بدلاً من: /api/sanctum/crsf نقوم بكتابة: http://example.com/sanctum/crsf ثم يجب عليك إعداد خصائص البروكسي ضمن ملف proxy.conf.json ونضعه في المجلّد الجذر للمشروع: { "/api/*": { "target": "http://example.ocm", "secure": false, "changeOrigin": true, "logLevel": "debug", "pathRewrite": { "^/api": "" } } } ثم نقوم بتعديل الملف angular.json: "architect": { ... "serve": { ... "options": { .... "proxyConfig": "proxy.conf.json" } } } ثم أخيراً في ملف .env نقوم بالتعديلات التالية للتأكد من أن sanctum يقوم بالتعرف على الطلبات وإرفاق cookies معها: SANCTUM_STATEFUL_DOMAINS=localhost,.example.com SESSION_DRIVER=cookie SESSION_DOMAIN=localhost

أحاول تطوير نسخة مشروع مبني باستخدام Laravel و Vue JS إلى لارافيل 8، ولكن عند تنفيذ: npm run dev يظهر لدي هذا الخطأ: app.js:44258 Uncaught ReferenceError: route is not defined حاولت تتبع الخطأ فلاحظت وجود خط أحمر على السطر التالي: Vue.mixin({ methods: { route } }); ولكن لم استطع تحديد المشكلة أو كيفية حلها

قد يحدث تضارب عند تحديث النسخة إلى 8 مع blade في استخدام routes خاصةً في حال تم اختيار Jetstream لحل هذه المشكلة أولاً يمكن إنشاء مجلد resources كالتالي: composer require tightenco/ziggy npm install ziggy-js php artisan ziggy:generate "resources/js/ziggy.js" ثم يجب تعديل ملف webpack.mix.js: mix.js('resources/js/app.js', 'public/js') .webpackConfig(require('./webpack.config')); وأيضاً الملف ./webpack.config: لكي يتم التعرف على المسارات routes: const path = require('path'); module.exports = { resolve: { alias: { '@': path.resolve('resources/js'), ziggy: path.resolve('vendor/tightenco/ziggy/src/js/route.js'), }, }, }; وأخيراً ضمن الملف app.js: import route from 'ziggy'; import { Ziggy } from './ziggy'; ... Vue.mixin({ methods: { route: (name, params, absolute) => route(name, params, absolute, Ziggy), }, }); ... new Vue({ el: "#app", render: (h) => h(InertiaApp, { props: { initialPage: JSON.parse(app.dataset.page), resolveComponent: (name) => require(`./Pages/${name}`).default, }, }), }); وبذلك يتم الاستغناء عن vue-router ويتم أخذ jetstreams ليصبح توجيه المسارات من قبل Laravel

أهلا عبد الواحد، أعتقد أن حل المشكلة كما تفضل الزملاء، لم يتم التعرف على توابع وورد بريس، في حال لم تنفع الحلول أرجو إعادة التعليق. شكرا لك

يستخدم الوسم الفارغ <> </> إختصاراً ل fragment الخاصية التي تمكنك من إضافة أكثر من عنصر بدون الحاجة لوضعهم بداخل عنصر واحد كالتالي render() { return ( <React.Fragment> <header /> <main /> <footer /> </React.Fragment> ); } //إختصاراً سنقوم بكتابة التالي render() { return ( <> <header /> <main /> <footer /> </> ); } بينما إذا أردت تطبيق الكود بالأعلى بدون <> </> سيظهر لك خطأ وستضطر لوضع ال header وال main و ال footer بداخل عنصر واحد كالتالي render() { return ( <div> <header /> <main /> <footer /> </div> ); }

يتم جمع الاختبار الأول مع الثاني مع النهائي وطباعة تقدير الطالب على النحو التالي : أقل من 60 يطبع راسب من 60 - 69 يطبع مقبول من 70- 79 يطبع جيد من 80 -89 يطبع جيد جداً من 90 -100 يطبع ممتاز مع ملاحظة أنه في حالة درجة الطالب في الاختبار الأول أو الثاني أقل من 5 درجات يعتبر راسب وأن لا تقل درجة الاختبار النهائي عن 20 درجة يعتبر أيضاً راسب .

في الكود المنشور في منشور حزمة firebase_admob يوجد السطر البرمجي التالي: const String testDevice = 'YOUR_DEVICE_ID'; لما اعمل تشغيل للكود او المثال المنشور في الاضافة احصل على السطر البرمجي التالي: Use RequestConfiguration.Builder().setTestDeviceIds(Arrays.asList("****************") to get test ads on this device. طبعا هو يعطيني رقم جهازي بدل النجوم وفي حالة قمت بوضعه في السطر المكتوب بـ testDevice بين الاقواس كود الاعلانات شغال لدي 100%100 ولكن لو لم اضعه احصل على الخطاء البرمجي التالي: I/Ads (29451): Use RequestConfiguration.Builder().setTestDeviceIds(Arrays.asList("*************") to get test ads on this device. W/flutter (29451): onAdFailedToLoad: 3 I/Ads (29451): Ad failed to load : 3 I/flutter (29451): BannerAd event MobileAdEvent.failedToLoad وهذا الكود البرمجي كامل: // Copyright 2017 The Chromium Authors. All rights reserved. // Use of this source code is governed by a BSD-style license that can be // found in the LICENSE file. // ignore_for_file: public_member_api_docs import 'dart:io'; import 'package:flutter/material.dart'; import 'package:firebase_core/firebase_core.dart'; import 'package:firebase_admob/firebase_admob.dart'; // You can also test with your own ad unit IDs by registering your device as a // test device. Check the logs for your device's ID value. const String testDevice = 'YOUR_DEVICE_ID'; Future<void> main() async { WidgetsFlutterBinding.ensureInitialized(); await Firebase.initializeApp(); runApp(MyApp()); } class MyApp extends StatefulWidget { @override _MyAppState createState() => _MyAppState(); } class _MyAppState extends State<MyApp> { static const MobileAdTargetingInfo targetingInfo = MobileAdTargetingInfo( testDevices: testDevice != null ? <String>[testDevice] : null, keywords: <String>['foo', 'bar'], contentUrl: 'http://foo.com/bar.html', childDirected: true, nonPersonalizedAds: true, ); BannerAd _bannerAd; NativeAd _nativeAd; InterstitialAd _interstitialAd; int _coins = 0; BannerAd createBannerAd() { return BannerAd( adUnitId: BannerAd.testAdUnitId, size: AdSize.banner, targetingInfo: targetingInfo, listener: (MobileAdEvent event) { print("BannerAd event $event"); }, ); } InterstitialAd createInterstitialAd() { return InterstitialAd( adUnitId: InterstitialAd.testAdUnitId, targetingInfo: targetingInfo, listener: (MobileAdEvent event) { print("InterstitialAd event $event"); }, ); } NativeAd createNativeAd() { return NativeAd( adUnitId: NativeAd.testAdUnitId, factoryId: 'adFactoryExample', targetingInfo: targetingInfo, listener: (MobileAdEvent event) { print("$NativeAd event $event"); }, ); } @override void initState() { super.initState(); FirebaseAdMob.instance.initialize(appId: FirebaseAdMob.testAppId); _bannerAd = createBannerAd()..load(); RewardedVideoAd.instance.listener = (RewardedVideoAdEvent event, {String rewardType, int rewardAmount}) { print("RewardedVideoAd event $event"); if (event == RewardedVideoAdEvent.rewarded) { setState(() { _coins += rewardAmount; }); } }; } @override void dispose() { _bannerAd?.dispose(); _nativeAd?.dispose(); _interstitialAd?.dispose(); super.dispose(); } @override Widget build(BuildContext context) { return MaterialApp( home: Scaffold( appBar: AppBar( title: const Text('AdMob Plugin example app'), ), body: SingleChildScrollView( child: Center( child: Column( crossAxisAlignment: CrossAxisAlignment.center, mainAxisSize: MainAxisSize.min, children: <Widget>[ RaisedButton( child: const Text('SHOW BANNER'), onPressed: () { _bannerAd ??= createBannerAd(); _bannerAd ..load() ..show(); }), RaisedButton( child: const Text('SHOW BANNER WITH OFFSET'), onPressed: () { _bannerAd ??= createBannerAd(); _bannerAd ..load() ..show(horizontalCenterOffset: -50, anchorOffset: 100); }), RaisedButton( child: const Text('REMOVE BANNER'), onPressed: () { _bannerAd?.dispose(); _bannerAd = null; }), RaisedButton( child: const Text('LOAD INTERSTITIAL'), onPressed: () { _interstitialAd?.dispose(); _interstitialAd = createInterstitialAd()..load(); }, ), RaisedButton( child: const Text('SHOW INTERSTITIAL'), onPressed: () { _interstitialAd?.show(); }, ), RaisedButton( child: const Text('SHOW NATIVE'), onPressed: () { _nativeAd ??= createNativeAd(); _nativeAd ..load() ..show( anchorType: Platform.isAndroid ? AnchorType.bottom : AnchorType.top, ); }, ), RaisedButton( child: const Text('REMOVE NATIVE'), onPressed: () { _nativeAd?.dispose(); _nativeAd = null; }, ), RaisedButton( child: const Text('LOAD REWARDED VIDEO'), onPressed: () { RewardedVideoAd.instance.load( adUnitId: RewardedVideoAd.testAdUnitId, targetingInfo: targetingInfo); }, ), RaisedButton( child: const Text('SHOW REWARDED VIDEO'), onPressed: () { RewardedVideoAd.instance.show(); }, ), Text("You have $_coins coins."), ].map((Widget button) { return Padding( padding: const EdgeInsets.symmetric(vertical: 16.0), child: button, ); }).toList(), ), ), ), ), ); } } كيف ممكن حل هذا المشكلة لو تكرمتو؟ مع العلم اني اختبر المشروع ب جهازي الحقيقي وليس محاكي الاندرويد

ممكن ترفق ملفات المشروع كاملاً؟ وتأكد من <meta-data android:name="com.google.android.gms.ads.APPLICATION_ID" android:value="[ADMOB_APP_ID]"/> داخل ملف AndroidManifest.xml بحيث أنه [ADMOB_APP_ID] هو معرف التطبيق على أدموب. لتجريب المشروع والتأكد من أنك قمت بالخطوات كاملاً يرجى إرفاق ملفات المشروع للمساعدة في حل المشكلة.

كيف يُمكن إضافة ملف لدوال مساعدة في laravel و إستخدام هذه الدول في أي مكان أريد سواء في المتحكمات او ملفات العرض او في كلاسات أخرى.

يمكنك في المسار التالي maiproject\app صنع مجلد جديد وليكن باسم Helpers ثم في داخل المجلد هذا نضع ملف اسمه helpers.php. ومن ثم فليكن الملف بداخله هكذا <?php if (! function_exists('create_option')) { function create_option($table = '',$value = '',$show = '',$selected = '', $where = null) { if($where != null){ $results = DB::table($table)->where($where)->orderBy('id','DESC')->get(); }else{ $results = DB::table($table)->orderBy('id','DESC')->get(); } $option = ''; foreach ($results as $data) { if($data->$value == $selected){ $option .= '<option value="' . $data->$value . '" selected>' . (isset(unserialize($data->$show)[get_option('language')]) ? unserialize($data->$show)[get_option('language')] : '') . '</option>'; }else{ $option .= '<option value="' . $data->$value . '">' . (isset(unserialize($data->$show)[get_option('language')]) ? unserialize($data->$show)[get_option('language')] : '') . '</option>'; } } echo $option; } } if ( ! function_exists('get_row')){ function get_row($table, $where = null , $order = 'ASC') { if($where != null){ $row = DB::table($table)->where($where)->orderBy('id', $order)->first(); }else{ $row = DB::table($table)->orderBy('id', $order)->first(); } return $row; } } if ( ! function_exists('get_table')){ function get_table($table, $where = null , $order = 'DESC') { if($where != null){ $results = DB::table($table)->where($where)->orderBy('id', $order)->get(); }else{ $results = DB::table($table)->orderBy('id', $order)->get(); } return $results; } } if ( ! function_exists('get_logo')){ function get_logo() { $logo = get_option("logo"); if($logo == ''){ return asset("public/uploads/images/default-logo.png"); } return asset("public/uploads/images/$logo"); } } if ( ! function_exists('get_icon')){ function get_icon($name) { return asset("public/images/icons/".$name); } } if ( ! function_exists('month_number_to_name')){ function month_number_to_name($month_number) { $month_name = date("F", mktime(0, 0, 0, $month_number, 10)); return $month_name; } } if ( ! function_exists('sql_escape')){ function sql_escape($unsafe_str) { if (get_magic_quotes_gpc()) { $unsafe_str = stripslashes($unsafe_str); } return $escaped_str = str_replace("'", "", $unsafe_str); } } if ( ! function_exists('get_option')){ function get_option($name, $optional = '') { $setting = DB::table('settings')->where('meta_key', $name)->get(); if ( ! $setting->isEmpty() ) { return $setting[0]->meta_value; } return $optional; } } if ( ! function_exists('timezone_list')) { function timezone_list() { $zones_array = array(); $timestamp = time(); foreach(timezone_identifiers_list() as $key => $zone) { date_default_timezone_set($zone); $zones_array[$key]['ZONE'] = $zone; $zones_array[$key]['GMT'] = 'UTC/GMT ' . date('P', $timestamp); } return $zones_array; } } if ( ! function_exists('create_timezone_option')) { function create_timezone_option($old="") { $option = ""; $timestamp = time(); foreach(timezone_identifiers_list() as $key => $zone) { date_default_timezone_set($zone); $selected = $old == $zone ? "selected" : ""; $option .= '<option value="'. $zone .'"'.$selected.'>'. 'GMT ' . date('P', $timestamp) .' '.$zone.'</option>'; } echo $option; } } if ( ! function_exists( 'get_country_list' )) { function get_country_list($selected = '') { if( $selected == "" ){ echo file_get_contents( app_path().'/Helpers/country.txt' ); }else{ $pattern = '<option value="'.$selected.'">'; $replace = '<option value="'.$selected.'" selected="selected">'; $country_list = file_get_contents( app_path().'/Helpers/country.txt' ); $country_list = str_replace($pattern, $replace, $country_list); echo $country_list; } } } if( !function_exists('load_language') ){ function load_language($active=''){ $path = resource_path() . "/_lang"; $files = scandir($path); $options = ""; foreach($files as $file){ $name = pathinfo($file, PATHINFO_FILENAME); if($name == "." || $name == "" || $name == "language"){ continue; } $selected = ""; if($active == $name){ $selected = "selected"; }else{ $selected = ""; } $options .= "<option value='$name' $selected>".ucwords($name)."</option>"; } echo $options; } } if( !function_exists('get_language_list') ){ function get_language_list(){ $path = resource_path() . "/_lang"; $files = scandir($path); $array = array(); $default = get_option('language'); $array[] = $default; foreach($files as $file){ $name = pathinfo($file, PATHINFO_FILENAME); if($name == "." || $name == "" || $name == "language" || $name == $default){ continue; } $array[] = $name; } return $array; } } if ( ! function_exists('counter')){ function counter($table, $where = null) { if($where != null){ $results = DB::table($table)->where($where)->count(); }else{ $results = DB::table($table)->count(); } return $results; } } if ( ! function_exists('count_inbox')){ function count_inbox() { $inbox = App\ContactMessage::where('status', 0)->count(); return $inbox; } } if (! function_exists('is_site_installed')) { function is_site_installed() { return is_file(public_path('install.txt')); } } ملاحظة هذا الكود مجرد مثال. ثم في ملف composer.json نضع بداخل السطر التالي "autoload": { "psr-4": { "App\\": "app/" }, "classmap": [ "database/seeds", "database/factories" ] }, فيكون "autoload": { "psr-4": { "App\\": "app/" }, "files": [ "app/Helpers/helpers.php" ], "classmap": [ "database/seeds", "database/factories" ] }, ثم نقوم بتنفيذ هذا الامر داخل terminal composer dump-autoload وهكذا نكون قد أضفنا هذا الملف للمشروع بكل سهولة.

لماذا احصل على هذا التحذير من react ./src/components/Posts.js Line 23: React Hook useEffect has a missing dependency: 'getPosts'. Either include it or remove the dependency array react-hooks/exhaustive-deps وهذا هو الكود import React from 'react'; import axios from 'axios'; export default function Users() { const getPosts = () => { axios .get('http://localhost:4000/posts') .then((res) => { console.log(res); }) .catch((err) => { console.log(err); }); }; useEffect(() => { getPosts(); }, []); return <div>posts</div>; }

مشكور يغالي ماقصرت بس ابي الكود في elseif ويكون مربوط بالصفحه الاولى الي عندي وذا كود الصفحه الاولى <!DOCTYPE html> <html lang="en"> <head> <title>Bootstrap Example</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css"> </head> <body> <div class="container"> <h2>درجات الطالب</h2> <form action="AAA.php"> <div class="form-group"> <label for="num">درجة اختبار شهر الأول:</label> <input type="text" class="form-control" id="email" name="num"> </div> <div class="form-group"> <label for="pwd">درجة اختبار شهر الثاني:</label> <input type="text" class="form-control" id="num" name="num"> </div> <div class="form-group form-check"> <label class="form-check-label"> </label> <button type="submit" class="btn btn-primary">انهاء</button> <form method="get" action="AAA.php"> </div> </body> </html> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>

أستخدم لارافيل و أحاول رفع ملف و حفظه: public function test(Request $request) { $fileInForm = 'file'; if ($request->hasFile($fileInForm)) { $file = $request->file($fileInForm); if ($file->isValid()) { $hashedName = hash_file('md5', $file->path()); $timestamp = microtime(); $newFilename = $hashedName . $timestamp . '.' . $file->getClientOriginalExtension(); Storage::disk('local')->put($newFilename, $file); } } } لكن المُشكلة أن الملف يتم حفظه في مُجلد باسم مُختلف في كل مرة و إسم المُجلد يكون نفس الإسم الذي أضعه. هل يُمكن حفظ الملف في مجلد واحد و ليس كل ملف في مجلد لوحده.

طالما ذكرتِ "لأصبح شخص مختص بتصميم الواجهات" فهنا علينا تعلم جميع التقنيات و المهارات اللازمة لعمل التصميم، بشكل عام يمكننا التفريق بين: التصميم بنفسه: أي عمل الواجهة وما تحويه من عناصر و تحديد الألوان و أشكال الأزرار .. (لا تحتاج لبرمجة) برمجة الواجهات والتي تكون في مواقع الويب أو تطبيقات الهاتف المحمول. (تحتاج لتعلم التقنية الموافقة لبيئة العمل المستهدفة) إن استخدام البرامج الجاهزة التي تقدم Blocks جاهزة ليس طريقة عملية بشكل كبير (أحيانا تكون صعبة التعديل)، بل يجب أيضا تعلم أساسيات مناسبة لطبيعة الملفات التي تنتجها هذه البرامج، كما قُلت في حال كان خرج البرنامج ملفات CSS واحتاجت لتعديل، فيجب عندها معرفة CSS. يوجد برامج خاصة بالتصميم مثل adobeXD وغيره تعطي دعم كبير للمصمم وتجعله يتحكم بالتفاصيل. أما في حال كنت تريدين العمل بطريقة أسهل في البرمجة (تصميم المواقع) يمكن تعلم إضافة لأساسيات CSS إطار عمل Bootstrap والذي يحوي تنسيقات مبرمجة مسبقا تسهل و توحد طريقة بناء الواجهات.

إذا كنت تقصدين تصميم الواجهات فقط بدون تكويد التصميم و تحويله التصميم إلى صفحات ويب أي وظيفة ال ( ui/ux ) إذا لا تحتاجين إلى تعلم ال css أما إذا كنت تقصدين مطور الواجهات الأمامية وهو الشخص الذي يقوم بتحويل التصميم إلى صفحات ويب بالطبع يجب تعلم ال css ولا يكفي إستخدام خدمات تقدم تصاميم جاهزة إذا كنت تريدين التخصص في تطوير الواجهات الأمامية ولتعلم اتطوير الواجهات الأمامية يجب تعلم المهارات الأساسية: الأساسيات: HTML ،CSS ،JavaScript HTML و CSS هما لغات ترميزية يستخدمها المصممون لإنشاء أجزاء من صفحة الويب وأنماطهم البصرية. إنها الأساسيات وراء كل موقع ويب – تستخدم متصفحات الويب كود HTML و CSS لتحديد ما يراه المستخدمون عند تصفحهم لموقع الويب. أخيراً، لدينا JavaScript – لغة برمجة تستخدم للتحكم ديناميكياً في المحتوى على صفحة الويب. يتيح لك JavaScript جعل المواقع تفاعلية – يتم تشغيل جميع تطبيقات الويب والخرائط التفاعلية وصور التمرير والفيديو الديناميكياً بواسطة JavaScript. جافا سكريبت هي لغة برمجة ضخمة مع إمكانيات شبه محدودة، ولكن يجب على المطورين المبتدئين التركيز على تعلم الأساسيات – أشياء مثل بناء الكود، وكيفية عمل المتغيرات، والبيانات الشرطية، والوظائف.

على حسب المشروع، قد يكون المشروع عبارة عن تحويل ملف فوتوشوب إلى HTML & CSS، حينها يتم تسليم ملفات HTML و CSS والصور والخطوط المستخدمه في الموقع، أو قد يكون المشروع عبارة عن عمل لوحة تحكم لموقع موجود مسبقًا، حينها يعطيك العميل ملفات HTML و CSS وتصميم لوحة التحكم التي يريدها، فتقوم بعمل لوحة التحكم حسب المطلوب، وترسل ملفات لوحة التحكم بكل محتوياتها. وربما يريد العميل إصلاح مشكلات تواجهة في موقعه (مثلاً، القائمة الجانبية لا تعمل على الهواتف بسبب مشكلة CSS)، فيعطيك العميل ملفات الصفحة التي بها المشكلة لتقوم بإصلاحها وتعيد إرسال هذه الملفات إليه. وليس دائماً يعرف العميل كيف يتعامل مع ملفات المشروع النهائية، فعليك دائماً أن تتفق معه على صيغة الملفات النهائية، وما إن كان سيتطيع التعامل معها بنفسه أم أن لديه شخص آخر ذو خبرة سيقوم بتركيب هذه الملفات في الموقع (مدير خوادم على سبيل المثال).

لا توجد طريقة لتمرير props من مكون فرعي إلى مكون رئيسي. ومع ذلك ، يمكننا دائمًا نقل functions من العنصر الأصل إلى المكون الفرعي. يمكن للمكون الفرعي بعد ذلك الاستفادة من هذه functions. يمكن function بعد ذلك تحديث state في المكون الرئيسي . وهذا مثال حول ذلك import React from 'react'; function Increment({ count, onClickIncrement }) { return ( <div> {count} <button onClick={onClickIncrement}>increment</button> </div> ); } export default function Main() { const [count, setCount] = useState(1); const onClickIncrement = () => { setCount(count++); }; return ( <div> <Increment count={count} onClickIncrement={onClickIncrement}></Increment> </div> ); }

هل يمكنك إخبارنا لماذا تريد تمرير props إلى اﻷب؟ إذا كنت تريد تغيير شيء في اﻷب مثلاً تريد تغيير state معينة فسأشرح لك كيفية عمل ذلك بمثال، ليكن الكود التالي: const Parent = () => { const [tasks,setTasks] = useState([]); return ( <ul> {tasks.map(v => ( <Child task={v}/> ))} </ul> ); } const Child = (props) => { const {task} = props; return ( <div> <button type="button">Delete</button> {task.name} </div> ); } في الكود السابق نريد عند الضغط على الزر داخل Child component نريد حذف task ضمن اﻷب فكيف نفعل ذلك ونحن لا نستطيع تمرير props إلى اﻷب؟!!! ببساطة يمرر اﻷب تابع إلى اﻻبن بالشكل التالي: const Parent = () => { const [tasks,setTasks] = useState([]); const onDelete = (task) => { const tasksAfterDelete = ... // implement delete functionality however you like setTasks(tasksAfterDelete); } return ( <ul> {tasks.map(v => ( <Child task={v} onDelete={onDelete}/> ))} </ul> ); } const Child = (props) => { const {task,onDelete} = props; return ( <div> <button type="button" onClick={() => onDelete(task)}>Delete</button> {task.name} </div> ); } لاحظ أننا مررنا تابع onDelete من اﻷب إلى اﻻبن واستدعيناه في اﻻبن، هذا الكود هو pattern شائع جداً في React حيث يستقبل اﻻب تابعاً ينفذه عند وقوع حدثٍ ما واﻷب هو من يقرر ماذا سيحصل عند وقوع هذا الحدث. اﻻبن لا يهمه ماذا يفعل اﻷب عند وقوع هذا الحدث، قد يقوم اﻷب مثلاً بطلب Ajax ثم يحدّث state بالـresponse لهذا الطلب مثلاً.

هل يمكنك وضع صورة توضيحية للمشكلة من فضلك؟

يمكنك تحسين جودة الصوت الصوت في أغلب الملفات الصوتية من خلال إستخدام برامج مثل audacity و adobe audition فهذه البرامج مختصة في تعديل وتنقية وإصلاح ملفات الصوت بعشرات الطرق. لاحظ أن هذه البرامج تحتاج خبرة ومعرفة مسبقة لتستطيع التعامل معها، وسيكون من الأسهل والأسرع تعيين مختص في إزالة التشويش وتعديل ملفات الصوت من على أي منصة للعمل الحر مثل مستقل. لاحظ أيضًا أن هناك بعض الملفات لا يمكن تحسين جودة الصوت الخاص بها بدرجة عالية نظرًا لبنية الملف الداخلية (الأمر يختلف من صيغة لأخرى). يمكن أيضًا أضافة تأثيرات معينة على الصوت مثل صدى صوت بسيط أو تفخيم الصوت وغيرها من محسنات الصوت.

ماهو نوع الملفات؟ أرجو ذكر أي تفاصيل مفيدة.

يا مرحب الاختلافات بين Adobe Animate و After Effects؟ Adobe Animate يتم استخدامة لتصميم الرسومات المتجهة (vector graphics) و الرسوم المتحركة ( Animation ) و للبرامج التلفزيونية والفيديوهات ومواقع الويب وتطبيقات الويب أو الإنترنت و ألعاب الفيديو. Adobe After Effects هو تطبيق مؤثرات بصرية رقمية ، ورسومات متحركة ، و تطبيق تركيب و يستخدم في عملية ما بعد الإنتاج لصناعة الأفلام وألعاب الفيديو والإنتاج التلفزيوني. و يمكن استخدام After Effects في المفاتيح أو الفريمات و التتبع والتركيب وله إستخدمات أخري فيمعل مثلاً كمحرر صوت و محول وسائط.