# 16 side project GitHub repositories you may find useful
A Side Project is something you do aside from your main job to fuel your **passion** while learning something **new**. This quote is very close to my heart,
> In vain have you acquired knowledge if you have not imparted it to others.
With this in mind, let me share my learning from the side projects accomplished in the year 2020. The primary purpose of this article is to share the GitHub repositories with relevant details. Each of the repositories has a well-explained `readme.md` file to guide how to use the project.
All these projects are `open-source`. Feel free to try, fork, contribute, and I hope you find them useful.
# 1. theme-builder
This project helps you to create a `theming system`. Build a theme of your choice. You can also switch/test/apply the themes. You can extend the project easily for your need.
### 🚀 GitHub Repo
%[https://github.com/atapas/theme-builder]
### 🥡 What's inside?
- [Reactjs](https://reactjs.org/)
- [Styled-Components](https://styled-components.com/docs/basics)
- Any `data-store` of your choice.
# 2. notifyme
It is a `reactjs` based component available as a public npm to use. You can manage time-based notifications using it. It is capable of tracking incoming notifications, read/un-read them with many other customizations.
### 🚀 GitHub Repo
%[https://github.com/atapas/notifyme]
### 🥡 What's inside?
- [Reactjs](https://reactjs.org/)
- [NPM](https://www.npmjs.com/package/react-notification-timeline)
# 3. demolab
This is a `Jamstack` application to host all the demos in one place. Just supply the description of it in a `.md` file and your demo goes live on the site. Please Feel free to contribute ✋ to this project.
### 🚀 GitHub Repo
%[https://github.com/atapas/demolab]
### 🥡 What's inside?
- [Jamstack](https://jamstack.org/)
- [Gatsbyjs](https://www.gatsbyjs.org/tutorial/)
- [Netlify](https://www.netlify.com/)
# 4. princess-finder
It is a fun project created for Hashnode's #christmashackathon. A simple web app to recognize the Disney princess with confidence.
### 🚀 GitHub Repo
%[https://github.com/atapas/princess-finder]
### 🥡 What's inside?
- [Reactjs](https://reactjs.org/)
- [ml5.js](https://ml5js.org/)
- ML model created using the [Teachable Machine](https://teachablemachine.withgoogle.com/)
# 5. imaginary
It's a project to build a Jamstack image gallery. We learn to handle the media files at the build time.
### 🚀 GitHub Repo
%[https://github.com/atapas/imaginary]
### 🥡 What's inside?
- [Jamstack](https://jamstack.org/)
- [Gatsbyjs](https://www.gatsbyjs.org/tutorial/)
- [Cloudinary](https://cloudinary.com/)
# 6. html-tips-tricks
It is a repo to listing down `HTML5` features that I haven't used much in the past but find useful now.
### 🚀 GitHub Repo
%[https://github.com/atapas/html-tips-tricks]
### 🥡 What's inside?
- HTML5.
# 7. JS-Tips-Tricks
This repo lists the `JavaScript` tips and tricks I am learning every day!
### 🚀 GitHub Repo
%[https://github.com/atapas/js-tips-tricks]
### 🥡 What's inside?
- JavaScript.
# 8. react-add-table-dynamic-row
Adding a row dynamically to a table seems to be a very normal requirement. This repo shows how to do it using Reactjs Hooks.
### 🚀 GitHub Repo
%[https://github.com/atapas/react-add-table-dynamic-row]
### 🥡 What's inside?
- [Reactjs](https://reactjs.org/).
# 9. shopnote
A `Jamstack` application helps to create and manage your shopping notes. This project helps you to learn the power of serverless function and graphql.
### 🚀 GitHub Repo
%[https://github.com/atapas/shopnote]
### 🥡 What's inside?
- [Jamstack](https://jamstack.org/)
- [Gatsbyjs](https://www.gatsbyjs.org/tutorial/)
- [Fauna](http://fauna.com/)
- [Netlify Function](https://www.netlify.com/products/functions/)
- [GraphQL](https://graphql.org/)
# 10. add-copyright
Have you ever felt a need to automate adding a bunch of text at the top of your source files recursively? This repo contains an automation script to do that.
### 🚀 GitHub Repo
%[https://github.com/atapas/add-copyright]
### 🥡 What's inside?
- Shell Script.
- Automation
# 11. covid-19
In 2020 we hardly spoke of anything without mentioning COVID. Publicly available COVID data helped to learn about how things are going on around the world. This repo contains code for an app with lots of visualization and details about the pandemic. This app is being used by many in India today.
### 🚀 GitHub Repo
%[https://github.com/atapas/covid-19]
### 🥡 What's inside?
- [Reactjs](https://reactjs.org/)
- [Recharts](https://recharts.org/en-US/)
- Visualization
# 12. i18n-js-npm
This project is to help with `externalizing` and `internationalizing` strings of your web app. It is available as a public npm to download and use.
### 🚀 GitHub Repo
%[https://github.com/atapas/i18n-js-npm]
### 🥡 What's inside?
- JavaScript.
- NPM
# 13. html-file-upload
This repository contains the source code examples of useful `HTML File Upload` tips for Web Developers.
### 🚀 GitHub Repo
%[https://github.com/atapas/html-file-upload]
### 🥡 What's inside?
- JavaScript.
- HTML
# 14. catstore
A project to show-case how to build a Jamstack e-commerce application.
### 🚀 GitHub Repo
%[https://github.com/atapas/catstore]
### 🥡 What's inside?
- [Jamstack](https://jamstack.org/)
- [Gatsbyjs](https://www.gatsbyjs.org/tutorial/)
- [Netlify Function](https://www.netlify.com/products/functions/)
- [Stripe](https://stripe.com/en-in)
# 15. testimonial
A project to build a serverless app with authentication.
### 🚀 GitHub Repo
%[https://github.com/atapas/testimonial]
### 🥡 What's inside?
- [Jamstack](https://jamstack.org/)
- [Gatsbyjs](https://www.gatsbyjs.org/tutorial/)
- [Fauna](http://fauna.com/)
- [Netlify Function](https://www.netlify.com/products/functions/)
- [Netlify Auth](https://docs.netlify.com/visitor-access/identity/)
# 16. learn-css-animation
A repo to document my learning on the CSS animation with plenty of examples.
### 🚀 GitHub Repo
%[https://github.com/atapas/learn-css-animation]
### 🥡 What's inside?
- HTML.
- CSS
That's all for now. It was a fulfilling 2020 and looking forward to doing more this year. Please let me know if you find this post helpful. If you have any queries, please DM me on [Twitter(@tapasadhikary)](https://twitter.com/tapasadhikary). Also, feel free to follow me on [GitHub(atapas)](https://github.com/atapas) for project updates.
Before we end, I would like to leave you with a few reads on side projects. You may find these motivating. All the best with your upcoming side projects.
- [Why Side Projects are Important to Developers](https://lo-victoria.com/why-side-projects-are-important-to-developers) by @[Victoria Lo](@victoria)
- [How To Balance Your Job With Your Side Projects As A Developer](https://catalins.tech/how-to-balance-your-job-with-your-side-projects-as-a-developer) by @[Catalin Pit](@Catalinpit)
- [Don't just learn to code, learn to create](https://blog.rutikwankhade.dev/dont-just-learn-to-code-learn-to-create) by @[Rutik Wankhade](@rutikwankhade)
- [Why do you need to do Side Projects as A Developer?](https://blog.greenroots.info/why-do-you-need-to-do-side-projects-as-a-developer-ckhn5m5km05teajs1fvjd7u5f) by @[Tapas Adhikary](@atapas)
- [How to Launch a Side Project from Zero](https://sitepoint.hashnode.dev/how-to-launch-a-side-project-from-zero-cjznmdrs4001tcws1n2guubk3) by @[SitePoint](@sitepoint)
P.S. I love Coffee ☕. 