شاهد هذه السلسلة اخي الكريم بها شرح مفصل
لسلام عليكم اخوتي الكرام وتحية خاصة #لتجمع المبرمجين والمطورين العرب
صار بامكانك اخي الكريم بيع تطبيقاتك بدون وساطة على مجموعة #سوق المبرمجين
🌷🌷🌷🌷🌷🌷🌷🌷
يمكنك اخي الكريم متابعة سلسلة بناء تطبيقات #google chrome
-----------
قبل تحميل إلكترون تحتاج أخي الكريم إلى تحميل NODEJS و NPM INIT
في حالة كان نظام تشغيلك ويندوز فإنك تقوم بإنشاء ملف في C مثلا C:\Electron وتقوم بالضغط على shift+الزر الايمن للفأرة سيظهر لك خيار لإختيار صندوق الكوموند بالاسود تكتب فيه الأمر التالي لبناء ملف json تضع فيه جل المعلومات
npm init
بعدها تقوم بكتابة بعض الخصائص كالعنوان ونسخة التطبيق وغيرها
ثم امام خيار index.js تكتب main.js ثم تضغط على yes لبناء الملف الأن نقوم ببناء ملف بإسم المشروع مثلا myproject ثم نضغط بنفس الطريقة على shift+الزر الايمن للفارة ونختار فتح صندوق الكوموند بالاسود ونكتب فيه الامر التالي لتنزيل Electron
npm install electron --save-dev --verbose
الان ننتظر حتى يتم التحميل ونقوم ببناء ملف main.js ونقوم بكتابة الكود التالي فيه
const electron = require('electron');
const app = electron.app;
const path = require('path');
const url = require('url');
const BrowserWindow = electron.BrowserWindow;
var mainWindow;
app.on('ready',function(){
mainWindow = new BrowserWindow({width: 1024, height: 768,backgroundColor: '#2e2c29'});
//mainWindow.loadURL('https://google.com');
mainWindow.loadURL(url.format({
pathname: path.join(__dirname, 'index.html'),
protocol: 'file:',
slashes: true
}));
});
ثم بعد ذلك نتجه الى ملف json ونقوم بتعديل السطر التالي حتى يعمل لنا التطبيق
"scripts": {
"start": "electron ."
},
ثم لتشغيل التطبيق تكتب الامر التالي في الدوس تبع ملف المشروع : npm start
إذا عمل معك فكل شيء تمام الان نتوجه الى تحزيم المشروع بتحميلها عبر الكود التاالي
npm install -g electron-packager
حتى يتسنى للمستخدمين تشغيله في حالة كنت تريد تحزيم المشروع افتراضيا فانه يتخد من جهازك معطياته للتحزيم
electron-packager .
ولتشفير هذه التحزيمة نختار التالي
electron-packager . --asar
ولتحزيم الجميع لكي يعمل تطبيقك على جميع انظمة التشغيل كالماك والويندوز واللنكس تكتب الامر التالي
electron-packager . --all
الان تبقى لنا مشكلة وهي عدم استجابة المشروع لملفات الجيكويري وهذا يشكل مشكلة لنا ستحتاج لتعريف الجيكويري داخل ملف الاندكس
<script>window.$ = window.jquery = require('./jquery.js');</script>
الان الكل تماما لكي نكمل تطبيقنا الكترون ونريد مثلا بناء تطبيق متقدم ومتصل بقواعد البينات سنحتاج الى ربطه بقواعد البينات نقوم بتحميل الباكتج الخاص بربطه بقواعد البينات
nmp install mysql
ثم نقوم بكتابة الكود التالي
<html>
<head>
<script>window.$ = window.jQuery = require('jquery.js');</script>
</head>
<body>
<h1>Electron MySQL Example</h1>
<div id="resultDiv"></div>
<script>
var mysql = require('mysql');
var connection = mysql.createConnection({
host : 'localhost',
user : 'root',
password : 'aqwzsxedc',
database : 'reg'
});
connection.connect();
var sql = 'SELECT `id`,`name` FROM `users`';
connection.query(sql, function (error, results, fields) {
if (error) console.log(error.code);
else {
console.log(results);
$('#resultDiv').text(results[6].name);
}
});
connection.end();
</script>
</body>
</html>
للمزيد من المعلومات تابع الشرح التالي #npmMysql
🌷🌷🌷🌷🌷🌷🌷🌷
إنتهى بفضل اللّه
إنتهى بفضل اللّه
0 تعليقات