ساخت اولین برنامه با الکترون (Hello World)
در بخش مربوط به نصب و راه اندازه یک پروژه با الکترون ما یک فایل package.json ایجاد کردیم. حال در این بخش اولین برنامه دسکتاب خود را با استفاده از کتابخانه الکترون ایجاد خواهیم کرد.
یک فایل با نام main.js ایجاد کرده و محتوی زیر را در آن بنویسید:
const {app, BrowserWindow} = require('electron')
const url = require('url')
const path = require('path')
let win
function createWindow() {
win = new BrowserWindow({width: 800, height: 600})
win.loadURL(url.format ({
pathname: path.join(__dirname, 'index.html'),
protocol: 'file:',
slashes: true
}))
}
app.on('ready', createWindow)
یک فایل دیگر با نام index.html ایجاد کرده و محتوای زیر را در آن بنویسید:
<!DOCTYPE html>
<html>
<head>
<meta charset = "UTF-8">
<title>Hello World!</title>
</head>
<body>
<h1>Hello World!</h1>
We are using node <script>document.write(process.versions.node)</script>,
Chrome <script>document.write(process.versions.chrome)</script>,
and Electron <script>document.write(process.versions.electron)</script>.
</body>
</html>
حال با استفاده از دستور زیر برنامه را اجرا کنید:
$ electron ./main.js
بعد از اجرای دستور فوق برنامه شما به صورت زیر اجرا خواهد شد:
چگونه کار می کند؟
ما دو فایل main.js و index.html را ایجاد کردیم. در فایل main.js از دو ماژول app و BrowserWindow استفاده شده است. ماژول app به منظور کنترل چرخه حیات برنامه استفاده می شود در حالی ماژول BrowserWindow برای ایجاد و مدیریت پنجره های برنامه استفاده می شود.
در فایل main.js ما یک تابع با نام createWindow تعریف کرده ایم که یک شیء از نوع BrowserWindow ایجاد و در متغیر win قرار می دهد. سپس آدرس فایل HTML را برای این پنجره مشخص کرده ایم تا هنگام اجرا شدن برنامه نمایش داده شود.
نوشته ساخت اولین برنامه با الکترون (Hello World) – آموزش Electron اولین بار در سورس سرا - آموزش برنامه نویسی. پدیدار شد.
