Full Stack React & Django [3] - Redux & HTTP
Why Stack Overflow recommends it
Stack Overflow users link it as the tutorial they followed when asking about or citing Redux, axios actions and React-Django integration problems.
Recommended by 0 people across 0 different months, 2020 to 2022.
What it is
Part 3 of Brad Traversy's Full Stack React & Django series on Traversy Media. It adds Redux to the React front end, sets up a leads reducer and actions that call the Django REST API with axios, and makes the leads list and form components work.
What people said
Cites Kamar · 2020-11 · Stack Overflow · on “Uncaught Error: Cannot find module 'redux'”
I'm new to React.. This error came from Browser Console, while i'm trying to display it and also i'm working with django rest framework following the Tutorial [this video] here. While trying to implement redux into my application i got this error. I don't know which part i missed. Uncaught Error: Cannot find module 'redux' at webpackMissingModule (mapDispatchToProps.js:8) at eval (mapDispatchToProps.js:8) at Object../node_modules/react-redux/es/connect/mapDispatchToProps.js (main.js :452) at __webpack_require__ (main.js :999) at eval (connect.js:10) at Object../node_modules/react-redux/es/connect/connect.js (main.js :434) at __webpack_require__ (main.js :999) at eval (index.js:19) at Object../nod
Cites Shamar Yarde · 2021-04 · Stack Overflow · on “Share auth between django and react”
Once the user logs in, get the token from the backend using the following: axios.post(` [LINK] { headers: { 'Content-Type': 'application/json', data: { username, password }) .then(response => { console.log(`token: ${response.token}`); }) Port number could be 8000 and url pattern could be /api/auth/login for example. This answer mostly comes from the last reference. References Youtube. Full Stack React & Django [1] - Basic REST API. [LINK] . (Accessed 23 April, 2021). Youtube. Full Stack React & Django [2] - Implementing React. [LINK] . (Accessed 23 April, 2021). Youtube. Full Stack React & Django [3] - Redux & HTTP. [this video] . (Accessed 23 April, 2021). Youtube. Full Stack React & Django [4]
Cites Mohammad AliAkbaryan · 2021-08 · Stack Overflow · on “mapDispatchToProps not working. this.props.getCategories is not a function”
I am trying to get a list of categories from backend using react-redux looks like things are fine unless the dispatch function calls. I just used a tutorial from youtube in this link [this video] by Traversy Media Reducer import { GET_CATEGORIES } from '../actions/types.js'; const initialState = { categories: [] } export default function(state = initialState, action){ switch(action.type){ case GET_CATEGORIES: return { ...state, categories: action.payload }; default: return state; } } Action: import axios from "axios"; import { GET_CATEGORIES } from "./types"; //GET CATEGORIES export const getCategories = () => dispatch => { axios.get('/api/categories/') .then(res => { dispatch({ type: GET_CATEGOR
Cites JulesB · 2022-02 · Stack Overflow · on “React Component receives the Redux states but can't dispatch actions”
The action I want to trigger works on its own, the axis request works and it retrieves data from an api. However when I try to run it from the component using connect and then accessing it as a prop, it is like the function doesn't run, and the redux state don't update accordingly. This is how I use connect with my react component (getChannels is imported before from the action js file const mapStateToProps = (state) => ({ channels: state.Channels.channels, }) export default connect(mapStateToProps,{ getChannels })(ChannelList) This is how I call the function inside the component componentDidMount(){ this.props.getChannels } When I log the props to the console I get the initial redux states,