Hey there, Hive community! π
Welcome back to my wild ReactJS learning ride π’ β and guess what? Weβre already on Day 6! If you've missed previous episodes, don't worry. Grab some popcorn πΏ and catch up below:
π ReactJS Journey So Far
- π Day One: Fresh React app + AIOHA integration!
- π§ Day Two: Routing drama & rebellious NavBar π€
- π οΈ Day Three: Fixed Layouts, Routing & AIOHA π₯
- π§ Day Four: useState, useEffect, and .env headaches π
- π§Ή Day Five: Path Aliases to clean up relative path spaghetti π
π‘ API Calling β The Right Way
Using fetch()
is easy. But keeping things organized? Thatβs next-level!
π Folder structure:
src/api/
βββ business/
β βββ BusinessApi.tsx // π Get Business API here
π Hereβs how I call my Business API:
import type { BusinessDTO } from "@/types/BusinessApiResponse";
export const fetchBusinesses = async () => {
const response = await fetch("https://some-xyz-server.com/business");
if (!response.ok) throw new Error("API error");
const jsonData = await response.json();
return jsonData as BusinessDTO[];
};
π‘ Why a separate file? Because real-world APIs are messy. Headers, body payloads, response transformations β it's cleaner this way! π
𧬠DTOs / POJOs / Data Models
Using TypeScript = getting predictable & strongly typed data πͺ
π Types live here:
src/types/
βββ BusinessApiResponse.tsx // π All your DTOs in one place
Hereβs a sneak peek of my DTO setup:
export interface BusinessDTO {
distriator?: DistriatorDTO;
profile?: ProfileDTO;
contact?: ContactDTO;
location?: LocationDTO;
id?: string;
}
export interface ContactDTO {
website?: string;
}
export interface DistriatorDTO {
guides?: GuideDTO[];
owner?: string;
creator?: string;
expiry?: Date;
subscriptionStatus?: string;
paymentMethods?: string[];
spendHBDLink?: string;
}
π§ Context Providers to the Rescue!
If businesses are needed everywhere in your app, the answer is simple: Context Provider! πͺ
β Step 1: Folder Setup
src/
βββ components/
β βββ BusinessList.jsx
βββ context/
β βββ BusinessesContext.jsx // β
Lives here
β Step 2: Create the Context + Provider
import type { FC, ReactNode } from "react";
import type { BusinessDTO } from "@/types/BusinessApiResponse";
import { fetchBusinesses } from "@/api/BusinessApi";
import React, { createContext, useContext, useState, useEffect } from "react";
const BusinessesContext = createContext();
export const useBusinesses = () => useContext(BusinessesContext);
export const BusinessesProvider: FC<{ children: ReactNode }> = ({ children }) => {
const [businesses, setBusinesses] = useState<BusinessDTO[]>([]);
const [loading, setLoading] = useState(true);
useEffect(() => {
refreshBusinesses();
}, []);
const refreshBusinesses = async () => {
try {
setLoading(true);
const data = await fetchBusinesses();
setBusinesses(data);
} catch (e) {
console.error(e);
} finally {
setLoading(false);
}
};
return (
<BusinessesContext.Provider
value={{ businesses, loading, refreshBusinesses }}
>
{children}
</BusinessesContext.Provider>
);
};
β Step 3: Wrap Your App
import { BusinessesProvider } from "@/context/BusinessesContext";
function App() {
return (
<BusinessesProvider>
<AiohaProvider aioha={aioha}>
<BrowserRouter>
<Routes>
<Route path="/" element={<LandingPage />} />
</Routes>
</BrowserRouter>
</AiohaProvider>
</BusinessesProvider>
);
}
β Step 4: Use It Anywhere!
import React from "react";
import { useBusinesses } from "@/context/BusinessesContext";
function BusinessList() {
const { businesses, loading } = useBusinesses();
if (loading) return <p>β³ Loading businesses...</p>;
return (
<div>
<h2>πͺ All Businesses</h2>
<ul>
{businesses.map((biz) => (
<li key={biz.id}>π {biz.name}</li>
))}
</ul>
</div>
);
}
export default BusinessList;
And boom π₯ β your business data is now globally available!
π§ Distriator Project Update
Weβve rolled out a new feature that displays Hive Power of a business! π
This allows users to instantly see how invested a business is in Hive πͺ
β
Currently in alpha
π Rolling out to production very soon!
π Wrapping Up
I hope this post helps some curious mind someday π§
If you found value in this, consider supporting me in my journey on the Hive blockchain π
π Vote me as a Hive Witness
β‘ Letβs build a stronger decentralized world together
Cheers π₯
More power to Hive community members!
More power to Hive blockchain!
π Final Note
- I asked ChatGPT/AI to help optimize this post to make it more readable and viewer-friendly.
- Here is the link where you can find both original content & improvements made by AI
- https://chatgpt.com/share/688ad30f-5d64-8000-9f97-b26950da7bd6
π My Contributions to β¦οΈ Hive Ecosystem
Contribution | To | Hive | Ecosystem |
---|---|---|---|
Hive Witness Node | Hive API Node (in progress) | 3Speak Video Encoder Node Operator (highest number of nodes) | 3Speak Mobile App Developer |
3Speak Podcast App Developer | 3Speak Shorts App Developer | 3Speak Support & Maintenance Team | Distriator Developer |
CheckinWithXYZ | Hive Inbox | HiFind | Hive Donate App |
Contributed to HiveAuth Mobile App | Ecency β 3Speak Integration | Ecency β InLeo Integration | Ecency β Actifit Integration |
Hive Stats App | Vote for Witness App | HiveFlutterKit | New 3Speak App |
π Support Back
β€οΈ Appreciate my work? Consider supporting @threespeak & @sagarkothari88! β€οΈ
Vote | For | Witness |
---|---|---|
sagarkothari88 | @sagarkothari88 | |
threespeak | @threespeak |
Comments (5)
This post has been manually curated by @bhattg from Indiaunited community. Join us on our Discord Server.
Do you know that you can earn a passive income by delegating to @indiaunited. We share more than 100 % of the curation rewards with the delegators in the form of IUC tokens. HP delegators and IUC token holders also get upto 20% additional vote weight.
Here are some handy links for delegations: 100HP, 250HP, 500HP, 1000HP.
100% of the rewards from this comment goes to the curator for their manual curation efforts. Please encourage the curator @bhattg by upvoting this comment and support the community by voting the posts made by @indiaunited.
Thank you so much @bhattg & @indiaunited for considering my post for curation. Have a good day
via Inbox
Stop downvoting my original content with your alt account @letusbuyhive I know you work for Dan so fuck off
πππππ
Blocktrades can you please stop downvoting my original content with your alt accounts thanks ππΎ
πππππππππππππ
Don't be jealous So sad @themarkymark aka @theycallmemarky Aka @marky @gogreenbuddy Aka @usainvote @buildawhale Aka @punkteam Aka @ipromote
@letusbuyhive Aka @sagarkothari88 please explain why you keep downvoting my original content and comments π€
Please explain to everyone why π€
@meno @steevc @crimsonclad @azircon let's not forget blocktrades π please tell your racist friend to stop downvoting my original content
How can we we allow a mentally ill person to have so much control on Hive π
It's unbelievable you downvoted this Goodbye Auntie R.I.P ππΎ You fucked up big time it's clear blocktrades is in control π
If nothing can be done about your downvote abuse then Hive is a dead project ππΎ
It's crazy that the person doing the downvoting is also farming the shit out of Hive ππππ
If anyone wants to speak to me privately send me a message on Instagram @kgakakillerg
You can never stop the truth with lies ππππππ
It's crazy we have a man who pretends to be a millionaire running around Hive downvoting people for fun π€ and nothing has been done π€
It's crazy that someone is trying to bully me on Hive ππππππππ
It's unbelievable that no one has came to help as people are afraid to say anything or they get downvoted too ππππππ
There's no real freedom on Hive if one person can cause so much harm
I feel sorry for you ππΎ
One thing you need to remember you can't take anything with you ππππ
Go and enjoy your life have a bit of fun let your hair down go out and meet some real people in the flesh π
Your actions show that you must own Hive Blockchain π€ why do your actions go unchallenged π€
You are now stalking me ππππ
Are you jealous about the DHF ππππ
Aren't you farming enough rewards ππππ
I heard you were into very young girls ππππππ
Is that why you are always online π€
Stalking people
No one is scared of you πππππππ
You are bad for Hive
Power down and go away get a life
https://hive.blog/hive-135178/@crimsonclad/re-kgakakillerg-sxllhv
https://hive.blog/hive-148441/@hivewatchers/svftu9
https://hive.blog/hive-148441/@hivewatchers/svdjjz
https://hive.blog/hive-176853/@steevc/re-kgakakillerg-syyy4x
https://hive.blog/dev/@howo/re-kgakakillerg-szhax7
It's unbelievable that they downvoted this Goodbye Auntie R.I.P ππΎ
It's clear you need help ππΎ
Hive is being held down by downvoting whales
Do you get a buzz out of downvoting people π€
You should really try to get outside more spend some time in the real world ππ
Why are you pushing people away to blurt and steemit
You are all definitely going to hell ππππππππ
Why do you want to make enemies all over the world π€
Blocktrades stop making a fool of yourself ππππππ
Steevc please explain to your friend they have been exposed πππππ
Downvotes are weak like you πππππππ
Why don't you go and spend your millions of dollar's you have ππππππππππππ
Blocktrades please explain why you keep downvoting my original content with your alt accounts π€
You are so sad it's unreal πππππ
You must know that you can't hide on Hive πππππππ
If you want everyone to leave Hive keep doing what you are doing ππππππππππ
Just remembered who started this
I'll be here to turn the lights off ππππππ
You are still stalking me πππππ it proves you have no life outside of Hive πππππππππΎππΎππΎππΎππΎππΎππΎπππππ
Blocktrades please can you stop downvoting my original content with your alt accounts π€
Also is bullying people ok on Hive π€
You are only making Hive look like a big scam
Why do you keep stalking me I'm not gay sorry I can't help you ππΎ
Just tell me what the issue is π€
You are that stupid you set up an account called letusbuyhive to downvote people and support your farming Hive friend's πππππ and @buildawhale
Please get some help ππΎ
It's clear who has mental health issues that's why you should really stop pointing fingers at others πππππππππ
It's clear blocktrades is behind this πππππ
Can you please explain why you keep downvoting my original content I don't want to hear it's because disagreement of rewards I don't make any πππππ
Please move on with your life blocktrades and leave me alone thank you ππΎ
Please tell everyone why you keep downvoting my original content π€
Still stalking me ππππππ
The way you are stalking me it's clear you have no Life outside of Hive πππππππ
Keep downvoting people away πππππ
Some people never learn ππππππππ€£π€£π€£π€£π€£
Is life that bad πππππ
You can't win this πππππππππ
Congratulations @sagarkothari88! You received a personal badge!
Wait until the end of Power Up Day to find out the size of your Power-Bee.
May the Hive Power be with you!
You can view your badges on your board and compare yourself to others in the Ranking
Check out our last posts:
Congratulations @sagarkothari88! You received a personal badge!
See you at the next Power Up day to see if you will repeat this feat.
May the Hive Power be with you!
You can view your badges on your board and compare yourself to others in the Ranking
Check out our last posts:
Okay, I have a doubt rather than going for context hooks and complicating things why don't you go for Redux-Toolkit? Correct me if I'm wrong, but I would like to know it from you.
I am going anywhere possible π€£
You're not wrong at all. I am doing direction-less learning.
Good that you've pointed out. I'll do some redux-toolkit learning as well. It's on my list now.
via Inbox
Sure. I got your blogs on my feed and they are interesting to me as I too come from the same background. Now, I'm scrolling through them only and I gotta do the same. For a long time, I have been writing travelling and other random blogs over here.
React isn't my skillset at all. I used to be Swift-iOS app developer - straight 10 years but Apple is innovating backwards. I tried flutter for over 5 years but it feels dead to me. Now, I don't know who am I? Where am I heading?
Typical Developers FOMO situation.
Coding even on Monday πΉ
via Inbox
Hearing this from someone who has been in the industry for almost 2 decades is already killing. I too sometimes get the FOMO that's why I just keep exploring things, and whichever I feel like I should get it finished I do that from scratch to the advanced.
I feel so bad for myself because I sometimes still code in dead-objective-c programming language in which AI hardly does something well. AI has killed all experience. Anyone, literally, anyone from market of devs, can do much much better with help of AI. Forget anyone, even AI is doing better than me, when I ask it to do.
Looks like We have to focus somewhere else.
via Inbox
The best thing to do right now, is to make AI your companion and keep growing. You can't compete with it, you can only use it for yourself and your learning.
Yes. Noted. That's the only way to survive.
via Inbox
Cool