Easily add certifications to LinkedIn from your website.
Tags: react, npm, typescript, linkedin
Published: 2021-12-18 14:05:23

A few weeks back @lakindu and I were building a platform for [@Richmond Live](https://academy.richmondlive.lk) 's new training program. The students were given a digital certificate for the courses they completed at the Richmond Live's academy and once they log in, they can share their certificate across social media platforms or simply download the PDF certificate. In addition to that, students can maintain their public profile which can be used as a portfolio for their achievements at the academy. 

While building this platform, we needed a feature to have a button that will add the certification directly to LinkedIn. Checked the official LinkedIn documentation but to keep things simple, we wanted a small NPM package that can do the job. Unfortunately we couldn't find anything that is flexible and stable enough to use in out application. We ended up using the hard way; building the button from the scratch.

After a few days we decided to create a package ourselves for people to use easily. So [`Linkedin-certification`](https://www.npmjs.com/package/linkedin-certification) was born!

### What does it do?
It will let you to add your certifications directly into LinkedIn from your website. (_Not directly! You still need to confirm the details :wink_)

### How to install?
If you're using `npm`,
```curl
npm install linkedin-certification --save
```
 or else if you're a `yarn` user,
```curl
yarn add linkedin-certification
```

### How to use it?
- First, import the package 
```javascript
import { LinkedinCertification } from "linkedin-certification";
```
- Then use the imported component with your certification details.
```javascript
<LinkedinCertification
  certificationName="My Sample Certification"
  organizationName="My Sample Organization"
  issuedMonth={12}
  issuedYear={2021}
  expirationMonth={3}
  expirationYear={2023}
  certificateId="29c2e87e-5c1c-11ec-bf63-0242ac130002"
  certificateURL="https://www.google.com"
  newTab={true}
/>
```
Thats it! You can see a button like this on your application upon saving.
<img src="https://camo.githubusercontent.com/46b14f0a5c9408a8b9ad5e66166806390290bae8ef580a47cdbdcf54c565cb41/68747470733a2f2f692e696d6775722e636f6d2f6c336d3432614e2e706e67">

### The property list

| Property            | Type         | Description                                                       |
| ------------------- | ------------ | ----------------------------------------------------------------- |
| `certificationName` | `string`     | The name of the certification. `[Required]`                       |
| `organizationName`  | `string`     | The name of the organizaion. `[Required]`                         |
| `issuedMonth`       | `number`     | Certification issued month                                        |
| `issuedYear`        | `number`     | Certification issued year                                         |
| `expirationMonth`   | `number`     | Certification expiry month                                        |
| `expirationYear`    | `number`     | Certification expiry year                                         |
| `certificateId`     | `number`     | Unique ID of the certification                                    |
| `certificateURL`    | `string`     | URL for the certification                                         |
| `newTab`            | `boolean`    | Set `true` to open the LinkedIn Certification window in a new tab |
| `customButton`      | `React Node` | Lets you pass your own custom button.                             |

### YES you saw it right! 
`linkedin-certification` lets you add your custom buttons instead of the default one that comes with the package! Got a really cool button with a bunch of animations? Or need a button that goes with your website theme? We got you! Use the `customButton` property and pass down your own button component.

### Contributions are welcome!
If you come across any bugs or feature requests, please [open an issue](https://github.com/Suvink/linkedin-certification/issues) or send a pull request. I'm happy to improve this with your cool ideas!

## Help me more!
If you like this package, please consider buying me a coffee so that I can keep improving this even further! 
<a href="https://www.buymeacoffee.com/suvink" target="_blank"><img src="https://cdn.buymeacoffee.com/buttons/v2/default-yellow.png" alt="Buy Me A Coffee" style="height: 30px !important;width: 54px !important;" height="30"></a>

Thanks for reading folks! Happy coding!