Wind, weather and sea forecast for the Adriatic coast — a lightweight, mobile-friendly, installable (PWA) web app aimed at sailors and boaters.
Visit https://lite.fliper.si for a live demo.
- Wind forecast — 72-hour ALADIN wind & gust maps for the whole Adriatic and its North / Middle / South sub-areas, with a play/stop animation.
- Weather forecast — 7-day DHMZ forecast for 170+ towns along the Croatian coast, grouped by county, with an hourly-detail view.
- Sea forecast — marine forecast (sea state, Douglas scale, wave animation) and current sea temperatures.
- Adriatic winds — a reference guide to the local winds (Bura, Jugo, Maestral, Tramontana, Lebić, …).
- PWA — installable on Android/desktop and iOS (Add to Home Screen), with an offline fallback page.
- Dark mode — follows the device setting by default, with a navbar toggle that remembers your choice (stored in a cookie, applied server-side so there's no flash on load).
Forecast data comes from the Croatian Meteorological Service (meteo.hr / DHMZ) and prognoza.hr:
- Weather & sea text is scraped server-side from meteo.hr with cURL and
parsed with PHP's built-in
DOMDocument/DOMXPath(no third-party library). Responses are cached on the filesystem for ~30 minutes (_dhmz_*.html), so there is no cron job to maintain — the cache refreshes on the first request after it expires. - Wind and wave images are loaded directly in the browser from prognoza.hr.
There is no database and no PHP framework — just a handful of PHP pages sharing
header.php / nav.php / footer.php.
- PHP 8.x (developed/tested on 8.4) with the cURL and DOM extensions.
- Apache with
mod_rewrite;mod_headersandmod_deflatestrongly recommended (security headers, caching and gzip live in.htaccess). - Node.js (build-time only) to produce the minified asset bundles.
# 1. Install the build tooling and front-end libraries.
npm install
# 2. Build the minified CSS/JS bundles into dist/.
npm run build
# 3. Serve the project root with Apache/PHP (e.g. Laragon) and open the site.The pages reference dist/app.min.css and dist/app.min.js, so npm run build
must be run before the site will render correctly, and again after any change
to assets/style.css or assets/scripts.js.
build.js bundles the vendor libraries with the app's own source and writes the
result to dist/. The built bundles are committed to the repo so production
needs no build step (no Node required on the server):
dist/app.min.css— Bootstrap 3.4.1 CSS +assets/style.css(minified).dist/app.min.js— jQuery 3.7.1 + Bootstrap JS +assets/scripts.js(minified).dist/fonts/— Bootstrap glyphicon fonts.
HTML references the bundles with ?v=<filemtime> for cache-busting, which is why
.htaccess can cache /dist immutably for a year.
index.php Wind forecast (home)
weather.php 7-day weather forecast
sea.php Sea forecast + sea temperature
winds.php Adriatic winds reference
404.php Custom not-found page
header.php <head>: SEO/meta, Open Graph, JSON-LD, canonical, asset links
nav.php Top navigation
footer.php Footer + PWA install UI + script include
assets/ Source CSS/JS (edit here, then rebuild)
dist/ Built, minified bundles (generated by build.js; committed)
images/ Icons, favicons, static images, PWA manifest
sw.js Service worker (network-first pages, offline fallback)
offline.html Offline fallback page
robots.txt Crawl rules + sitemap reference
sitemap.xml XML sitemap
.htaccess Routing, HTTPS redirect, security headers, gzip, caching
build.js Asset build script
- Run
npm run buildand commit the updateddist/before deploying (prod has no Node and serves the committed bundles directly). - Serve over HTTPS with a valid certificate —
.htaccessforces HTTP→HTTPS and sends HSTS. - Update the domain in
robots.txtandsitemap.xmlif it isn'tlite.fliper.si(canonical/Open Graph URLs auto-detect the host). - After going live, confirm gzip is active:
curl -sI -H "Accept-Encoding: gzip" https://YOUR-DOMAIN/dist/app.min.js(expectcontent-encoding: gzip).
Lite Sails was created and is maintained by Blaz Orazem.
Please write an email to info@numencode.com about all the things concerning this project.
Follow @blazorazem on Twitter.
Lite Sails is open-sourced software licensed under the MIT license.
