Code and Non-Code Contribution Repositories for Hacktoberfest
Tags: opensource, hacktoberfest, javascript, beginners
Published: 2022-10-03 11:40:55

## Introduction

Hacktoberfest has already begun this month. It is a month-long event where beginners learn to contribute to the Open Source project. It is a celebration of new developers and open source. You can win free swags just by completing the task of merging 4 PRs by the maintainer of the repository. You can register for the event through https://hacktoberfest.com.

I was also a beginner in tech when starting out at Hacktoberfest. But I learned a lot of things regarding Open Source and the steps to follow while contributing to open source projects on GitHub. I have written an article about it, you can use it while making any contribution. Here is the article: [How to contribute to an Open Source project as a Beginner - The Flow](https://surajondev.com/2022/07/15/how-to-contribute-to-an-open-source-project-as-a-beginner-the-flow/)

I have listed down some of the best repositories to contribute to as a newbie in Hacktoberfest. This repository can take code and non-code contributions. The below repositories are managed by me. So, If you have any doubt regarding anything, you can contact me on Twitter([@surajondev](https://twitter.com/surajondev)).

So, let's begin with the list. 

---

## [surajondev/JavaScript](https://github.com/surajondev/JavaScript)

> From Basic to Advance JavaScript Project

![surajondev/JavaScript](https://cdn.hashnode.com/res/hashnode/image/upload/v1664781252574/7o-cUdekm.png)

**Contribution Type:** Code 

The repository contains a list of the JavaScript project from beginner level to advance. It was made to add a web development project that has HTML, CSS, and JavaScript as the core file. 

**Contribution:**
- Add more JavaScript Project
- Work on other issues

You can find project ideas from [100+ JavaScript Projects for Beginners!](https://jsbeginners.com/javascript-projects-for-beginners/)

---

## [surajondev/UI-UX-Design](https://github.com/surajondev/UI-UX-Design)

> Different CSS Components

![surajondev/UI-UX-Design](https://cdn.hashnode.com/res/hashnode/image/upload/v1664781666957/-NNUrsFL6.png)

**Contribution Type:** Code 

The repository contains different CSS components such as Button, Nav Bar, Card, Form, and other such modern components. You just need to add HTML and CSS files for the components.

**Contribution:**
- Improve the Layout of the website
- Add more components

You can find inspiration for components from [UI Design Daily](https://uidesigndaily.com/).

---

## [surajondev/awesome-web3.0](https://github.com/surajondev/awesome-web3.0)

> A collection of awesome resources to learn Web 3.0🚀

![surajondev/awesome-web3.0](https://cdn.hashnode.com/res/hashnode/image/upload/v1664782064814/qiXZcurE_.png)

**Contribution Type:** Non-Code 

The repository has some awesome resources to learn and ace in web3. The resources are well categorized. 

**Contribution:**
- Add more resources in the already created categories
- Add your own category and resource to it

---

## [surajondev/get-weather](https://github.com/surajondev/get-weather)

> Get weather website run using react framework. OpenWeather API is used to fetch information.

![surajondev/get-weather](https://cdn.hashnode.com/res/hashnode/image/upload/v1664782569948/Bbe-vOX3P.png)

**Contribution Type:** Code

It is a weather app made with ReactJS. It was from my initial days in web development. So, there are a lot of things to contribute to this repository. I have used the OpenWeather API for fetching weather data. 

**Contribution:**
- Improve the Layout of the website
- Add more details
- Improve Cards that show details
- Better Color Combination for Website
- Dark and Light Mode

---

## [surajondev/CSS-Animation-Ride](https://github.com/surajondev/CSS-Animation-Ride)

> Add CSS Animation without any animation library

![github.com_surajondev_CSS-Animation-Ride.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1664783570706/pknJ3FZGQ.png)

**Contribution Type:** Code & Non-Code

This repository is at a very early stage, I even haven't added the Readme file. So, there are a lot of contributions needed in this repo. You can add your animation using CSS in the root directory. 

**Contribution:**
- Add more animation
- Add Readme file
- Improve Documentation

You can take inspiration from [77 CSS Animation Examples](https://freefrontend.com/css-animation-examples/).

---

## Connect with Me

- [Twitter](https://twitter.com/surajondev)
- [LinkedIn](https://www.linkedin.com/in/surajondev/)

## Conclusion

I hope, these repositories will be perfect for you to contribute in open source as beginners. You can gain a lot of experience and knowledge by contributing. 

Give a start, if possible to these repositories. Thanks for reading the blog post.