Flutter App + Hashnode API (App Presentation).
Tags: flutter, samueladekunle, android, devlive
Published: 2021-01-24 11:54:27

Hello everyone and welcome to a brand new tutorial series on Flutter. Today we’re going to be walking through how to integrating hashnode API into our flutter application.

## Let's get started
So actually, I built this app during the #christmashackathon challenge then but I was just too busy to come up with a write-up and the app presentation to publish on hashnode but there is another challenge now  [#VercelHashnode](http://hashnode.com/n/vercelhashnode).

{% youtube bizhTecIegc %}

![WhatsApp Image 2021-01-08 at 8.22.16 PM_iphone12black_portrait.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1610134428735/fmkd5qPWF.png)



# How to check the app

For Android Users
Available on play store →  [Hashnode: unofficial app made with flutter.](https://play.google.com/store/apps/details?id=com.acctgen1.hashnode) 

For iOS Users,
I don't have an apple store account, so you can check out the source code below or the android version.

**Source code! 👇 Show some ❤️ by starring ⭐ the repo and do follow me 😄!**

{% github acctgen1/flutter-app-hashnode-API no-readme %}

In this article, I will just walk you through how the app was built.

First, head over to hashnode API doc -->  [Hashnode API](https://api.hashnode.com/) 

![Screenshot 2021-01-06 124641.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1609933642806/cjA28mSic.png)

So in the query box just send the request you need starting with a {}
Example: {storiesFeed(type:NEW){title,coverImage,slug,replyCount}} then press the play button to get response.


![Screenshot 2021-01-06 124841.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1609933764862/LOIvSLrvs.png)

Has you can see in the example above we specify to only receive title, coverImage, slug, replyCount but there are many other requests you can send. A trick for windows users just press CRT + Space you will see a list of available requests.
Read more on how to use the API via the docs at the right-hand side.

After you have gotten the response you want, just convert the json to dart and use the model in your flutter application by sending the request to the URL and that's all.

If you want a full article/tutorial on how to call API in flutter or a complete series on how this app was built kindly leave a comment below. Thanks

I hope you have learned something, kindly press the clap button as many time you want if you enjoy it, and feel free to ask a question. Thanks for reading.

Thanks to @[Piyush Sinha](https://hashnode.com/@sinhapiyush) for his article on the Chrome extension, it helped me to realize @[Hashnode](https://hashnode.com/@hashnode) has an API.

Join Flutter Developer's Community:  [Telegram](https://t.me/flutterdevsgroup) |  [Facebook](https://www.facebook.com/groups/flutterdevsgroup/) |  [WhatsApp ](https://chat.whatsapp.com/FxD3bp4jVB21PlnGHve0SY) | [Signal](https://signal.group/#CjQKILccbSu9GnMF_qVrkdCFVQ_i2gmnigPDvweCy86JGpL3EhBg39kp1rftGQgZDYXLty7t)

Let’s connect with each other online: [Github](https://github.com/acctgen1), [Twitter](https://twitter.com/iamsamadekunle), [Youtube](https://www.youtube.com/channel/UCRYjIF5HAXc9m52rC6dmOCQ), [WhatsApp](https://wa.me/message/JLGQNNTPG64IH1), [LinkedIn](https://linkedin.com/in/acctgen1). 

{% medium https://acctgen1.medium.com/flutter-app-hashnode-api-app-presentation-c06283a49a17 %}

{% twitter 1351143130016395269 %}