To make it works for Strapi V4 API

README.md

@@ -4,13 +4,13 @@
 Note: This is a sample project for Zafar Saleem's blog on [medium](https://medium.com/@zafarsaleem/login-using-react-redux-redux-saga-86b26c8180e)
 
 ## Before getting started
-Before using this project please make sure you've finished through step #3 of the [strapi quickstart guide](https://strapi.io/documentation/3.x.x/getting-started/quick-start.html#_3-create-an-admin-user) and have strapi spun up on it's default port -> 1337.
+Before using this project please make sure you've finished the [strapi quickstart guide](https://docs.strapi.io/developer-docs/latest/getting-started/quick-start.html) and have strapi spun up on it's default port -> 1337.
 
 ## Get Started
 1. Clone this repository
 2. Run npm install inside its root folder.
 3. run npm start
-4. Go to http://localhost:3333 in your browser to see it in action.
+4. Go to http://localhost:3000 in your browser to see it in action.
 
 ### Real World Project
 @zafar-saleem implemented a real world project [timeoff-app](https://github.com/zafar-saleem/timeoff-app) using this architecture.

src/components/loginPage.js

@@ -13,7 +13,7 @@ class LoginPage extends Component {
     let password = event.target.password.value;
 
     const data = {
-      email, password
+      identifier: email, password
     };
 
     this.props.dispatch(loginUserAction(data));

src/components/registerPage.js

@@ -8,12 +8,12 @@ class RegisterPage extends Component {
   onHandleRegistration = (event) => {
     event.preventDefault();
 
-    let name = event.target.name.value;
+    let username = event.target.username.value;
     let email = event.target.email.value;
     let password = event.target.password.value;
 
     const data = {
-      name, email, password
+      username, email, password
     };
 
     this.props.dispatch(registerUserAction(data));
@@ -33,8 +33,8 @@ class RegisterPage extends Component {
         {!isSuccess ? <div>{message}</div> : <Redirect to='login' />}
         <form onSubmit={this.onHandleRegistration}>
           <div>
-            <label>Name</label>
-            <input type="text" name="name" />
+            <label>User Name</label>
+            <input type="text" name="username" />
           </div>
           <div>
             <label>Email</label>

src/services/authenticationService.js

@@ -1,5 +1,5 @@
 export const registerUserService = (request) => {
-  const REGISTER_API_ENDPOINT = 'http://localhost:3000/api/v1/register';
+  const REGISTER_API_ENDPOINT = 'http://localhost:1337/api/auth/local/register';
 
   const parameters = {
     method: 'POST',
@@ -19,7 +19,7 @@ export const registerUserService = (request) => {
 };
 
 export const loginUserService = (request) => {
-  const LOGIN_API_ENDPOINT = 'http://localhost:3000/api/v1/login';
+  const LOGIN_API_ENDPOINT = 'http://localhost:1337/api/auth/local';
 
   const parameters = {
     method: 'POST',