tailnext
tailnext copied to clipboard
feat(blog): add search and pagination functionality
Hi! This commit introduces search functionality to the blog, enabling users to search for specific topics or keywords within blog posts. Additionally, pagination has been implemented to enhance user experience by breaking up long lists of posts into manageable segments. Thorough testing and coverage have been applied to ensure everything works as expected. The design methodology adheres to TailNext's design principles, and the code architecture maintains alignment with the existing structure.
The techniques used to implement this feature include Next.js searchParams and the query-string package. Next.js useSearchParams function query-string package
Here is a demonstration of how it works in this video: https://www.loom.com/share/1a735796b8d7400bb4b461ffef37cdba
(I also added an API doc for the functions within the utils.ts file.)
[!IMPORTANT] The number of posts per page can be managed via the variable
POSTS_PER_PAGE
, defined as a constant at line 32 withinthe src/utils/posts.ts
file.