How ashik-khan-atul/talker-client works
Talker is a React social microblog frontend. Users register or log in, then browse and create posts, interact through likes and comments, and view or manage profiles. The UI also supports visiting other users’ profiles, with locked-profile content hidden. The backend is a separate project; API relationships beyond the sampled requests are included only where the README documents the capability. Several component implementations were not excerpted, so their internal request flows are not inferred.
Main entry points: router.jsx Route table · Register.jsx Registration · ProfileTab.jsx My profile tabs · AuthProvider.jsx Auth provider
Components 33
App navigation
- React entry
src/main.jsx - Route table
src/Router/router.jsx - Home page
src/Pages/Home/Home.jsx - Home layout
src/Layouts/HomeLayout/HomeLayout.jsx
Identity and access
- Auth provider
src/Providers/AuthProvider.jsx - Auth hook
src/Hooks/useAuth.jsx - Login
src/Components/Login/Login.jsx - Registration
src/Components/Register.jsx/Register.jsx - Google sign-in
src/Shared/GoogleLogin.jsx - Firebase Auth
- Public API client
src/Hooks/useAxiosPublic.jsx - Secure API client
src/Hooks/useAxiosSecure.jsx
Posts and interaction
- Create post
src/Components/CreatePost/CreatePost.jsx - Post feed
src/Components/Showpost/Showpost.jsx - My posts
src/Components/ShowPostByME/ShowPostByME.jsx - Post detail
src/Components/SinglePost/SinglePost.jsx
Profile experience
- My profile
src/Pages/Profile/Profile.jsx - Profile information
src/Pages/ProfileInfo/ProfileInfo.jsx - Edit profile
src/Pages/ProfileInfo/ProfileInfoEdit/ProfileInfoEdit.jsx - Visited profile
src/Pages/VisitProfile/VisitProfile.jsx - Visited profile header
src/Pages/VisitProfile/VisitProfileImage/VisitProfileImage.jsx - Visited profile tabs
src/Pages/VisitProfile/VisitProfileTab/VisitProfileTab.jsx - Visited photos
src/Pages/VisitProfile/VisitProfilePostedPhoto/VisitProfilePostedPhoto.jsx - Visited followers
src/Pages/VisitProfile/VisitedProfileFollowers/VisitedProfileFollowers.jsx - Visited following
src/Pages/VisitProfile/VisitedProfileFollowing/VisitedProfileFollowing.jsx - My profile tabs
src/Components/ProfileTab/ProfileTab.jsx - My profile image
src/Components/ProfileImage/ProfileImage.jsx - Posted image view
src/Components/PostedImage/PostedImage.jsx - My followers
src/Components/MyFollowers/MyFollowers.jsx - My following
src/Components/MyFollowing/MyFollowing.jsx
Other components
- Visitor or user
- Talker API
- Image hosting
Connections 48
- Visitor or user → React entry: opens
src/main.jsx - React entry → Auth provider: provides auth
src/main.jsx - React entry → Route table: mounts routes
src/main.jsx - Route table → Home layout: routes through
src/Router/router.jsx - Route table → Home page: routes to
src/Router/router.jsx - Route table → Login: routes to
src/Router/router.jsx - Route table → Registration: routes to
src/Router/router.jsx - Route table → Post detail: routes to
src/Router/router.jsx - Route table → My profile: routes to
src/Router/router.jsx - Route table → Visited profile: routes to
src/Router/router.jsx - Route table → Profile information: routes to
src/Router/router.jsx - Route table → Edit profile: routes to
src/Router/router.jsx - Home layout → Home page: renders
src/Pages/Home/Home.jsx - Auth provider → Firebase Auth: uses auth
src/Providers/AuthProvider.jsx - Auth provider → Public API client: requests JWT
src/Providers/AuthProvider.jsx - Auth provider → Talker API: posts token request
src/Providers/AuthProvider.jsx - Auth hook → Auth provider: reads context
src/Hooks/useAuth.jsx - Login → Auth hook: uses auth
src/Components/Login/Login.jsx - Registration → Auth hook: uses auth
src/Components/Register.jsx/Register.jsx - Registration → Image hosting: uploads image
src/Components/Register.jsx/Register.jsx - Registration → Firebase Auth: creates account
- Registration → Talker API: creates user
src/Components/Register.jsx/Register.jsx - Login → Google sign-in: offers Google sign-in
src/Components/Login/Login.jsx - Google sign-in → Auth hook: uses auth
src/Shared/GoogleLogin.jsx - Google sign-in → Firebase Auth: signs in
- Google sign-in → Talker API: creates user
src/Shared/GoogleLogin.jsx - Home page → Create post: renders
src/Pages/Home/Home.jsx - Home page → Post feed: renders
src/Pages/Home/Home.jsx - Create post → Talker API: submits post
README.md - Post feed → Talker API: loads posts
README.md - Post detail → Talker API: loads post
src/Components/SinglePost/SinglePost.jsx - Post detail → Talker API: likes post
src/Components/SinglePost/SinglePost.jsx - Post detail → Talker API: sends comments
src/Components/SinglePost/SinglePost.jsx - My posts → Talker API: loads own posts
src/Components/ShowPostByME/ShowPostByME.jsx - My posts → Talker API: deletes post
src/Components/ShowPostByME/ShowPostByME.jsx - My profile → My profile image: renders
src/Pages/Profile/Profile.jsx - My profile → My profile tabs: renders
src/Pages/Profile/Profile.jsx - My profile tabs → My posts: shows posts
src/Components/ProfileTab/ProfileTab.jsx - My profile tabs → Posted image view: shows photos
src/Components/ProfileTab/ProfileTab.jsx - My profile tabs → My followers: shows followers
src/Components/ProfileTab/ProfileTab.jsx - My profile tabs → My following: shows following
src/Components/ProfileTab/ProfileTab.jsx - Profile information → Talker API: loads profile
src/Pages/ProfileInfo/ProfileInfo.jsx - Edit profile → Talker API: updates profile
README.md - Visited profile → Visited profile header: renders
src/Pages/VisitProfile/VisitProfile.jsx - Visited profile → Visited profile tabs: renders
src/Pages/VisitProfile/VisitProfile.jsx - Visited profile tabs → Talker API: loads visited user
src/Pages/VisitProfile/VisitProfileTab/VisitProfileTab.jsx - Visited profile tabs → Visited photos: shows photos
src/Pages/VisitProfile/VisitProfileTab/VisitProfileTab.jsx - Visited profile tabs → Visited followers: shows followers
src/Pages/VisitProfile/VisitProfileTab/VisitProfileTab.jsx