CI/CD with Github for Flutter Web to CPanel

Brishav Shakya — Fri, 28 Jul 2023 09:25:34 +0000

Introduction

Flutter web can be used to make responsive beautiful web application using canvaskit and html renderer. Flutter provides the best experience for a web application but deploying and hosting it can sometimes be a hectic way to make and host it again and again. For this CI/CD can be used with the help of gitub actions to make our life easier.

Requirement

Install Flutter on your operating system.Installation
Download your preferred IDE such as VS Code or Android Studio
Run the code in the terminal if all the required files and components are installed in your device.

flutter doctor -v

Create a new project using command-line in terminal by creating a empty folder in your desired path

flutter create cicdflutterdemo

You can use Android Studio to directly create a project as well.

This will run the command automatically and create an empty project for you.

Create a git repository in your project

git init
git add.
git commit -m "initial commit
git remote add origin [copied web address]
git push origin main

Do create a repository inside Github to get the web address to push your project to.
After that go to your CPanel login
Go to FTP accounts
Create a FTP credential

10 . After creating a FTP account go below you will see your FTP client below and click on to configure client

FTP Username: your_id_in_cpanel@demo.com FTP server: ftp.demo.com FTP & explicit FTPS port: 21

This will pop up. Copy your password and these setting that was generated.

Next go to your Github repository
Go to GitHub action

Create a new workflow file
Copy this text to your workflow

CI/CD example

After that push your code to your repo
You can manage the push and pull to which branch you want to use CI/CD
In the example it is set to main. You can set it to other branches as well to activate it. And we are done.

Conclusion

So through this simple process we can easily use CI/CD with the help of Github action release our website made by flutter through IDE directly.

So what's your way of hosting the website?

🩷 Need More love to Flutter Web

Brishav Shakya — Fri, 28 Jul 2023 07:08:44 +0000

Flutter is the emerging technology that developers are increasingly turning to when creating mobile applications. but as evident in the more recent market. Developers can now improve the website using the same code by using a new feature added to Flutter Web.
Since I have been developing applications for the past 4 years, I have developed a strong interest in mobile applications. I began my adventure with Java, moved on to Kotlin, and have recently been following the lead of Flutter Development. Flutter has been quite beneficial and motivational for me, inspiring me to pursue both Android and iOS development.
Flutter demonstrated to me how a simple application could be created with little expertise, less time, and greater output.
I've been using this framework for more than a year at this point. It gave me hope that I could learn more from it.
I've been experimenting with Flutter Web lately, and the results have been mixed. It excels at what it does, but more care is still needed to maximize the potential it has generated within mobile development. Flutter Web performs well on the web and the hosting aspect is also very simple and quick. The developer community can follow the very promising route that Flutter Web has demonstrated.
These are a few of the web applications using the flutter framework that I have been working on and are still under development.

Event Anything

Personal Portfolio

Enhancements

Working on Flutter Web has seriously hindered the website's responsiveness, and neither a plugin nor a package appears to have a workable solution. Some of the essential plugins, like Listview and Gridview, require greater compatibility rather than relying on math to be responsive.
Although certain packages have been seen to be constructed, they are not yet stable enough to work with.
Flutter web can shine more like it has in the mobile zones if the devs can work on this and show a little more affection.

DEV Community: Brishav Shakya

CI/CD with Github for Flutter Web to CPanel

Introduction

Requirement

Conclusion

🩷 Need More love to Flutter Web

Enhancements