Nexca is admin panel that we build recently and this article I gonna explain each hook to understand them better for find the latest update you check them here .
useFetch
The useFetch hook is used to fetch data such as posts, services, or sections from a specified URL. This hook takes one parameter, which is the URL from which to fetch the data.
useGetSection
The useGetSection hook is used to fetch data from a specific section. This hook is particularly useful for the client section. It takes three parameters:
url: The URL from which to fetch the data, typically an API endpoint for posts.
lengthItem: The number of items you want to display in that section.
secid: The ID of the section you want to fetch data for.
You can also extract the loading state to display a skeleton while the posts are loading.
useGetLatestPosts
The useGetLatestPosts hook is used to fetch the latest posts on the site. This hook takes one parameter:
recentSize: The number of recent items you want to display.
It is good practice to set the number of items you want to see using useState.
const { posts } = useGetLatestPosts(recentSize);
useCheckLogin
The useCheckLogin hook is used exclusively for the admin to check if a user is logged in. It does not take any parameters and should only be called in the admin page or layout.
useSinglePost
The useSinglePost hook is used to fetch a single post based on an ID parameter. It finds the matching post and displays it to the user. This hook is only used on the /Posts/[id] page.
// To read data from the post
<h1>{post.title}</h1>
useReadText
The useReadText hook is used to read a given text using the browser’s speech synthesis capability. It provides functionality to start and stop the reading process. This hook takes one parameter:
text: The text to be read aloud.
The hook maintains a state isSpeaking to indicate whether the text is currently being read. It returns three values:
isSpeaking: A boolean indicating if the text is being read.
handleReadText: A function to start reading the text.
handleStopReading: A function to stop reading the text.
const ExampleComponent = () => {
const { isSpeaking, handleReadText, handleStopReading } = useReadText(‘Hello, this is a sample text.‘);
return (
<div>
<button onClick={handleReadText} disabled={isSpeaking}>Read Text</button>
<button onClick={handleStopReading} disabled={!isSpeaking}>Stop Reading</button>
</div>
);
};
Live Demo
Username: admin
Password: a123b456@@