1

Electron Javascript – Predložak aplikacije Vijesti

Priprema

  • Imaj npm
  • mkdir E:\Dev\vijesti.js
  • cd E:\Dev\vijesti.js
  • npm install electron
  •      (ili “npm install --global electron” ako želiš jedinstveni “node_modules” negdje)
  • npm init


vijesti.js

const { app, BrowserWindow } = require('electron');

const createWindow = () => {
  const win = new BrowserWindow({
    width:           800,
    height:          600,
    backgroundColor: "#0",
    autoHideMenuBar: true,     /* sakrij manu-bar izbornik, logičko, zar ne */
    transparent:     false,    /* prozirnost na Jok-mode */
    frame:           false     /* sakrij OS title-bar i okvir */
  });

  win.loadFile('index.html');
};

app.whenReady().then(() => {
  createWindow();

  app.on('activate', () => {
    if (BrowserWindow.getAllWindows().length === 0) {
      createWindow();
    }
  });
});

app.on('window-all-closed', () => {
  if (process.platform !== 'darwin') {
    app.quit();
  }
});


index.html

<!doctype html>
<html lang="hr">
<head>
  <meta http-equiv="refresh" content="5">
  <meta charset="utf-8">
  <meta http-equiv="Pragma" content="no-cache">
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
  <meta name="description" content="šđčćž ŠĐČĆŽ">
  <title>šđčćž ŠĐČĆŽ</title>
  <link rel="icon" type="image/png" href="favicon.png">
  <link rel="stylesheet" href="index.css">
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0/dist/css/bootstrap.min.css">
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@latest/font/bootstrap-icons.css">
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootswatch@5.0.0/dist/darkly/bootstrap.min.css">
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fontawesome/fontawesome-free@latest/css/fontawesome.min.css">
  <link rel="stylesheet" href="https://site-assets.fontawesome.com/releases/v6.1.1/css/all.css">
</head>

<body class="bg-dark text-light fejdin">
  <div class="jumbotron">
  <div class="container-fluid">
    <H1>šđčćž ŠĐČĆŽ</H1>
    šđčćž ŠĐČĆŽ
  </div>
  </div> 
  <script src="https://code.jquery.com/jquery-latest.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/popper.js@1.12.9/dist/umd/popper.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>


index.css

@keyframes fadeIn 
{
    0% { opacity: 0; }
  100% { opacity: 1; }
}

.fejdin { animation: fadeIn 1s; }


package.json

{
  "name": "vijesti",
  "version": "22.0212.10",
  "description": "vijesti.js SWID-2023021210362601-SW68GT5",
  "main": "vijesti.js",
  "author": "SomwareHR",
  "license": "(CC BY-NC-SA 4.0)",
  "scripts": {
    "start": "electron ."
  },
  "devDependencies": {
    "electron": "^19.1.9"
  }
}


xnode xnpm xelectron xjs xjavascript xtemplate xtplt xpredložak predložak xkostur kostur xinit xsample sample xprvikoraci xfirststeps xhide xmenu xtitle xbar