To Contribute to Open-Source is ... Happiness - My First Busy.Org Development Contribution by eastmael

View this thread on steempeak.com
· @eastmael · (edited)
$16.80
To Contribute to Open-Source is ... Happiness - My First Busy.Org Development Contribution
<center>![pexels-photo-558375.jpeg](https://res.cloudinary.com/hpiynhbhq/image/upload/v1508735510/usxzxy2ztrlyir1sy6tx.jpg)</center>

I've been benefiting from the open-source community since I started using Eclipse since 2003. And I have always wanted to contribute to one, but never found the project I can immediately contribute to.

Steemit and busy.org changed that for me. And with utopian.io, things are starting coming together.

In this post, let me share with you my very first Development Contribution to the open-source community. 

## Why busy.org? Why not Steemit.com?

Well, firstly, busy.org was the first platform that I saw I can make an immediate impact. And that was for the Filipino translation of the UI as mentioned in my [previous post](https://steemit.com/utopian-io/@eastmael/contribution-to-busy-org-s-filipino-translation).

Secondly, I am not familiar with the technology used for Steemit.com.

And lastly, I'm more familiar with the technology used for busy.org - JavaScript and Node.js.

## 1. The Story Behind the Bug

<div class="pull-left">

![](https://user-images.githubusercontent.com/16621517/31648828-238ac6ca-b310-11e7-94dc-2fc0a6057e19.png)

</div>

The issue I tried to fix was [issue #826](https://github.com/busyorg/busy/issues/826). It was an issue regarding insufficient spacing between text (i.e., a paragraph) and an image immediately following it. 

The image on the left is the actual image used in the issue report.

<br/>

## 2. The Failure

Before proceeding with the actual solution, let me just share with you a failure I encountered before I was able to successfully contribute. It was a pull request (PR) I also submitted to the same project, but I was not able to provide a sufficient fix. And that fix is included in this closed PR - [PR#799 Set left and right margins to 0 for .Body pre; set width to 96%](https://github.com/busyorg/busy/pull/799).

### 2.1. What Failed?

<div class="pull-right">

![image.png](https://res.cloudinary.com/hpiynhbhq/image/upload/v1508733388/pbzzhb21wn2syqrkjokf.png)

</div>

Although I was able to fix the display issue in my browser, further testing revealed that the fix was insufficient for smaller devices. See this comment by @Sekhmet in my PR.

> Looks like this still overflows on smaller screens:
> ...
> We should find a way to make this work well on different screen sizes.

### 2.2. What I Learned

> It's not enough that you've fixed the bug from what you see, it's important that others look at it in perspectives you've failed to look at.

## 3. My Solution

With this lesson in mind, I proposed a fix that could address the issue without the fix being rejected by providing supporting reference. 

The fix was to [add a `20px` margin to the top of a `.Body img` tag](https://github.com/busyorg/busy/pull/882). 

<div class="pull-left">

![](https://user-images.githubusercontent.com/29425738/31859630-ee471970-b740-11e7-81cd-b16ae5a65ee8.png)

</div>

<div class="pull-right">

![](https://user-images.githubusercontent.com/29425738/31859636-01a3d1c0-b741-11e7-8c96-5e613686ebc1.png)

</div>

***

The image on the left is the post before the fix, and the image on the right is the post including the fix.

### 3.1. The Code

<div class="pull-right">

![image.png](https://res.cloudinary.com/hpiynhbhq/image/upload/v1508734297/uzkp7tcxeqconx9ots7p.png)

</div>

The image on the right shows the code included in the PR and that the code was merged into the branch `busyorg:new-design.`


*** 

### 3.2. My Development Environment

As I've mentioned, this is my first time contributing to an open-source project, as such, forks were new to me. Although I have forked other projects before, I have not made any developmental changes to them as such did not create any pull requests.


#### 3.2.1. The Fork

The fork I used to code the fix is in my [own fork](https://github.com/eastmaels/busy).

The `ssh` git URL is `git@github.com:eastmaels/busy.git`.

#### 3.2.2. The Branch

I created my own branch [`bugfix/add-space-before-image`](https://github.com/eastmaels/busy/commits/bugfix/add-space-before-image) and it was where I pushed my commit.

#### 3.2.3. The Commit

My commit was given the hash [`94a3271`](https://github.com/eastmaels/busy/commit/94a327194efa66cf8700be4872cccddae9cdc887).

#### 3.2.4. The PR

My PR was [PR#882](https://github.com/busyorg/busy/pull/882/files) in the official busy.org/busy git project.

## 4. Others

### 4.1. Setup

This was tested on my local environment using the setup mentioned in the README.md in github.

```
git clone https://github.com/busyorg/busy.git
cd busy
```

```
npm install
npm run dev-server
```

### 4.2. Test Environment

* Machine: Lenovo T450
* Technology Stack: Node.js, npm, javascript, css
* Browser: Chrome

<center>![](https://steemitimages.com/0x0/https://steemitimages.com/DQmZGnTyrW2uE8ap6dMSAUPbAg9N1XivD9An3ZfVK5yKmZf/eastmaeL.png)</center>

Image Source: [[1]](https://www.pexels.com/photo/adult-auto-automobile-automotive-558375/)
<br /><hr/><em>Open Source Contribution posted via https://utopian.io</em><hr/>
👍  , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , and 3 others
properties (23)
post_id15,903,337
authoreastmael
permlinkto-contribute-to-open-source-is-happiness-my-first-busy-org-development-contribution
categoryutopian-io
json_metadata"{"type": "development", "repository": {"id": 64382195, "watchers": 96, "events_url": "https://api.github.com/repos/busyorg/busy/events", "forks": 28, "name": "busy", "issues_url": "https://api.github.com/repos/busyorg/busy/issues{/number}", "trees_url": "https://api.github.com/repos/busyorg/busy/git/trees{/sha}", "fork": false, "git_url": "git://github.com/busyorg/busy.git", "assignees_url": "https://api.github.com/repos/busyorg/busy/assignees{/user}", "size": 59158, "owner": {"id": 25360286, "following_url": "https://api.github.com/users/busyorg/following{/other_user}", "starred_url": "https://api.github.com/users/busyorg/starred{/owner}{/repo}", "subscriptions_url": "https://api.github.com/users/busyorg/subscriptions", "repos_url": "https://api.github.com/users/busyorg/repos", "login": "busyorg", "gists_url": "https://api.github.com/users/busyorg/gists{/gist_id}", "followers_url": "https://api.github.com/users/busyorg/followers", "received_events_url": "https://api.github.com/users/busyorg/received_events", "type": "Organization", "avatar_url": "https://avatars0.githubusercontent.com/u/25360286?v=4", "site_admin": false, "organizations_url": "https://api.github.com/users/busyorg/orgs", "gravatar_id": "", "events_url": "https://api.github.com/users/busyorg/events{/privacy}", "url": "https://api.github.com/users/busyorg", "html_url": "https://github.com/busyorg"}, "forks_count": 28, "git_refs_url": "https://api.github.com/repos/busyorg/busy/git/refs{/sha}", "blobs_url": "https://api.github.com/repos/busyorg/busy/git/blobs{/sha}", "pushed_at": "2017-10-22T20:21:02Z", "watchers_count": 96, "teams_url": "https://api.github.com/repos/busyorg/busy/teams", "comments_url": "https://api.github.com/repos/busyorg/busy/comments{/number}", "archived": false, "svn_url": "https://github.com/busyorg/busy", "merges_url": "https://api.github.com/repos/busyorg/busy/merges", "subscribers_url": "https://api.github.com/repos/busyorg/busy/subscribers", "issue_events_url": "https://api.github.com/repos/busyorg/busy/issues/events{/number}", "stargazers_url": "https://api.github.com/repos/busyorg/busy/stargazers", "mirror_url": null, "statuses_url": "https://api.github.com/repos/busyorg/busy/statuses/{sha}", "has_projects": true, "milestones_url": "https://api.github.com/repos/busyorg/busy/milestones{/number}", "description": "Blockchain-based social network where anyone can earn rewards \ud83d\ude80", "keys_url": "https://api.github.com/repos/busyorg/busy/keys{/key_id}", "open_issues": 65, "compare_url": "https://api.github.com/repos/busyorg/busy/compare/{base}...{head}", "ssh_url": "git@github.com:busyorg/busy.git", "html_url": "https://github.com/busyorg/busy", "commits_url": "https://api.github.com/repos/busyorg/busy/commits{/sha}", "open_issues_count": 65, "stargazers_count": 96, "branches_url": "https://api.github.com/repos/busyorg/busy/branches{/branch}", "full_name": "busyorg/busy", "forks_url": "https://api.github.com/repos/busyorg/busy/forks", "score": 66.5828, "deployments_url": "https://api.github.com/repos/busyorg/busy/deployments", "contributors_url": "https://api.github.com/repos/busyorg/busy/contributors", "homepage": "https://busy.org/", "contents_url": "https://api.github.com/repos/busyorg/busy/contents/{+path}", "has_downloads": true, "collaborators_url": "https://api.github.com/repos/busyorg/busy/collaborators{/collaborator}", "created_at": "2016-07-28T09:27:04Z", "git_commits_url": "https://api.github.com/repos/busyorg/busy/git/commits{/sha}", "releases_url": "https://api.github.com/repos/busyorg/busy/releases{/id}", "private": false, "pulls_url": "https://api.github.com/repos/busyorg/busy/pulls{/number}", "git_tags_url": "https://api.github.com/repos/busyorg/busy/git/tags{/sha}", "notifications_url": "https://api.github.com/repos/busyorg/busy/notifications{?since,all,participating}", "language": "JavaScript", "updated_at": "2017-10-21T22:26:07Z", "has_wiki": true, "downloads_url": "https://api.github.com/repos/busyorg/busy/downloads", "hooks_url": "https://api.github.com/repos/busyorg/busy/hooks", "languages_url": "https://api.github.com/repos/busyorg/busy/languages", "default_branch": "new-design", "labels_url": "https://api.github.com/repos/busyorg/busy/labels{/name}", "url": "https://api.github.com/repos/busyorg/busy", "has_pages": false, "tags_url": "https://api.github.com/repos/busyorg/busy/tags", "clone_url": "https://github.com/busyorg/busy.git", "archive_url": "https://api.github.com/repos/busyorg/busy/{archive_format}{/ref}", "has_issues": true, "issue_comment_url": "https://api.github.com/repos/busyorg/busy/issues/comments{/number}", "subscription_url": "https://api.github.com/repos/busyorg/busy/subscription"}, "format": "markdown", "image": ["https://res.cloudinary.com/hpiynhbhq/image/upload/v1508735510/usxzxy2ztrlyir1sy6tx.jpg"], "links": ["https://steemit.com/utopian-io/@eastmael/contribution-to-busy-org-s-filipino-translation", "https://github.com/busyorg/busy/issues/826", "https://github.com/busyorg/busy/pull/799", "https://github.com/busyorg/busy/pull/882", "https://github.com/eastmaels/busy", "https://github.com/eastmaels/busy/commits/bugfix/add-space-before-image", "https://github.com/eastmaels/busy/commit/94a327194efa66cf8700be4872cccddae9cdc887", "https://github.com/busyorg/busy/pull/882/files", "https://www.pexels.com/photo/adult-auto-automobile-automotive-558375/", "https://utopian.io"], "platform": "github", "app": "steemit/0.1", "tags": ["utopian-io", "philippines", "busy"], "community": "utopian", "users": ["sekhmet"]}"
created2017-10-23 05:13:30
last_update2017-10-23 06:53:09
depth0
children9
net_rshares8,802,925,035,069
last_payout2017-10-30 05:13:30
cashout_time1969-12-31 23:59:59
total_payout_value12.390 SBD
curator_payout_value4.414 SBD
pending_payout_value0.000 SBD
promoted0.000 SBD
body_length5,093
author_reputation51,681,288,563,260
root_title"To Contribute to Open-Source is ... Happiness - My First Busy.Org Development Contribution"
beneficiaries
0.
accountcryptoctopus
weight95
1.
accountelear
weight285
2.
accountfreedom
weight924
3.
accountfurion
weight43
4.
accountjavybar
weight38
5.
accountjohnsmith
weight152
6.
accounttransisto
weight495
7.
accountxeldal
weight154
max_accepted_payout1,000,000.000 SBD
percent_steem_dollars0
author_curate_reward""
vote details (67)
@bestbuy.com ·
http://i.imgur.com/0L71kDM.png
This post was resteemed by @steemitrobot!
Good Luck!

> **Resteem your post just send 0.100 SBD or Steem with your post url on memo. We have over 2700+ followers. Take our service to reach more People.**

> **Pro Plan: just send 1 SBD or Steem with your post url on memo we will resteem your post and send 10 upvotes from our Associate Accounts.**

The @steemitrobot users are a small but growing community.
Check out the other resteemed posts in steemitrobot's feed.
Some of them are truly great. Please upvote this comment for helping me grow.
👎  
properties (23)
post_id15,903,371
authorbestbuy.com
permlinkre-eastmael-to-contribute-to-open-source-is-happiness-my-first-busy-org-development-contribution-20171023t051427188z
categoryutopian-io
json_metadata"{"app": "busy/1.0.0", "tags": ["utopian-io"]}"
created2017-10-23 05:14:27
last_update2017-10-23 05:14:27
depth1
children0
net_rshares-6,115,709,012
last_payout2017-10-30 05:14:27
cashout_time1969-12-31 23:59:59
total_payout_value0.000 SBD
curator_payout_value0.000 SBD
pending_payout_value0.000 SBD
promoted0.000 SBD
body_length576
author_reputation-853,318,401,451
root_title"To Contribute to Open-Source is ... Happiness - My First Busy.Org Development Contribution"
beneficiaries[]
max_accepted_payout1,000,000.000 SBD
percent_steem_dollars10,000
author_curate_reward""
vote details (1)
@therealwolf ·
Wolfs Voting Bot found High Quality Content from @eastmael!
Wolf's Voting Bot checking in for @eastmael !

You earned yourself a 0.3$ upvote!

https://media.giphy.com/media/s2qXK8wAvkHTO/giphy.gif

*PS: You can earn 30% Vote-Cashback by upvoting this comment and all other post/comments by @therealwolf*

Checkout: http://steem.link/introduction-wolfs-voting-bot
👍  
properties (23)
post_id15,903,381
authortherealwolf
permlinkwolf-1508735682219000
categoryutopian-io
json_metadata{}
created2017-10-23 05:14:42
last_update2017-10-23 05:14:42
depth1
children0
net_rshares5,601,798,612
last_payout2017-10-30 05:14:42
cashout_time1969-12-31 23:59:59
total_payout_value0.000 SBD
curator_payout_value0.000 SBD
pending_payout_value0.000 SBD
promoted0.000 SBD
body_length302
author_reputation371,535,229,097,172
root_title"To Contribute to Open-Source is ... Happiness - My First Busy.Org Development Contribution"
beneficiaries[]
max_accepted_payout1,000,000.000 SBD
percent_steem_dollars10,000
author_curate_reward""
vote details (1)
@utopian-io ·
### Hey @eastmael I am @utopian-io. I have just super-voted you at 32% Power!
#### Achievements
-You are writing more than the average for this category. Good job!
-You are using more images than the average for this category. Great!
**Up-vote this comment to grow my power and help Open Source contributions like this one.**
👍  
properties (23)
post_id15,916,846
authorutopian-io
permlinkre-eastmael-to-contribute-to-open-source-is-happiness-my-first-busy-org-development-contribution-20171023t100109146z
categoryutopian-io
json_metadata"{"app": "utopian/1.0.0", "community": "utopian", "tags": ["utopian-io"]}"
created2017-10-23 10:01:09
last_update2017-10-23 10:01:09
depth1
children1
net_rshares5,708,839,350
last_payout2017-10-30 10:01:09
cashout_time1969-12-31 23:59:59
total_payout_value0.000 SBD
curator_payout_value0.000 SBD
pending_payout_value0.000 SBD
promoted0.000 SBD
body_length325
author_reputation152,913,012,544,965
root_title"To Contribute to Open-Source is ... Happiness - My First Busy.Org Development Contribution"
beneficiaries[]
max_accepted_payout1,000,000.000 SBD
percent_steem_dollars10,000
author_curate_reward""
vote details (1)
@eastmael ·
Thank you @utopian-io. I support you in this endeavor.
properties (22)
post_id15,916,948
authoreastmael
permlinkre-utopian-io-re-eastmael-to-contribute-to-open-source-is-happiness-my-first-busy-org-development-contribution-20171023t100308281z
categoryutopian-io
json_metadata"{"app": "steemit/0.1", "users": ["utopian-io"], "tags": ["utopian-io"]}"
created2017-10-23 10:03:15
last_update2017-10-23 10:03:15
depth2
children0
net_rshares0
last_payout2017-10-30 10:03:15
cashout_time1969-12-31 23:59:59
total_payout_value0.000 SBD
curator_payout_value0.000 SBD
pending_payout_value0.000 SBD
promoted0.000 SBD
body_length54
author_reputation51,681,288,563,260
root_title"To Contribute to Open-Source is ... Happiness - My First Busy.Org Development Contribution"
beneficiaries[]
max_accepted_payout1,000,000.000 SBD
percent_steem_dollars10,000
@espoem ·
Hi, can you look at it again? It appears that this might have brought additional space where it wasn't needed. https://github.com/busyorg/busy/issues/892
👍  
properties (23)
post_id15,946,370
authorespoem
permlinkre-eastmael-to-contribute-to-open-source-is-happiness-my-first-busy-org-development-contribution-20171023t205744378z
categoryutopian-io
json_metadata"{"app": "busy/2.0.0", "community": "busy", "tags": ["utopian-io"]}"
created2017-10-23 20:57:45
last_update2017-10-23 20:57:45
depth1
children1
net_rshares6,389,327,389
last_payout2017-10-30 20:57:45
cashout_time1969-12-31 23:59:59
total_payout_value0.000 SBD
curator_payout_value0.000 SBD
pending_payout_value0.000 SBD
promoted0.000 SBD
body_length153
author_reputation59,186,440,518,630
root_title"To Contribute to Open-Source is ... Happiness - My First Busy.Org Development Contribution"
beneficiaries[]
max_accepted_payout1,000,000.000 SBD
percent_steem_dollars10,000
author_curate_reward""
vote details (1)
@eastmael ·
Thanks for the heads up. Will do.
properties (22)
post_id15,968,412
authoreastmael
permlinkre-espoem-re-eastmael-to-contribute-to-open-source-is-happiness-my-first-busy-org-development-contribution-20171024t052212435z
categoryutopian-io
json_metadata"{"app": "steemit/0.1", "tags": ["utopian-io"]}"
created2017-10-24 05:22:12
last_update2017-10-24 05:22:12
depth2
children0
net_rshares0
last_payout2017-10-31 05:22:12
cashout_time1969-12-31 23:59:59
total_payout_value0.000 SBD
curator_payout_value0.000 SBD
pending_payout_value0.000 SBD
promoted0.000 SBD
body_length33
author_reputation51,681,288,563,260
root_title"To Contribute to Open-Source is ... Happiness - My First Busy.Org Development Contribution"
beneficiaries[]
max_accepted_payout1,000,000.000 SBD
percent_steem_dollars10,000
@kcire ·
Smile my friend @eastmael for you got my vote 😊. Very nice article.
👍  
properties (23)
post_id15,949,891
authorkcire
permlinkre-eastmael-to-contribute-to-open-source-is-happiness-my-first-busy-org-development-contribution-20171023t221217330z
categoryutopian-io
json_metadata"{"app": "steemit/0.1", "users": ["eastmael"], "tags": ["utopian-io"]}"
created2017-10-23 22:12:24
last_update2017-10-23 22:12:24
depth1
children1
net_rshares6,497,621,074
last_payout2017-10-30 22:12:24
cashout_time1969-12-31 23:59:59
total_payout_value0.000 SBD
curator_payout_value0.000 SBD
pending_payout_value0.000 SBD
promoted0.000 SBD
body_length67
author_reputation1,634,305,842,723
root_title"To Contribute to Open-Source is ... Happiness - My First Busy.Org Development Contribution"
beneficiaries[]
max_accepted_payout1,000,000.000 SBD
percent_steem_dollars10,000
author_curate_reward""
vote details (1)
@eastmael ·
Thanks @kcire. :)
properties (22)
post_id15,968,385
authoreastmael
permlinkre-kcire-re-eastmael-to-contribute-to-open-source-is-happiness-my-first-busy-org-development-contribution-20171024t052133203z
categoryutopian-io
json_metadata"{"app": "steemit/0.1", "users": ["kcire"], "tags": ["utopian-io"]}"
created2017-10-24 05:21:36
last_update2017-10-24 05:21:36
depth2
children0
net_rshares0
last_payout2017-10-31 05:21:36
cashout_time1969-12-31 23:59:59
total_payout_value0.000 SBD
curator_payout_value0.000 SBD
pending_payout_value0.000 SBD
promoted0.000 SBD
body_length17
author_reputation51,681,288,563,260
root_title"To Contribute to Open-Source is ... Happiness - My First Busy.Org Development Contribution"
beneficiaries[]
max_accepted_payout1,000,000.000 SBD
percent_steem_dollars10,000
@zararina ·
You contributions will really matter, keep it up. :)
properties (22)
post_id16,170,302
authorzararina
permlinkre-eastmael-to-contribute-to-open-source-is-happiness-my-first-busy-org-development-contribution-20171027t024453969z
categoryutopian-io
json_metadata"{"app": "steemit/0.1", "tags": ["utopian-io"]}"
created2017-10-27 02:44:06
last_update2017-10-27 02:44:06
depth1
children0
net_rshares0
last_payout2017-11-03 02:44:06
cashout_time1969-12-31 23:59:59
total_payout_value0.000 SBD
curator_payout_value0.000 SBD
pending_payout_value0.000 SBD
promoted0.000 SBD
body_length52
author_reputation29,739,477,452,346
root_title"To Contribute to Open-Source is ... Happiness - My First Busy.Org Development Contribution"
beneficiaries[]
max_accepted_payout1,000,000.000 SBD
percent_steem_dollars10,000