chore: redux setup - #10
Merged
Merged
Conversation
Install the @reduxjs/toolkit and eact-redux Redux packages as dev dependencies for its future integration in Next.js
Following the official documentation 'Redux Toolkit Setup with Next.js' https://redux-toolkit.js.org/usage/nextjs
Configure with types useAppDispatch, useAppSelector, and useAppStor following the official documentation 'Redux Toolkit Setup with Next.js' https://redux-toolkit.js.org/usage/nextjs#caching
Create a StoreProvider component following the official Redux Toolkit Setup with Next.js documentation https://redux-toolkit.js.org/usage/nextjs#caching
Provide the Redux store to the main layout of the app
- lib/features/counter/counterSlice.ts: configure counter slice with its reducers, selectors and actions; - lib/features/counter/counterAPI.ts: an mock API-request function for demo; - lib/createAppSlice.ts: function for creating slices with async thunks; - lib/store.ts: set the reducer to rootReducer, update RootState to be type of rootReducer - app/api/counter/route.ts: api endpoint for the demo
- app/demo/page.tsx: redux demo UI - app/demo/demo.module.css: stylings for the redux demo UI
Configure listeners using the provided defaults. Optional, but required for `refetchOnFocus`/`refetchOnReconnect` behaviors
Reformat to follow the Code Conventions.
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Remove unused import
Remove the second param `context` of the `POST` function to eliminate a TypeScript error as its not even used.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Description
The purpose of the PR is setting up the Redux Toolkit along with Next.js v16 and creating a usage example which may and will be used as a base for future development of Redux slices and reducers and their integration in the UI. In particular, the next PR will be dedicated to the development of the
cartSliceand reducers for updating the state and providing a global storage for theCartPageand theCartDrawerwhich will share the content.Changes
@reduxjs/toolkitandreact-reduxRedux packages as dev dependencies for its future integration in Next.js,storeFollowing the official "Redux Toolkit Setup with Next.js" documentation https://redux-toolkit.js.org/usage/nextjs,hookswith types for correct integration of the library in React/Next.js with TypeScript environment following the official documentation,StoreProvidercomponent following the official documentation,RootLayoutcomponent inStoreProviderto integrateRedux into UI,counterSlicewith its reducers, selectors and actions inlib/features/counter,app/api/counter/route.ts,app/demo/page.tsx,Screenshots
Testing
Checklist