DEV Community

Cover image for Learn by Contributing

Learn by Contributing

Andrew Goldis on April 20, 2019

Contributing to open source projects helps you to improve your professional skills and discover new opportunities. Being a professional ...
Collapse
 
benrussert profile image
Ben Russert

Great write up. I couldn't agree more.

There just isn't any better way to learn than by solving real problems and working with others more experienced than you.

Not to mention the confidence you'll gain and the satisfaction you'll feel!

Collapse
 
agoldis profile image
Andrew Goldis

😀 thanks a lot Ben!

Collapse
 
jrc86 profile image
Jonas

I think a mentor helping out would be a good idea. Assigning issues, being hands on through the first couple of issues. Maybe even working on issues together. Would be a great way to assess skill level too.
I think that could be helpful.

Collapse
 
agoldis profile image
Andrew Goldis

Definitely! That's why I've mentioned the Good Squad meetup - I've had a great experience attending it!

Collapse
 
jrc86 profile image
Jonas

I've been thinking about organizing something similar in my town, but I feel like there wouldn't be much interest here.

Thread Thread
 
agoldis profile image
Andrew Goldis

What about a virtual event? May be that'd work

Thread Thread
 
jrc86 profile image
Jonas

That would be interesting, especially with live share extension for vscode/vs2019. This could actually for for mentoring too.

Thread Thread
 
agoldis profile image
Andrew Goldis

Oh, that's a cool idea to use live share! You can also stream on twitch or livecode.

The format I saw goes like this:

  • The organizer(s) discovers repositories that needs attention
  • The organizer(s) contacts the owners and asks to reserve few issues (+ mark with a label) for the event
  • The organizer(s) provides instructions for each project - how to setup, what's the issue and how to get started
  • The participants are assigned to issues (singles or pairs)
  • The participants submit PRs
  • Party, beers and happiness 🎉
Thread Thread
 
jrc86 profile image
Jonas

That sounds really interesting.

Collapse
 
brunorodrigues profile image
Bruno Rodrigues

I am a dev for many years now and I am currently on "analysis paralysis" to start contributing to OSS. Thanks for the links, they will help a lot! I'll start digging straight away!!

Have a good one! :)

Collapse
 
agoldis profile image
Andrew Goldis

Hey, thanks for the comment here! Wondering what "analysis paralysis" is :)

Collapse
 
brunorodrigues profile image
Bruno Rodrigues

From wikipedia :P

"Analysis paralysis describes a moment when over-analyzing or over-thinking a situation can cause it to become 'paralyzed', meaning that no action was taken therefore a solution is not reached."

I am always wishing to contribute but took no action since I am always trying to find the "best" repo to contribute and also there is a hidden fear of not being good enough... I code since I'm 13 though... I'm 29 now. People call this "The impostor syndrome"

Thread Thread
 
agoldis profile image
Andrew Goldis

oh, enhanced my vocabulary, thanks a lot! :)

Collapse
 
itsjzt profile image
Saurabh Sharma
Collapse
 
doomhammerng profile image
Piotr Gaczkowski

Great article, @agoldis ! I tried to approach the topic from a different angle at medium.freecodecamp.org/the-defini... . We seem to have some points in common, while we also mention separate ones.

I wonder: can you recommend any more good articles on contributing to Open Source?

Collapse
 
agoldis profile image
Andrew Goldis

Thank for reaching me! It is a great read what you've posted! Seems like you have mentioned few points on OSS that I didn't cover - that's great, readers can discover the various aspects of contribution to open source.

As for other articles, I can't quite remember... your post is great though! What do you say about posting references to our publications so readers could discover the content?

Collapse
 
doomhammerng profile image
Piotr Gaczkowski

Posting references looks like a great idea. Let's do it :)

Thread Thread
 
agoldis profile image
Andrew Goldis

Done! 🙌🏻

Thread Thread
 
doomhammerng profile image
Piotr Gaczkowski

Same here :)

Collapse
 
nickytonline profile image
Nick Taylor

I've really been enjoying contributing to open source and I definitely agree with you that even documentation is valuable to OSS.

I'm still feeling really good about my past week, so I'm just gonna drop this here as it relates to the post.

This week, I got a PR merged that I've been working on for quite a while for the Refined GitHub browser extension. Feels pretty good.

