Back to "Створення вашого ядра ASP. NET веб-сайту PWA"

This is a viewer only at the moment see the article on how this works.

To update the preview hit Ctrl-Alt-R (or ⌘-Alt-R on Mac) or Enter to refresh. The Save icon lets you save the markdown file to disk

# Створення вашого ядра ASP. NET веб-сайту PWA

<datetime class="hidden">2024- 08- 01T11: 36</datetime>

У цій статті я покажу вам, як створити ваш веб-сайт ASP.NET PWA (Progressive Web App).

## Передумови

Це дуже просто побачити https: //github.com/ madskistensen/WebEsentials.AspNetCore.ServiceWorker/tree/ master

## ASP. NET Bits

Встановити пакунок Nuget

```bash
dotnet add package WebEssentials.AspNetCore.PWA
```

У вашій програмі.cs add:

```csharp
builder.Services.AddProgressiveWebApp();
```

Потім створіть сім' ї, які відповідають розмірам нижче [тут](https://realfavicongenerator.net/) Це інструмент, яким ви можете скористатися для їх створення. Це дійсно може бути будь-яка ікона (Я використовував слово mamoji ⇩)

Save these in your wwrroot folder as android-chrome-192x192.png and android-chrome-512x512.png (in the example below)

Тоді вам потрібен маніфест.json.

```json
{
  "name": "mostlylucid",
  "short_name": "mostlylucid",
  "description": "The web site for mostlylucid limited",
  "icons": [
    {
      "src": "/android-chrome-192x192.png",
      "sizes": "192x192"
    },
    {
      "src": "/android-chrome-512x512.png",
      "sizes": "512x512"
    }
  ],
  "display": "standalone",
  "start_url": "/"
}
```

This is a preview from the server running through my markdig pipeline

ASP.NET

Створення вашого ядра ASP. NET веб-сайту PWA

Friday, 13 September 2024

2024- 08- 01T11: 36

У цій статті я покажу вам, як створити ваш веб-сайт ASP.NET PWA (Progressive Web App).

Передумови

Це дуже просто побачити https: //github.com/ madskistensen/WebEsentials.AspNetCore.ServiceWorker/tree/ master

ASP. NET Bits

Встановити пакунок Nuget

dotnet add package WebEssentials.AspNetCore.PWA

У вашій програмі.cs add:

builder.Services.AddProgressiveWebApp();

Потім створіть сім' ї, які відповідають розмірам нижче тут Це інструмент, яким ви можете скористатися для їх створення. Це дійсно може бути будь-яка ікона (Я використовував слово mamoji ⇩)

Save these in your wwrroot folder as android-chrome-192x192.png and android-chrome-512x512.png (in the example below)

Тоді вам потрібен маніфест.json.

{
  "name": "mostlylucid",
  "short_name": "mostlylucid",
  "description": "The web site for mostlylucid limited",
  "icons": [
    {
      "src": "/android-chrome-192x192.png",
      "sizes": "192x192"
    },
    {
      "src": "/android-chrome-512x512.png",
      "sizes": "512x512"
    }
  ],
  "display": "standalone",
  "start_url": "/"
}

©2024 Scott Galloway