Budowanie aplikacji desktopowych w JavaScript z ElectronJS

Materiał jest nagraniem archiwalnym Stacji IT (warsztatów z różnych technologii w trybie 4- lub 8-godzinnym).

➡️ Czego się nauczysz?

– Zrozumiesz, jak działa Electron i jak zbudować własną aplikację desktopową w Javascript.
– Poznasz strukturę projektu, komunikację między procesami i integrację z Node.js oraz systemem operacyjnym.
– Nauczysz się tworzyć nowoczesny interfejs użytkownika i przygotowywać aplikację do dystrybucji.
– Otrzymasz wiedzę o dobrych praktykach, bezpieczeństwie i optymalizacji aplikacji.

➡️ Dla kogo jest ten materiał?

Warsztat jest przeznaczony dla programistów Javascript/Typescript, którzy chcą wejść w świat aplikacji desktopowych. Przyda się osobom znającym podstawy Node.js i frontendu, chcącym stworzyć własne narzędzia lub rozszerzyć kompetencje w tworzeniu cross-platformowych aplikacji.

➡️ Wymagania wstępne

Znajomość JavaScript (ES6+), podstawy Node.js, HTML/CSS.

➡️ Program

1. Wprowadzenie (1h):
– Czym jest ElectronJS i jak działa pod spodem (Chromium + Node.js).
– Przykłady popularnych aplikacji zbudowanych w Electronie.
– Architektura aplikacji: Main process vs Renderer process.
– IPC – komunikacja między procesami.

2. Struktura projektu i podstawy (1.5h):
– Konfiguracja środowiska, package.json, skrypty.
– Tworzenie okien, ustawienia, preload scripts.
– Obsługa menu, skrótów klawiszowych i tray.

3. Integracja z Node.js i systemem (1.5h):
– Dostęp do systemu plików (fs).
– Obsługa dialogów (otwieranie/zapisywanie plików).
– Moduły Electron: clipboard, shell, notifications.

4. Interfejs użytkownika (1h):
– Łączenie Electrona z frameworkami front-endowymi (React, Vue, Svelte).
– Styling: Tailwind, Material UI.

5. Dystrybucja aplikacji (1h):
– Budowanie aplikacji (electron-builder, electron-packager).
– Tworzenie instalatorów (Windows, macOS, Linux).
– Aktualizacje aplikacji (auto-updater).

6. Zaawansowane funkcje i dobre praktyki (1h):
– Bezpieczeństwo w ElectronJS (contextIsolation, sandbox, preload).
– Zarządzanie pamięcią i wydajnością.
– Najczęstsze błędy początkujących i jak ich unikać.
– Najlepsze źródła do dalszej nauki i społeczności.

Materiał „Budowanie aplikacji desktopowych w JavaScript z ElectronJS” (C) Sages 2025.

➡️ Informacje o prowadzącym:

Mateusz Jabłoński

Frontend developer z zacięciem humanistycznym. Uwielbia nauczać innych, wymieniać się doświadczeniem i wspierać w rozwoju programistycznym. Ma doświadczenie w uczeniu zarówno dzieci, jak i dorosłych. Jako programista pracuje od 2011 roku, skupiając się przede wszystkim na technologiach frontendowych. Prywatnie mąż, ojciec, kolekcjoner książek i gier planszowych.