Enable strict-mode for TypeScript #1783

Basically going with the non-null assertion operator in almost all places, because as mentioned in github.com/sindresorhus/refined-gi..., the assumption with the extension is that the DOM nodes referenced in most cases are expected to be there. If they aren't, the extension breaks, a bug is filed and it's fixed.

One thing to note @bfred-it, is currently dom-chef types need to handle JSX (Element and IntrinsicElements) or we import @types/react.

In the process of working on that PR, I discovered a bug in the TypeScript types that ship with TypeScript.

Missing string indexer on NamedNodeMap interface in lib.dom.d.ts? #30928

For context, see github.com/sindresorhus/refined-gi..., specifically this commit, github.com/sindresorhus/refined-gi....

Also, just posting my tweet about this so that people can find discussions about the issue. See twitter.com/nickytonline/status/11...

I'll restate what I tweeted as I probably should have posted my question here originally.

The NamedNodeMap interface in lib.dom.ts does not allow for a string indexer, even though vanilla JS supports this in browsers, e.g. someDomElement.attribute['aria-label'].value.

We have code like this in the Refined GitHub extension, so for the time being, I've gone ahead via a declaration merge for NamedNodeMap

interface NamedNodeMap {
      [key: string]: Attr;
}

I can't tell from the MDN docs for NamedNodeMap if it's standard or not. All they seem to mention is "Attr nodes' indexes may differ among browsers" which wouldn't apply to access by the attribute name.

Just wondering if this was omitted by mistake or is it because this is not considered WHATWG DOM standard? I went to dom.spec.whatwg.org/#interface-nam... and unless I'm reading it incorrectly, I believe it states that using a string indexer is valid.

Thoughts? Happy to PR this up if it's valid.

And finally, I've made a few PRs to dev.to to get back in the swing of things of contributing there as well.

Fixed some frontend linting issues #2495

What type of PR is this? (check all applicable)

  • [x] Refactor
  • [ ] Feature
  • [ ] Bug Fix
  • [ ] Documentation Update

Description

Fixed some linting issues being reported in the frontend.

Related Tickets & Documents

#1828

Mobile & Desktop Screenshots/Recordings (if there are UI changes)

Added to documentation?

  • [ ] docs.dev.to
  • [ ] readme
  • [x] no documentation needed

[optional] What gif best describes this PR or how it makes you feel?

Richie Rich robot

Boom!






Collapse
 
agoldis profile image
Andrew Goldis

That's awesome!!! May be you can share a few tips about how to do what you have done successfully? E.g. how did you discover the problem and what did you do to isolate, solve and deliver the solution? What did you learn on the way?

Collapse
 
nickytonline profile image
Nick Taylor • Edited
  • I would say only work on stuff that you find interesting and challenging. Otherwise don't bother. You won't enjoy it.

  • When I first started learning react, I started contributing as a way of learning. I found a react boilerplate project, react-slingshot, and just started offering suggestions that became PRs, and also did bug fixes. Eventually I was asked to become a maintainer to which I said yes.

coryhouse / react-slingshot

React + Redux starter kit / boilerplate with Babel, hot reloading, testing, linting and a working example app built in


Build status: Linux Build status: Windows Dependency Status Coverage Status

A comprehensive starter kit for rapid application development using React.

Why Slingshot?

  1. One command to get started - Type npm start to start development in your default browser.
  2. Rapid feedback - Each time you hit save, changes hot reload and linting and automated tests run.
  3. One command line to check - All feedback is displayed on a single command line.
  4. No more JavaScript fatigue - Slingshot uses the most popular and powerful libraries for working with React.
  5. Working example app - The included example app shows how this all works together.
  6. Automated production build - Type npm run build to do all this:

React Slingshot Production Build

Get Started

  1. Initial Machine Setup

    First time running the starter kit? Then complete the Initial Machine Setup.

  2. Clone the project

    git clone https://github.com/coryhouse/react-slingshot.git.

  3. Run the setup script

    npm run setup

  4. Run the example app

    npm start -s

    This will run the automated build process, start…

