PWA Setup

Progressive web apps (PWA) are web applications that can be accessed through a web browser and provide a similar experience to a native mobile app. They can be used in FutureAi - OpenAI Content, Image, Chat, Code Generator as SaaS project to provide a more seamless and engaging user experience for students.

Some ways PWA can be used in FutureAi include:

  1. Add to home screen: PWAs can be added to the home screen of a device, giving students quick and easy access to the FutureAi.

  2. Cross-platform compatibility: PWAs can be accessed on a wide range of devices and browsers, which can be useful for students who use different devices or platforms.

  3. Mobile compatibility: PWAs are designed to be mobile-friendly, which is important since many students may access the FutureAi from a mobile device.

  4. Cost-effective: PWAs are cheaper to develop and maintain than traditional mobile apps, which can be beneficial for organizations with limited budgets.

It's worth noting that not all FutureAi are compatible with PWA, it's important to check if the platform you are using supports this technology before implementing it. Also, it's important to test the PWA on different devices and browsers to ensure that it provides a consistent user experience across all platforms.

PWA is lite app, When you open it in Mobile Browser its ask for add app in mobile. Its Not APK. You can not submit to Play Store.

Note: The website is to be served from a secure (HTTPS) domain.

https://yourdomain.com/public/

Why do I need it?

One reason users love apps is they generally offer better experiences than web applications. However, developing and maintaining native apps is a lot of work, not to mention the expenses involved.

If your users use different platforms (Android, iOS, etc.), you have to code your app for each platform.

PWAs, however, don’t require you to code for each platform. They were designed with the philosophy of β€œcode once, use everywhere.” Once you code your PWA, it can be used in-browser (as a website or web app), on desktops, and on mobile devices.

How to Setup PWA?

Go to your project and log in as admin.

  • Go to Admin Dashboard->Front Settings->PWA.

  • Here, you will be able to change the PWA like PWA enable or not, App Name, App URL, Theme color for header, Background color, and shortcut icon, etc.

  • Here, you can update the icon, and also icons size should be 512*512.

  • Splash icon size should be 2048*2732. Path: (public -> images -> icons)

for Change icons directly in files: Go to public -> images -> icons and change icons

for Change URL directly in files: go to .env and add app url its required Like:

APP_URL=https://yourdomain.com/public/

πŸ§™β€β™‚οΈTips: Splash Screen works only on Apple Device. SSL Must Required.

Last updated