Платформа ElectronJS

Основные технологии

  • HTML, CSS, JavaScript
  • Chromium, Node.js

Создание приложения

  • Инициализировать приложение.
  • Установить пакет exectron.
  • В секцию scripts, ключ start, прописать "electron ." для запуска приложения
  • Использовать electron-reload. 
    				    
npm install electron-reload
require('electron-reload')(__dirname);
  • Использовать openDevTools

Процессы

  • Основной (main) процесс (всегда один).
  • Процесс отрисовки (на каждое окно свой).

Класс BrowserWindow

  • Создает и управляет окном.
  • Свойства (например, backgroundColor).
  • События (например, ready-to-show).
  • Функции (например, getAllWindows()).

HTML

  • Теги: иерархическая структура (открытый, закрытый тек, пустой тег).
  • Начальный тег: html
  • Теги: head, body.
  • Содержимое head: meta, link, scripts.
  • Примеры тегов: h1, h2, h3, h4, ul, li и др.
  • Тег ссылки: a
  • Построение таблиц: table, thead, tbody, tfoot, tr, td.
  • Списки: ul, li.
  • Формы: input.

CSS

  • Таблица стилей
  • Подключение: inline, в документе (тег style) и файлом (тег link).

Пример

				    
#tags_form_space ul.tagit {
    border-radius: 0;
    border: none;
    background: black;
    color: white;
    font-size: 18px;
    padding-left: 12px;
}

Селекторы

  • * - все элементы (универсальный).
  • .class - выбранный класс (свойство class).
  • #id - идентификатор (свойство id).
  • input - по элементу.
  • a[href^=https] - по атрибуту.

Комбинаторы

  • , (запятая) - перечисление (И).
  • ' ' (пробел) - все дочерние.
  • > - первый уровень вложенности.
  • + - следующий соседний.
  • ~ - все соседние в рамках одного родителя

Объект document

  • Представляет собой загруженный DOM документ
  • Класс Element
  • Класс Node

Свойства документа

  • lastModified
  • location
  • cookie

Доступ к элементам (Element)

  • getElementById
  • getElementsByClass
  • getElementsByName
  • getElementsByTagName

Свойства элемента

  • innerHtml
  • className
  • id
  • scrollTop