625d38645c
gates / gates (push) Successful in 5m54s
HEADER. logo.png carries its OWN "felhom.eu" lettering under the mark, so
putting it next to a typed <span class="logo-text"> said the name twice and
squeezed the mark down to 40px to make room. Now:
- the mark alone, bigger: assets/logo_notext.svg at 54px (44px under 600px).
Vector, so it stays crisp. Its two <text> elements are EMPTY, so R-916's
missing-font problem does not apply to this file -- checked, not assumed.
- the name beside it is the brand's OWN lettering, cropped from logo.png to
the new assets/logo-wordmark.png (632x108, tight bbox).
Why an image and not text: the wordmark's face is "M+ 2c"/"Vremena Grotesk"
(R-916). Nothing here has it, and the site deliberately loads NO external
font -- the privacy notice published this morning states exactly that, so
pulling in Google Fonts to match a logo would have made a published claim
false. Using the artwork is also what the Facebook covers already do. The
white/blue split the operator asked for is in the artwork itself.
Accessibility kept: the mark is alt="" aria-hidden (decorative), the wordmark
carries alt="felhom.eu", so the link still has its accessible name.
FOOTER. The legal links were unstyled, so the browser painted them default
blue and PURPLE once visited. They now follow the site's own convention
(.page-kapcsolat .sidebar-card a): --blue-bright, no underline, underline on
hover. :visited is pinned to the same colour deliberately -- a legal link
that changes colour after one read looks like it stopped working. The same
fix applied to .legal a on the two new legal pages, which had --blue instead
of --blue-bright.
18 of 18 pages carry the new lockup; the English pages keep their /en/ logo
href. site.css cache-bust v6 -> v7 on all 18, per the website rules. Verified
rendered in a browser on both a Hungarian and an English page: both images
load, no .logo-text left anywhere, footer links computed rgb(46,168,245).
site_gates OK (nav/footer per language, BOM, cache-busting, twins).
511 lines
31 KiB
HTML
511 lines
31 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="hu">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>Technológiák — Docker, vezérlőpult, Proxmox otthoni szerverhez | Felhom.eu</title>
|
||
<meta name="description" content="Ipari szintű technológiák otthon: Docker konténerek, magyar vagy angol nyelvű vezérlőpult, Proxmox virtualizáció. HTTPS és titkosított alagút — nyitott port nélkül.">
|
||
|
||
<meta name="keywords" content="Docker, vezérlőpult, Proxmox, konténer, virtualizáció, reverse proxy, HTTPS, titkosított alagút, otthoni szerver technológia">
|
||
<meta name="robots" content="index, follow">
|
||
<link rel="canonical" href="https://felhom.eu/technologiak">
|
||
<link rel="alternate" hreflang="hu" href="https://felhom.eu/technologiak">
|
||
<link rel="alternate" hreflang="en" href="https://felhom.eu/en/technology">
|
||
<link rel="alternate" hreflang="x-default" href="https://felhom.eu/technologiak">
|
||
|
||
<meta property="og:type" content="article">
|
||
<meta property="og:url" content="https://felhom.eu/technologiak">
|
||
<meta property="og:title" content="Professzionális technológiák otthoni szerverhez">
|
||
<meta property="og:description" content="Docker, magyar vagy angol nyelvű vezérlőpult, Proxmox — ipari szintű megoldások otthoni környezetben.">
|
||
<meta property="og:image" content="https://felhom.eu/assets/og-image.png">
|
||
<meta property="og:locale" content="hu_HU">
|
||
<meta property="og:site_name" content="Felhom.eu">
|
||
|
||
<meta name="twitter:card" content="summary_large_image">
|
||
<meta name="twitter:title" content="Professzionális technológiák otthoni szerverhez">
|
||
<meta name="twitter:description" content="Docker, magyar vagy angol nyelvű vezérlőpult, Proxmox — ipari megoldások, otthoni környezetben.">
|
||
<meta name="twitter:image" content="https://felhom.eu/assets/og-image.png">
|
||
|
||
<script type="application/ld+json">
|
||
{
|
||
"@context": "https://schema.org",
|
||
"@type": "Article",
|
||
"headline": "Alkalmazott technológiák otthoni szerverekhez",
|
||
"description": "Docker konténerek, magyar vagy angol nyelvű vezérlőpult és Proxmox virtualizáció otthoni szerverre.",
|
||
"author": {"@type": "Organization", "name": "Felhom.eu"},
|
||
"publisher": {"@type": "Organization", "name": "Felhom.eu", "logo": {"@type": "ImageObject", "url": "https://felhom.eu/assets/logo.png"}},
|
||
"mainEntityOfPage": "https://felhom.eu/technologiak"
|
||
}
|
||
</script>
|
||
<!-- shared assets: bump ?v= together on any site.css/icons.svg change -->
|
||
<link rel="stylesheet" href="/assets/site.css?v=7">
|
||
<link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
|
||
<script defer src="/assets/gallery.js?v=2"></script>
|
||
<script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
|
||
</head>
|
||
<body class="page-technologiak">
|
||
<nav>
|
||
<div class="container">
|
||
<a href="/" class="logo">
|
||
<img class="logo-mark" src="/assets/logo_notext.svg" alt="" aria-hidden="true">
|
||
<img class="logo-word" src="/assets/logo-wordmark.png" alt="felhom.eu">
|
||
</a>
|
||
<ul class="nav-links">
|
||
<li><a href="/#szolgaltatasok">Szolgáltatások</a></li>
|
||
<li><a href="/alkalmazasok">Alkalmazások</a></li>
|
||
<li><a href="/technologiak" class="active">Technológiák</a></li>
|
||
<li><a href="/biztonsagimentes">Mentések</a></li>
|
||
<li><a href="/gyik">GYIK</a></li>
|
||
<li><a href="/kapcsolat">Kapcsolat</a></li>
|
||
<li class="lang-globe-li"><details class="lang-globe"><summary class="lang-globe-btn" aria-label="Nyelv" title="Nyelv"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/technologiak" lang="hu" hreflang="hu" class="lang-globe-item current" aria-current="true">Magyar</a></li><li><a href="/en/technology" lang="en" hreflang="en" class="lang-globe-item">English</a></li></ul></details></li>
|
||
</ul>
|
||
<button class="hamburger" id="hamburger" aria-label="Menü megnyitása" aria-expanded="false">
|
||
<span class="hamburger-box">
|
||
<span class="hamburger-line"></span>
|
||
<span class="hamburger-line"></span>
|
||
<span class="hamburger-line"></span>
|
||
</span>
|
||
</button>
|
||
</div>
|
||
</nav>
|
||
<div class="mobile-overlay" id="mobileOverlay"></div>
|
||
|
||
<main>
|
||
<section class="page-header">
|
||
<div class="container">
|
||
<h1>Alkalmazott <span>Technológiák</span></h1>
|
||
<p>Modern, bevált megoldások az otthoni szerverek üzemeltetéséhez. Íme, hogyan építjük fel a rendszereket.</p>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Table of Contents -->
|
||
<section class="content-section" style="padding-top: 0;">
|
||
<div class="container">
|
||
<div class="toc-nav">
|
||
<h3>Tartalom</h3>
|
||
<ul class="toc-links">
|
||
<li><a href="#kontenerek">Miért konténerek?</a></li>
|
||
<li><a href="#single-node">A kezelőréteg (vezérlőpult)</a></li>
|
||
<li><a href="#proxmox">Virtualizáció (Proxmox)</a></li>
|
||
<li><a href="#halozat">Hálózat és biztonság</a></li>
|
||
<li><a href="#tarolas">Tárolás</a></li>
|
||
<li><a href="#hardver">Hardver konfigurációk</a></li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Miért konténerek? -->
|
||
<section class="content-section alt-bg" id="kontenerek">
|
||
<div class="container">
|
||
<div class="section-header">
|
||
<h2>Miért <span>konténerek?</span></h2>
|
||
<p>A modern szerverüzemeltetés alapköve</p>
|
||
</div>
|
||
|
||
<div class="info-card">
|
||
<h3><span class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg></span> Mi az a konténer?</h3>
|
||
<p>Képzeld el, hogy minden alkalmazás egy saját, elszigetelt „dobozban" fut. Ez a doboz tartalmazza az alkalmazást és minden függőségét – így garantáltan ugyanúgy működik bárhol, bármilyen szerveren.</p>
|
||
<p>A konténerek (Docker) forradalmasították a szerverüzemeltetést: egyszerűbb telepítés, könnyebb frissítés, és megbízhatóbb működés.</p>
|
||
|
||
<div class="highlight-box">
|
||
<p><strong>Analógia:</strong> Mintha minden alkalmazás a saját lakásában élne egy társasházban. Van saját bejárata, saját közműórája, és nem zavarja a szomszédokat – de mégis egy épületen osztoznak.</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="comparison-grid">
|
||
<div class="comparison-card">
|
||
<div class="card-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-monitor"/></svg></div>
|
||
<h3>Hagyományos telepítés</h3>
|
||
<div class="subtitle">„Közvetlenül a rendszerre"</div>
|
||
<p>Az alkalmazások közvetlenül az operációs rendszerre települnek. Ütközhetnek egymással, nehéz eltávolítani őket.</p>
|
||
<ul class="feature-list cons">
|
||
<li>Függőségek összeakadhatnak</li>
|
||
<li>Nehéz reprodukálni más szerveren</li>
|
||
<li>Frissítés = kockázat</li>
|
||
<li>Eltávolítás „szemetet" hagy</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div class="comparison-card recommended">
|
||
<div class="card-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-container"/></svg></div>
|
||
<h3>Konténerizált telepítés</h3>
|
||
<div class="subtitle">Docker</div>
|
||
<p>Minden alkalmazás elszigetelten fut. Tiszta, rendezett, könnyen kezelhető rendszer.</p>
|
||
<ul class="feature-list">
|
||
<li>Teljesen izolált alkalmazások</li>
|
||
<li>Egy parancs = telepítés</li>
|
||
<li>Egyszerű frissítés és visszaállás</li>
|
||
<li>Bárhol reprodukálható</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Single Node - vezérlőpult -->
|
||
<section class="content-section" id="single-node">
|
||
<div class="container">
|
||
<div class="section-header">
|
||
<h2>A kezelőréteg: <span>a vezérlőpult</span></h2>
|
||
<p>Minden Felhom doboz kezelőfelülete, magyarul vagy angolul</p>
|
||
</div>
|
||
|
||
<div class="info-card">
|
||
<h3><span class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-target"/></svg></span> Mit csinál a vezérlőpult?</h3>
|
||
<p>A vezérlőpult minden Felhom dobozon ott van: ez a magyar vagy angol nyelvű kezelőfelület, amely a Proxmox alapra épülő rendszeredet vezérli. Egy kimondottan otthoni szerverekre tervezett felület, ahol pár kattintással telepíthetsz alkalmazásokat, és nem kell parancssorhoz nyúlnod — a háttérben a Docker és a Proxmox dolgozik helyetted.</p>
|
||
|
||
<ul class="feature-list">
|
||
<li>Magyar vagy angol webes felület – a háztartás választ, és nincs szükség parancssor ismeretre</li>
|
||
<li>Alkalmazás katalógus – 56 app telepíthető pár kattintással</li>
|
||
<li>Erőforrás figyelés – memória és tárhely használat valós időben</li>
|
||
<li>Automatikus mentések – adatbázis és fájl backup, állapotfigyeléssel</li>
|
||
<li>Alkalmazás frissítések – csak kipróbált verzió, előtte friss mentés, és ha az új verzió nem indul, a doboz magától visszaáll az előzőre</li>
|
||
<li>Rendszer monitoring – folyamatos egészségfigyelés, riasztások</li>
|
||
</ul>
|
||
|
||
<div class="dash-grid">
|
||
<figure class="dash-shot">
|
||
<a href="/assets/dashboard-apps-hu.webp" data-gallery="dashboard"><img src="/assets/dashboard-apps-hu.webp" alt="Az Alkalmazások oldal: telepített és telepíthető alkalmazások kártyái, állapottal" width="1440" height="900" loading="lazy"></a>
|
||
<figcaption><strong>Alkalmazások</strong> — telepítés pár kattintással, és látod, mi fut és mi naprakész.</figcaption>
|
||
</figure>
|
||
<figure class="dash-shot">
|
||
<a href="/assets/dashboard-backups-hu.webp" data-gallery="dashboard"><img src="/assets/dashboard-backups-hu.webp" alt="A mentések oldala: minden alkalmazás adatbázisának éjszakai mentése, ellenőrizve" width="1440" height="900" loading="lazy"></a>
|
||
<figcaption><strong>Mentések</strong> — minden éjjel minden alkalmazás adatbázisa mentésre kerül, és ellenőrizzük.</figcaption>
|
||
</figure>
|
||
</div>
|
||
|
||
<div class="highlight-box">
|
||
<p><strong>Tökéletes:</strong> Otthoni média szerver, családi felhő, személyes projektek, kis irodai használat.</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="stack-diagram">
|
||
<h3>Egy Felhom doboz felépítése</h3>
|
||
<div class="stack-layers">
|
||
<div class="stack-layer">
|
||
<div class="layer-label">Kezelő + appok</div>
|
||
<div class="layer-content highlight">
|
||
<div class="layer-name">Vezérlőpult + Alkalmazások</div>
|
||
<div class="layer-tech">Magyar vagy angol kezelőfelület · Nextcloud, Jellyfin, Immich…</div>
|
||
</div>
|
||
</div>
|
||
<div class="stack-layer">
|
||
<div class="layer-label">Konténer motor</div>
|
||
<div class="layer-content">
|
||
<div class="layer-name">Docker</div>
|
||
<div class="layer-tech">Az appok elszigetelt konténerekben futnak</div>
|
||
</div>
|
||
</div>
|
||
<div class="stack-layer">
|
||
<div class="layer-label">Rendszerkörnyezet</div>
|
||
<div class="layer-content">
|
||
<div class="layer-name">Izolált rendszerkörnyezet</div>
|
||
<div class="layer-tech">A te dobozod — tisztán elkülönített rendszer</div>
|
||
</div>
|
||
</div>
|
||
<div class="stack-layer">
|
||
<div class="layer-label">Alapréteg</div>
|
||
<div class="layer-content">
|
||
<div class="layer-name">Proxmox VE</div>
|
||
<div class="layer-tech">Virtualizációs alap · a teljes doboz mentése, visszaállítás</div>
|
||
</div>
|
||
</div>
|
||
<div class="stack-layer">
|
||
<div class="layer-label">Hardver</div>
|
||
<div class="layer-content">
|
||
<div class="layer-name">A szerver gépe</div>
|
||
<div class="layer-tech">Mini PC, tower vagy szerver</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Proxmox -->
|
||
<section class="content-section alt-bg" id="proxmox">
|
||
<div class="container">
|
||
<div class="section-header">
|
||
<h2>Az alapréteg: <span>Proxmox</span></h2>
|
||
<p>Erre a stabil alapra építünk minden Felhom gépet</p>
|
||
</div>
|
||
|
||
<div class="info-card">
|
||
<h3><span class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg></span> Mi az a Proxmox?</h3>
|
||
<p>A Proxmox VE egy ingyenes, professzionális virtualizációs platform — ugyanaz a fajta technológia, amelyet adatközpontok és cégek használnak. Ez a Felhom rendszerek alapja: erre építünk minden gépet, és erre települ az izolált rendszerkörnyezet, amelyben az alkalmazásaid futnak.</p>
|
||
|
||
<div class="highlight-box">
|
||
<p><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg> <strong>Az alap, nem opció:</strong> A Proxmox minden Felhom dobozon ott van. Nem kell róla tudnod és nem kell vele foglalkoznod — csendben a háttérben dolgozik, és ez teszi a rendszeredet biztonságossá és menthetővé.</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="info-card">
|
||
<h3><span class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-target"/></svg></span> Mit ad neked a Proxmox alap?</h3>
|
||
|
||
<ul class="feature-list">
|
||
<li><strong>Mentés frissítés előtt</strong> – egy alkalmazás frissítése előtt friss mentés készül, és ha az új verzió nem indul el, a doboz magától visszaállítja az előzőt</li>
|
||
<li><strong>Az egész rendszer menthető</strong> – nem csak az adataid, hanem a teljes dobozod is biztonsági mentésbe kerül, és ebből visszaállítható</li>
|
||
<li><strong>Tiszta elkülönítés</strong> – a kezelőréteg és az alkalmazásaid erősen elkülönítve futnak, így stabilabb és biztonságosabb a rendszer</li>
|
||
<li><strong>Gyors, megismételhető telepítés</strong> – egy új doboz beüzemelése gyors és kiszámítható, mindig ugyanúgy</li>
|
||
</ul>
|
||
|
||
<div class="highlight-box">
|
||
<p><strong>Egy alap, egy feladat:</strong> a Felhom dobozon a Proxmox egyetlen elkülönített rendszerkörnyezetet futtat — azt, amelyben az alkalmazásaid dolgoznak.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Hálózat -->
|
||
<section class="content-section alt-bg" id="halozat">
|
||
<div class="container">
|
||
<div class="section-header">
|
||
<h2>Hálózat és <span>biztonság</span></h2>
|
||
<p>Hogyan éred el a szervered biztonságosan, bárhonnan?</p>
|
||
</div>
|
||
|
||
<div class="info-card">
|
||
<h3><span class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rotate-cw"/></svg></span> Reverse Proxy</h3>
|
||
<p>A reverse proxy egy „kapus", aki fogadja a beérkező kéréseket és továbbítja a megfelelő alkalmazáshoz. Emellett kezeli a HTTPS titkosítást is.</p>
|
||
|
||
<div class="network-flow">
|
||
<div class="flow-node">
|
||
<div class="node-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></div>
|
||
<div class="node-label">Internet</div>
|
||
</div>
|
||
<div class="flow-arrow">→</div>
|
||
<div class="flow-node">
|
||
<div class="node-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-lock"/></svg></div>
|
||
<div class="node-label">Reverse Proxy</div>
|
||
<div class="node-tech">Traefik</div>
|
||
</div>
|
||
<div class="flow-arrow">→</div>
|
||
<div class="flow-node">
|
||
<div class="node-icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg></div>
|
||
<div class="node-label">Alkalmazás</div>
|
||
</div>
|
||
</div>
|
||
|
||
<ul class="feature-list">
|
||
<li><strong>Traefik</strong> – minden alkalmazás a saját aldomainjén, HTTPS-sel</li>
|
||
<li><strong>Titkosított alagút</strong> – a doboz maga épít kapcsolatot kifelé, így otthon nem kell portot nyitni</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div class="info-card">
|
||
<h3><span class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield"/></svg></span> Védelem</h3>
|
||
<ul class="feature-list">
|
||
<li><strong>Nincs nyitott port</strong> – kívülről csak a titkosított alagúton át érhető el a doboz</li>
|
||
<li><strong>Saját bejelentkezés</strong> – minden alkalmazásnak saját fiókjai vannak, a vezérlőpultnak jelszava</li>
|
||
<li><strong>Családi kapu</strong> – egyes alkalmazások elé a családtagok saját belépése kerül, idegen el sem jut az alkalmazásig</li>
|
||
<li><strong>Biztonsági frissítések</strong> – a doboz rendszere magától megkapja őket</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Tárolás -->
|
||
<section class="content-section" id="tarolas">
|
||
<div class="container">
|
||
<div class="section-header">
|
||
<h2>Tárolás és <span>adatvédelem</span></h2>
|
||
<p>Hol és hogyan tárold az adataidat?</p>
|
||
</div>
|
||
|
||
<div class="comparison-grid">
|
||
<div class="comparison-card">
|
||
<div class="card-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-zap"/></svg></div>
|
||
<h3>SSD (NVMe/SATA)</h3>
|
||
<div class="subtitle">Gyors tárolás</div>
|
||
<ul class="feature-list">
|
||
<li>Operációs rendszer</li>
|
||
<li>Adatbázisok</li>
|
||
<li>Alkalmazások</li>
|
||
</ul>
|
||
</div>
|
||
<div class="comparison-card">
|
||
<div class="card-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-database"/></svg></div>
|
||
<h3>HDD</h3>
|
||
<div class="subtitle">Nagy kapacitás</div>
|
||
<ul class="feature-list">
|
||
<li>Média könyvtár</li>
|
||
<li>Fotó archívum</li>
|
||
<li>Mentések</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="info-card" style="margin-top: 32px;">
|
||
<h3><span class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rotate-cw"/></svg></span> Háromszintű mentés – így védjük az adataidat</h3>
|
||
<p>A Felhom dobozon minden éjjel készül egy <strong>mentés a dobozon</strong>, egy <strong>másodpéldány egy második meghajtóra</strong>, és egy <strong>titkosított másolat egy távoli tárhelyre</strong>. A szintek együtt védenek: a helyi gyors, a távoli túléli azt is, ha a doboznak fizikailag baja esik.</p>
|
||
|
||
<div class="warning-box">
|
||
<p><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-triangle-alert"/></svg> <strong>A több lemez önmagában nem mentés!</strong> A RAID-szerű megoldások a hardver meghibásodás ellen védenek, de nem a véletlen törlés vagy a zsarolóvírus ellen. Ezért nálunk a mentés mindig külön szinten van, nem a lemezekben.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Hardver konfigurációk -->
|
||
<section class="content-section alt-bg" id="hardver">
|
||
<div class="container">
|
||
<div class="section-header">
|
||
<h2>Hardver <span>konfigurációk</span></h2>
|
||
<p>Milyen gépre van szükséged? Néhány példa konfiguráció</p>
|
||
</div>
|
||
|
||
<div class="hardware-grid">
|
||
<div class="hardware-card">
|
||
<div class="hardware-card-header">
|
||
<div class="hw-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg></div>
|
||
<h3>Mini PC + NAS</h3>
|
||
<div class="hw-subtitle">Kezdő / Otthoni</div>
|
||
</div>
|
||
<div class="hardware-card-body">
|
||
<p>Kompakt, halk, energiatakarékos megoldás.</p>
|
||
<ul class="spec-list">
|
||
<li><span class="spec-label">CPU</span><span class="spec-value">Intel N100</span></li>
|
||
<li><span class="spec-label">RAM</span><span class="spec-value">16-32 GB</span></li>
|
||
<li><span class="spec-label">SSD</span><span class="spec-value">256-512 GB</span></li>
|
||
<li><span class="spec-label">Fogyasztás</span><span class="spec-value">15-35W</span></li>
|
||
</ul>
|
||
<div class="price-range">
|
||
<div class="label">Becsült költség</div>
|
||
<div class="price">80.000 - 150.000 Ft</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="hardware-card">
|
||
<div class="hardware-card-header">
|
||
<div class="hw-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-radio-tower"/></svg></div>
|
||
<h3>Tower szerver</h3>
|
||
<div class="hw-subtitle">Haladó / Családi</div>
|
||
</div>
|
||
<div class="hardware-card-body">
|
||
<p>Nagyobb teljesítmény és tárolókapacitás.</p>
|
||
<ul class="spec-list">
|
||
<li><span class="spec-label">CPU</span><span class="spec-value">Intel i5/i7</span></li>
|
||
<li><span class="spec-label">RAM</span><span class="spec-value">32-64 GB</span></li>
|
||
<li><span class="spec-label">Tárolás</span><span class="spec-value">4-8 TB</span></li>
|
||
<li><span class="spec-label">Fogyasztás</span><span class="spec-value">50-120W</span></li>
|
||
</ul>
|
||
<div class="price-range">
|
||
<div class="label">Becsült költség</div>
|
||
<div class="price">200.000 - 400.000 Ft</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="hardware-card">
|
||
<div class="hardware-card-header">
|
||
<div class="hw-icon"><svg class="ico-tile" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-building-2"/></svg></div>
|
||
<h3>Rack szerver</h3>
|
||
<div class="hw-subtitle">Üzleti / igény szerint</div>
|
||
</div>
|
||
<div class="hardware-card-body">
|
||
<p>Ipari minőség, nagy megbízhatóság.</p>
|
||
<ul class="spec-list">
|
||
<li><span class="spec-label">CPU</span><span class="spec-value">Xeon / EPYC</span></li>
|
||
<li><span class="spec-label">RAM</span><span class="spec-value">64-256 GB ECC</span></li>
|
||
<li><span class="spec-label">Tárolás</span><span class="spec-value">8-24 bay</span></li>
|
||
<li><span class="spec-label">Extra</span><span class="spec-value">IPMI, red. PSU</span></li>
|
||
</ul>
|
||
<div class="price-range">
|
||
<div class="label">Becsült költség (használt)</div>
|
||
<div class="price">150.000 - 600.000 Ft</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="info-card" style="margin-top: 48px;">
|
||
<h3><span class="icon"><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-lightbulb"/></svg></span> Melyiket válaszd?</h3>
|
||
<div class="highlight-box">
|
||
<p><strong>Tanácsunk:</strong> Kezdj kicsiben! Egy jó mini PC elegendő a legtöbb otthoni igényhez, és később bővítheted. A rack szerver üzleti / igény szerinti konfiguráció — otthonra ritkán szükséges.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- CTA -->
|
||
<section class="cta-section">
|
||
<div class="container">
|
||
<h2>Nem vagy biztos, melyik <span>megoldás neked való?</span></h2>
|
||
<p>Beszéljük át az igényeidet, és segítünk megtalálni a tökéletes konfigurációt.</p>
|
||
<a href="/kapcsolat" class="cta-button">Kapcsolatfelvétel →</a>
|
||
<a href="/alkalmazasok" class="cta-button-secondary">Alkalmazások böngészése →</a>
|
||
</div>
|
||
</section>
|
||
</main>
|
||
|
||
<footer>
|
||
<div class="container">
|
||
<p>© 2026 felhom.eu — Saját felhőd, saját szabályaid</p>
|
||
<p class="footer-legal">Üzemeltető: Nagyfenyvesi Viktor · <a href="mailto:info@felhom.eu">info@felhom.eu</a> · <a href="/adatkezeles">Adatkezelési tájékoztató</a> · <a href="/feltetelek">Feltételek</a></p>
|
||
</div>
|
||
</footer>
|
||
<script>
|
||
(function() {
|
||
var hamburger = document.getElementById('hamburger');
|
||
var navLinks = document.querySelector('.nav-links');
|
||
var overlay = document.getElementById('mobileOverlay');
|
||
var body = document.body;
|
||
|
||
if (!hamburger || !navLinks || !overlay) {
|
||
console.warn('[mobile-menu] Missing elements:', {
|
||
hamburger: !!hamburger,
|
||
navLinks: !!navLinks,
|
||
overlay: !!overlay
|
||
});
|
||
return;
|
||
}
|
||
|
||
function openMenu() {
|
||
hamburger.classList.add('is-active');
|
||
navLinks.classList.add('is-open');
|
||
overlay.classList.add('is-visible');
|
||
body.classList.add('menu-open');
|
||
hamburger.setAttribute('aria-expanded', 'true');
|
||
hamburger.setAttribute('aria-label', 'Menü bezárása');
|
||
}
|
||
|
||
function closeMenu() {
|
||
hamburger.classList.remove('is-active');
|
||
navLinks.classList.remove('is-open');
|
||
overlay.classList.remove('is-visible');
|
||
body.classList.remove('menu-open');
|
||
hamburger.setAttribute('aria-expanded', 'false');
|
||
hamburger.setAttribute('aria-label', 'Menü megnyitása');
|
||
}
|
||
|
||
hamburger.addEventListener('click', function() {
|
||
if (navLinks.classList.contains('is-open')) {
|
||
closeMenu();
|
||
} else {
|
||
openMenu();
|
||
}
|
||
});
|
||
|
||
overlay.addEventListener('click', closeMenu);
|
||
|
||
navLinks.querySelectorAll('a').forEach(function(link) {
|
||
link.addEventListener('click', closeMenu);
|
||
});
|
||
|
||
document.addEventListener('keydown', function(e) {
|
||
if (e.key === 'Escape' && navLinks.classList.contains('is-open')) {
|
||
closeMenu();
|
||
}
|
||
});
|
||
|
||
window.addEventListener('resize', function() {
|
||
if (window.innerWidth > 900 && navLinks.classList.contains('is-open')) {
|
||
closeMenu();
|
||
}
|
||
});
|
||
})();
|
||
</script>
|
||
</body>
|
||
</html> |