Reduce the effort of developing LIFF apps with the LIFF CLI
Hello! I’m Oka from the Technical Support team.
When developing a LIFF app, do you ever find the initial setup, preparation of a local development environment, or debugging to be time-consuming or cumbersome?
The LIFF CLI is a tool designed to streamline these tasks.
With the LIFF CLI, you can create and manage LIFF apps, conduct local development over HTTPS, and debug within the LIFF browser—all from the command line.
In our previous Tips article, "How to develop LIFF apps locally: tips for HTTPS support," we covered how to set up a local development environment for LIFF apps.
In this post, we’ll explore three specific use cases where the LIFF CLI proves helpful during the development process.
- Streamlining the initial setup of a LIFF app
- Simplifying endpoint URL management during local development
- Debugging apps running in the LIFF browser
- Wrap-up
Streamlining the initial setup of a LIFF app
Starting the development of a LIFF app typically requires several steps, such as configuring settings in the LINE Developers console and preparing an application template.
The init command in the LIFF CLI allows you to handle these tasks—adding a channel, creating a LIFF app, and generating a project template—all through an interactive, step-by-step process.
By running this command and following the on-screen prompts to enter the required information, you can complete the various setup tasks in a single, continuous workflow.
This is especially useful when building your first LIFF app or launching a new project.
Simplifying endpoint URL management during local development
To develop a LIFF app in a local environment, you need to ensure it is accessible via HTTPS. Furthermore, to allow the LIFF browser to connect to your local development server, you must configure the LIFF app's endpoint URL. The serve command in the LIFF CLI launches an HTTPS proxy for your local development server and updates your LIFF app's endpoint URL to point to this proxy.
For example, if your local development server is running at http://localhost:3000/, you can run the following command:
This action simultaneously launches the HTTPS proxy and updates the endpoint URL.
Note that to use the serve command, you must have a valid certificate and private key for localhost prepared in advance. For more information, see the operating conditions for the serve command.
The serve command modifies the endpoint URL of a LIFF app. Running this on a LIFF app that has already been published will prevent users from accessing it; therefore, please use it only for LIFF apps intended for development or testing.
Debugging apps running in the LIFF browser
If you need to investigate issues occurring within the LIFF browser, the LIFF Inspector is a useful tool.
In the LIFF CLI, you can launch the LIFF Inspector Server over HTTPS by adding the --inspect option to the serve command:
After integrating the LIFF Inspector Plugin into your LIFF app and accessing the LIFF URL, a URL beginning with devtools://devtools/ will appear in the terminal where you ran the serve command.
You can debug your LIFF app by opening this URL in Google Chrome. For detailed instructions on how to use the LIFF Inspector and other related procedures, please refer to the LIFF plugin documentation.
Wrap-up
In this article, we introduced three use cases where the LIFF CLI proves useful.
The LIFF CLI is valuable throughout the development process—not only for the initial setup of a LIFF app, but also for local development and debugging.
In addition to the features covered here, the LIFF CLI also includes commands such as app, which allows you to manage the registration details of your LIFF apps.
When developing LIFF apps, be sure to consider incorporating the LIFF CLI into your workflow.