In this blog post, We are going to learn web app manifest - manifest.json file example with tutorials.
web app manifest is a JSON file that contains metadata information of a web application. It specifies to the browser how it looks User interface during application installed on mobile or desktop.manifest.json is also called manifest.webmanifest. This can also be used in progressive web applications that look web applications as native apps. In browsers like chrome, the manifest file is required to enable add to home screen prompt feature
Manifest.json file can be used by different types of following applications
manifest json file Supports following browsers and devices
Here is sample manifest.json sample file which contains basic required properties like name,icons and start_url. remaining properties are optional.
"name": "Todo PWA Application",
"description": "To Do Progressive web application.",
name:- Application name that displays the value on user home screen short_name:- shorter name of the application. This will be displayed during installation of add to home screen feature icons - These are icons to be used in application installation, add to home screen, splash screen: This will contain a collection of images that will be displayed when a user adds the website to home screen start_url This will be default URL when application is started. The landing page of application startup theme_color- this is the color of the application toolbar background_color this specifies the color of the splash screen Display - this specifies the application display when it is started, the values are fullscreen, standalone,minimal-ui,browser Orientation - orientation mode of application - landscape or portrait
We can include the manifest.json file in the head using link tag of HTML web page. This tells to the browser about manifest.json.
<link rel="manifest" href="manifest.json">
manifest json file has provided following features in applications