Převod webu na nativní aplikaci, ať už na mobilu nebo počítači, může být docela užitečný. Problém se záložkami, zejména pro softwarové inženýry, je ten, že často potřebujeme pracovat v různých prohlížečích, takže mít vše v sadě záložek jednoho prohlížeče může být nepříjemné. Také bych tvrdil, že weby s konkrétní oblastí účelu jsou skvělým případem pro převod webu na aplikaci pro počítače. Nedávno jsem našel nativefier, nástroj s otevřeným zdrojovým kódem, který vytváří nativní desktopovou aplikaci zabalením webu do Electronu.
Instalace
NPM můžete použít k instalaci nativefier a node-icns, které použijeme k vytvoření vlastní ikony pro aplikaci:
npm install -g nativefier # App creator npm install -g node-icns # Icon creator
Dokumenty nativefier poskytují metodu pro vytvoření ikony aplikace pro stolní počítače, ale vyžaduje se ImageMagick a iconutils – node-icns vám ušetří trochu bolesti.
Vytvořte ikonu aplikace
Ikonu aplikace je důležité vytvořit ještě před vytvořením samotné aplikace. Můžete vytvořit ikonu aplikace s node-icns a obrázkem dle vlastního výběru:
# Generate icon set required by macOS nicns --in app-icon.png --out app-icon.icns
Použijte vysoce kvalitní čtvercový formát PNG – průhlednost bude zachována a na velikosti souboru nezáleží, protože soubory budou uloženy ve vašem počítači.
Vytvoření aplikace
nativefier poskytuje celou řadu konfiguračních parametrů, které můžete použít k vytvoření aplikace. Pojďme vytvořit aplikaci pomocí mnoha užitečných parametrů:
nativefier \
--name "David Walsh Blog" \
--verbose \
--counter \
--icon app-icons.icns \
--fast-quit \
--inject custom-css.css \
--inject custom-js.js \
--flash # gross
"https://davidwalsh.name"
Bude vygenerován adresář s názvem "{appname}-darwin-x64" a v tomto adresáři bude soubor aplikace, který můžete přetáhnout do svého Applications (nebo jakýkoli ekvivalent vašeho OS) a do doku. Všimněte si, že můžete přidat vlastní uživatelské soubory JavaScript a CSS, abyste mohli skrýt reklamy, upravit barvy a chování a tak dále. --counter argument je obzvláště zajímavá – webová aplikace, jako je Gmail, která aktualizuje své <title> tag jako pseudooznámení spustí po provedení aktualizace červenou tečku s oznámením nad ikonou aplikace.
Webové aplikace jako IRCCloud a weby jako DevDocs jsou perfektními kandidáty na převod na desktopovou aplikaci.
Děkuji Byronu Jonesovi, že mi dal vědět o nativefier!