Takeaway from this is open source is a great way to learn from others and if you contribute enough to a project, you may be asked to become a maintainer (if that's your jam).

  • In terms of problems/solutions, the more recent one I had while converting the Refined GitHub extension to TypeScript (TS), I had converted everything to TS, but webpack builds were failing. So initially, I tried some configuration changes in regards to webpack and the TS config, but no dice. I compiled each entry point from webpack directly with the TS compiler and they built fine, so clearly something was not right with webpack/TS situation.

At this point I started to debug webpack, specifically the ts-loader plugin. If you've never debugged webpack code, you can run the following command to get started with the debugger. node --inspect-brk ./node_modules/webpack/bin/webpack.js. I found the error that was being thrown from webpack in the code and put a breakpoint there. First I saw that the files weren't being generated. When I reran the debugger, this time I saw that a particular boolean was not set properly which was related to webpack/TS configuration. Once I fixed the configuration, I was good to go. Takeaways, use your tools. Also, I was probably tired at this point and probably missed the obvious misconfiguration. 🙃

Thread Thread
 
agoldis profile image
Andrew Goldis • Edited

Awesome!

  1. I started using refined-github :)
  2. Would you mind if I copy your comment to the article? It's very inspirational and a good showcase of real-world example
Thread Thread
 
nickytonline profile image
Nick Taylor

Sure, no problem.

Thread Thread
 
agoldis profile image
Andrew Goldis

👍🏻 thanks a lot!

Collapse
 
iam_stratos profile image
Stratos Iordanidis

Personally, I think it's hard to find open issues that are available to work with. Usually someone has already commented on an issue and sometimes didn't even deliver for months... 😢

Collapse
 
agoldis profile image
Andrew Goldis

Hey! Sorry to hear you find trouble finding issue to help with.

Did you try one of the tools mentioned to discover available issues?

Also, from my experience it's ok to take over an issue if someone is not getting it done in reasonable amount of time. As an alternative, you could, may be suggest your help in a comment.

Collapse
 
tcelestino profile image
Tiago Celestino • Edited

Great article, but I've missed about that problems in contribute OSS. An example, when the maintainers are rude or people in conversation aren't polite.

There are projects that you want write an issues or create a pull request but involved people in project don't accept arguments or simply ignore and deleting your contributions. It's frustrating because you want help it but you have fear to contribute.

Collapse
 
agoldis profile image
Andrew Goldis

Yeah, that's a good point! I wanted to focus on the positive part of OSS and how an individual can harness it for her / his own good.

Collapse
 
steelwolf180 profile image
Max Ong Zong Bao

Besides PR there's another way to contribute which is documentation which I think is much easier to do it instead of contributing code.

Collapse
 
agoldis profile image
Andrew Goldis

Totally agree! Every type of contribution counts! Good documentation is very valuable for every project.

Collapse
 
aleon1220 profile image
Andres Leon

Thank you I love the final URLs to get started and avoid reinventing the wheel or the annoying google ads to sell you something every time you search

Collapse
 
agoldis profile image
Andrew Goldis

Thanks for pointing out they are useful, I was in doubt about those links 😀

Collapse
 
anjesh1 profile image
anjesh1

I want to start how do I start?

Collapse
 
agoldis profile image
Andrew Goldis

You can use this cool tutorial to get started
github.com/firstcontributions/firs...

Collapse
 
marksmi94270630 profile image
Mark Smith

Thanks for sharing the URL.

Collapse
 
mshossain110 profile image
Shahadat Hossain

Thanks for sharing. Last fe month i am contributing in open source. Its feel awesome. Also I am learning more and more.

Collapse
 
agoldis profile image
Andrew Goldis

That's awesome! I hope you keep getting good experience with OSS!

Collapse
 
david19rp profile image
david

awesome! ty!

Collapse
 
dorothykiz1 profile image
dorothykiz1

Brilliant.This gets me wanting to contribute already

Collapse
 
elabftw profile image
eLabFTW

I was thinking about writing a very similar post! But yours is very complete and well made! Cheers :)

Collapse
 
agoldis profile image
Andrew Goldis

Thanks a lot for the feedback! If you have some observations / ideas that I have missed, please share!

Collapse
 
dilley_amanda profile image
future_coder2020

Hey Andrew,
I tried opening this link from your article, and got 404 error...
github.com/MunGell/awesome-for-beg...

Collapse
 
agoldis profile image
Andrew Goldis

Sorry, my bad. The link is
github.com/MunGell/awesome-for-beg...