https://github.com/thehaseebahmed/js-hashnode-widget
A very simple but responsive widget for loading blog posts from Hashnode in your personal website.
https://github.com/thehaseebahmed/js-hashnode-widget
hashnode hashnode-api hashnode-blog hashnode-blogs
Last synced: 10 days ago
JSON representation
A very simple but responsive widget for loading blog posts from Hashnode in your personal website.
- Host: GitHub
- URL: https://github.com/thehaseebahmed/js-hashnode-widget
- Owner: thehaseebahmed
- License: mit
- Created: 2022-06-10T22:01:52.000Z (almost 4 years ago)
- Default Branch: main
- Last Pushed: 2022-06-12T09:22:53.000Z (almost 4 years ago)
- Last Synced: 2025-11-27T11:57:27.978Z (6 months ago)
- Topics: hashnode, hashnode-api, hashnode-blog, hashnode-blogs
- Language: TypeScript
- Homepage: https://tha-hashnode-widget.stackblitz.io
- Size: 640 KB
- Stars: 1
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
[![Contributors][contributors-shield]][contributors-url]
[![Forks][forks-shield]][forks-url]
[![Stargazers][stars-shield]][stars-url]
[![Issues][issues-shield]][issues-url]
[![MIT License][license-shield]][license-url]
[![LinkedIn][linkedin-shield]][linkedin-url]
Hashnode Widget
A very simple but responsive widget for loading blog posts from Hashnode in your personal website.
View Demo
·
Report Bug
·
Request Feature
Table of Contents
## About The Project
![Product Name Screen Shot][product-screenshot]
I wanted to embed my latest blog posts from my Hashnode blog to my personal website but unfortunately I could not find a plugin to do so. This seemed like something that other could benefit from as well therefore I went ahead and created one!
### Built With
This project uses the following set of frameworks/libraries:
- [TypeScript](https://www.typescriptlang.org/)
## Getting Started
To get a local copy up and running follow these simple example steps.
### Prerequisites
- Node JS
You can download and install the lastest version from the [official website](https://nodejs.org/en/).
### Development Server
1. Clone the repo
```sh
git clone https://github.com/thehaseebahmed/js-hashnode-widget
```
2. Install NPM packages
```sh
npm install
```
3. Start the dev compiler
```sh
npm run dev
```
4. In a new tab (or window), start the local web server
```sh
npm run serve
```
### Production Build
1. Clone the repo
```sh
git clone https://github.com/thehaseebahmed/js-hashnode-widget
```
2. Install NPM packages
```sh
npm install
```
3. Create the build
```sh
npm run build:prod
```
## Usage
I'm in process of publishing this to NPM and getting this hosted with CDN JS, as soon as that process is complete, I'll update the usage information here.
## Contributing
Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are **greatly appreciated**.
If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement".
Don't forget to give the project a star! Thanks again!
1. Fork the Project
2. Create your Feature Branch (`git checkout -b yourUsername/my-amazing-feature`)
3. Commit your Changes (`git commit -m 'Added an amazing feature'`)
4. Push to the Branch (`git push origin yourUsername/my-amazing-feature`)
5. Open a Pull Request
## License
Distributed under the MIT License. See `LICENSE.txt` for more information.
## Contact
Haseeb Ahmed - [@thehaseebahm3d](https://twitter.com/thehaseebahm3d) - thehaseebahmed@outlook.com
Project Link: [https://github.com/thehaseebahmed/js-hashnode-widget](https://github.com/thehaseebahmed/js-hashnode-widget)
## Acknowledgments
Here are a few resources that I found helpful during the development of this plugin and would like to give credit to.
- [Hashnode API - How To Display Your Blog Articles On Your Portfolio Page](https://catalins.tech/hashnode-api-how-to-display-your-blog-articles-on-your-portfolio-page)
[contributors-shield]: https://img.shields.io/github/contributors/thehaseebahmed/js-hashnode-widget.svg?style=for-the-badge
[contributors-url]: https://github.com/thehaseebahmed/js-hashnode-widget/graphs/contributors
[forks-shield]: https://img.shields.io/github/forks/thehaseebahmed/js-hashnode-widget.svg?style=for-the-badge
[forks-url]: https://github.com/thehaseebahmed/js-hashnode-widget/network/members
[stars-shield]: https://img.shields.io/github/stars/thehaseebahmed/js-hashnode-widget.svg?style=for-the-badge
[stars-url]: https://github.com/thehaseebahmed/js-hashnode-widget/stargazers
[issues-shield]: https://img.shields.io/github/issues/thehaseebahmed/js-hashnode-widget.svg?style=for-the-badge
[issues-url]: https://github.com/thehaseebahmed/js-hashnode-widget/issues
[license-shield]: https://img.shields.io/github/license/thehaseebahmed/js-hashnode-widget.svg?style=for-the-badge
[license-url]: https://github.com/thehaseebahmed/js-hashnode-widget/blob/master/LICENSE.txt
[linkedin-shield]: https://img.shields.io/badge/-LinkedIn-black.svg?style=for-the-badge&logo=linkedin&colorB=555
[linkedin-url]: https://linkedin.com/in/thehaseebahmed
[product-screenshot]: ./docs/screenshot.png