web app

harvis.dev को ऐप की तरह इंस्टॉल करें

harvis.dev के साथ वेब मैनिफ़ेस्ट आता है, इसलिए आपका ब्राउज़र इसे किसी भी दूसरे ऐप की तरह इंस्टॉल कर सकता है — अपनी विंडो और डॉक या होम स्क्रीन पर अपना आइकन। कोई ऐप स्टोर नहीं, कोई इंस्टॉलर नहीं, कोई अनुमति नहीं।

why bother

इंस्टॉल करने से क्या बदलता है

  • अपनी अलग विंडो

    न टैब, न एड्रेस बार। अपलोडर और आपका डैशबोर्ड एक साफ़-सुथरी अलग विंडो में खुलते हैं, जिसकी ऐप स्विचर में अपनी जगह होती है।

  • एक टैप में पब्लिश

    डॉक, टास्कबार या होम स्क्रीन पर एक आइकन। खोलिए, फ़ोल्डर छोड़िए, और विंडो जमने से पहले साइट लाइव हो जाती है।

  • डाउनलोड कुछ नहीं

    यह वही साइट है जो आप अभी पढ़ रहे हैं — इंस्टॉल करने से सिर्फ़ आइकन और विंडो जुड़ते हैं। न बंडल, न स्टोर अकाउंट, न मंज़ूरी माँगते बैकग्राउंड अपडेट।

इंस्टॉल कैसे करें

वही ब्राउज़र चुनिए जिसमें आप यह पढ़ रहे हैं। हर रास्ता एक ही जगह खत्म होता है: harvis.dev आपके नेटिव ऐप्स के बगल में।

डेस्कटॉप पर Chrome, Edge या Brave

  1. 01एड्रेस बार के दाएँ सिरे पर देखिए — नीचे तीर वाला छोटा मॉनिटर ही इंस्टॉल आइकन है।
  2. 02आइकन नहीं दिख रहा? ब्राउज़र मेन्यू खोलिए और “Install page as app” चुनिए (Edge में: Apps → Install this site as an app)।
  3. 03पुष्टि कीजिए, और harvis.dev अपनी विंडो में खुलेगा और आपके ऐप लॉन्चर में दिखने लगेगा।

Android पर Chrome

  1. 01ऊपर दाईं ओर ⋮ मेन्यू पर टैप कीजिए।
  2. 02“होम स्क्रीन में जोड़ें” चुनिए, फिर “इंस्टॉल करें” पर टैप कीजिए।
  3. 03आइकन होम स्क्रीन पर आ जाता है और बिना किसी ब्राउज़र फ़्रेम के खुलता है।

iPhone और iPad पर Safari

  1. 01शेयर बटन पर टैप कीजिए — ऊपर की ओर तीर वाला चौकोर।
  2. 02शीट को नीचे स्क्रॉल कीजिए, “Add to Home Screen” पर टैप कीजिए, फिर “Add”।
  3. 03iOS वही मैनिफ़ेस्ट पढ़ता है पर प्रॉम्प्ट कभी नहीं दिखाता, इसलिए यही एकमात्र रास्ता है।

Mac पर Safari

  1. 01harvis.dev को सामान्य टैब में खोलिए।
  2. 02मेन्यू बार में File → Add to Dock चुनिए, नाम दीजिए और Add पर क्लिक कीजिए।
  3. 03macOS Sonoma या उससे नया चाहिए — इससे पुराने Safari वेब ऐप इंस्टॉल नहीं कर सकते।

डेस्कटॉप Firefox ने वेब ऐप इंस्टॉल करना हटा दिया है, इसलिए बुकमार्क ही सबसे नज़दीकी विकल्प है। Android वाले Firefox के मेन्यू में “होम स्क्रीन में जोड़ें” अब भी मौजूद है।

मैनिफ़ेस्ट में क्या है

पूरा इंस्टॉल एक ही फ़ाइल से चलता है, जो /site.webmanifest पर मिलती है। ब्राउज़र उसी से जानते हैं कि ऐप का नाम क्या है, कौन-सा आइकन लेना है और विंडो कैसे खुलनी चाहिए।

site.webmanifest
{
  "name": "harvis.dev",
  "short_name": "harvis.dev",
  "start_url": "/",
  "display": "standalone",
  "background_color": "#13161a",
  "theme_color": "#13161a",
  "icons": [
    { "src": "/icon-192.png", "sizes": "192x192", "type": "image/png", "purpose": "any" },
    { "src": "/icon-512.png", "sizes": "512x512", "type": "image/png", "purpose": "any" },
    { "src": "/icon-maskable-512.png", "sizes": "512x512", "type": "image/png", "purpose": "maskable" }
  ]
}

ब्राउज़र का फ़्रेम हटाने वाला फ़ील्ड “standalone” है; maskable आइकन वही है जिसे Android अपनी शक्ल में काटता है।

अपनी साइट को भी इंस्टॉल करने लायक बनाइए

harvis.dev पर आप जो कुछ भी डिप्लॉय करते हैं, वह ठीक इसी तरह इंस्टॉल हो सकता है। index.html के बगल में manifest.json रखिए, head से उसे जोड़िए, और 192px व 512px के आइकन दीजिए — बस इतनी ही शर्त है।

html
<!-- index.html -->
<link rel="manifest" href="/manifest.json">
<meta name="theme-color" content="#13161a">

ब्राउज़र इंस्टॉल का सुझाव देने से पहले HTTPS भी माँगते हैं। harvis.dev का हर पता पहले से HTTPS पर है, तो सेट करने को कुछ नहीं।