How to publish your first Flutter Package!

Using Flutter Packages since long?
Do you wish to contribute back?
Do you wish to publish your own package and help the community? 
But don't know how? 
No worries. I have your back.
In this blog, I will get you through each and every step of how to publish your own Flutter Package on the official Flutter Website pub.dev

---

---

Pre-Requisites :

• Passion For Helping
• Understanding of Flutter
• Git

---

So let's get our hands dirty!! 👏👏

A flutter package always has a class which returns a widget.
Also, the class must not have any hard-coded values.
All the functionalities which you want to provide to the user, create it as a property (variable) and create a constructor to get the value.

For example:
If you want the user to set the height of the container, create a property named double height. Add in the constructor & then pass it to the height property of the Container.

class <class_name>{
     double height;
     class_name({this.height});
     .
     .
     .
     .
     Container(
        height:height,
        .
        .
        .
     ),
}

Once the code is created, use it in an application to test it and get a better understanding.

---

So, let's start through the steps of how to publish the package!! 🎉💙

Step 1: Start by creating new flutter package!!

• Open Android Studio
• Click on Create new Flutter Project
• Click on New Flutter Package

---

Step 2: Give the name of the project as the one you want your package to be named. Thus, the name of your project will be your package name.

---

Step 3: Put the project on Github. Keep the repo public.

---

Step 4: This is the most Important Step!!
Edit the Pubspec.YAML file.

• Add Description for the package (Minimum 20 words). This costs you points on pub.dev after publishing.
• Remove author as it is not used now.
• Add homepage. HomePage can be your own website or you can also give the Github Profile Page link.
• Add repository. Don't do mistake in this!! If the link get's wrong, issues link on the pub.dev will not be generated. Here's an example:

Correct Link: https://github.com/AbhishekDoshi26/contactus
Wrong Link: https://github.com/AbhishekDoshi26/contactus.git

• Add Version Number. Whenever you update your package code, version number has to be changed.

---

Step 5: Write the code in the dart file. Here's an example of the code of a package named contactus

---

Step 6: Create Documentation. For Documentation, you need to use /// to provide the documentation for a particular property/method/class,etc. /// will create documentaion and // will be comment.

class ContactUs extends StatelessWidget {
  ///Logo of the Company/individual
  final ImageProvider logo;

Also, after creating manual documentations to your classes, let's created the predefined documentation. Open Command Prompt in the package location and run dartdoc command in terminal on your package location.

---

Step 7: Open the CHANGELOG.md file and write the version number, publishing date and description in the file. Here's an example for the same:

## [1.0.0] - 16/04/2020.
Added Icons for all the social networks

---

Step 8: Create a file LICENSE.txt & add any license such as MIT License. You can get template of any license from the internet. You can refer the MIT License of contactus package.

---

Step 8: Create an Example.

• Inside the package folder itself, create a new flutter project, named as example. (Don't change the name. Name has to be compulsory example as it will be used in pub.dev)
• To use the package in the example, without publishing, add in the pubspec.yaml the following line:

package_name:
    path: Complete path of the package on your computer.

• Here's the code snippet of how you can use contactus package or your own package in the example:

import 'package:contactus/contactus.dart';
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        bottomNavigationBar: ContactUsBottomAppBar(
          companyName: 'Abhishek Doshi',
          textColor: Colors.white,
          backgroundColor: Colors.teal.shade300,
          email: '[e-mail]',
        ),
        backgroundColor: Colors.teal,
        body: Container(),
      ),
    );
  }
}

---

Step 9: Push all to the Github Repository

---

Step 10: Open Command Prompt on the repo location. Now run the following command:
flutter pub publish --dry-run
If any suggestions or warnings are encountered, do the required changes.

---

Step 11: If everything is perfect, run the following command to publish the package.
flutter pub publish

---

Tadaaaaaaaaaaaaaa!!!!!!!!🌟🎉👏 Your package has been published!!

Now, whenever you change anything in the code/any file of the package/example, you need to update the following files:

• pubspec.yaml (Version Number)
• CHANGELOG.md (Add new version, date & description)

---

Don't stop until you are breathing!!!
 -Abhishek Doshi