Hi,

Thanks for reaching out!

Reactify is Redux Material template which is made in reactjs. Unfortunately, we are not providing separate html template for it.

Let us know if you need anything else at support@theironnetwork.org

Thanks and have nice day!

we need html if you can thanks

Unfortunately we don’t a htm version. Thanks!

Hi,

Thanks for reaching out!

We are using firebase for authentication and If you want to use the firebase database for the entire project then you may need to follow the given article https://medium.com/@thevatsalsaglani/working-with-firebase-real-time-database-using-reactjs-and-uikit-and-launching-to-netlify-ff92419289b2

We think that basics knowledge of firebase and reactify is enough to set up your mentioned requirements because you should consider reactify as both starter app and a learning source for newcomers.

Without proper knowledge of reactjs, you won’t be able to go too far, unfortunately. If you decide to learn reactjs, then reactify is a great tool too. It uses a lot of intermediate and advanced aspects of the reactjs but still has some challenges for the new comers.

Let us know if you have any queries at support@theironnetwork.org

Thanks and have a nice day ahead!

Hi,

Thanks for reaching out!

It seems you are missing some fonts in your system that is why this has occurred. To install those fonts you have to install the fonts as per as following steps:

1.- Visit the URL below and click on the download button to download the fonts:

https://github.com/lykmapipo/themify-icons/blob/master/fonts/themify.ttf https://github.com/keremciu/font-bundles/blob/master/ttf-files/material.ttf

2.- Install the font on your macOS Font Book.

3.- Now, open our reactify sketch files. You will now able to see all the fonts.

Let us know if you need anything else at support@theironnetwork.org

Thanks and have a nice day!

Hi,

Thanks for reaching out!

You are missing some fonts in your system that is why this has occurred. To install those fonts you have to install the fonts as per as following steps:

1.- Visit the URL below and click on the download button to download the fonts:

https://github.com/lykmapipo/themify-icons/blob/master/fonts/themify.ttf https://github.com/keremciu/font-bundles/blob/master/ttf-files/material.ttf

2.- Install the font on your macOS Font Book.

3.- Now, open our reactify sketch files. You will now able to see all the fonts.

Let us know if you need anything else at support@theironnetwork.org

Thanks and have a nice day!

Perfect, thank you!!

Sure Thanks for the reply

Hello

I am still getting issue in login api call I got Successful call of api but redirection is not done after that. Pls share one example of this if you have any.

Unfortunately, we don’t have an example for the same. Thanks!

Hi,

Thanks for reaching out again!

It seems that you want to display the logged-in user info on any component. We are storing the email-id and password in firebase, so you can get the logged-in user email from success response.

Step 1. You need to go to the src/actions/AuthActions.js and inside signinUserInFirebase action pass an extra argument “email: user.user.email” so it will look below’s code

export const signinUserInFirebase = (user, history) => (dispatch) => {

dispatch({ type: LOGIN_USER });

firebase.auth()

.signInWithEmailAndPassword(user.email, user.password)

.then((user) => {

localStorage.setItem("user_id", "user-id");

dispatch({ 

type: LOGIN_USER_SUCCESS,

payload: localStorage.getItem('user_id'),

email: user.user.email //here

});

history.push('/');

NotificationManager.success('User Login Successfully!');

})

.catch((error) => {

dispatch({ type: LOGIN_USER_FAILURE });

NotificationManager.error(error.message);

});

}

And do the same thing with signupUserInFirebase action on the same page.

step 2. Now go to the src/reducers/AuthUserReducer.js and add new initial state as follows

const INIT_STATE = {

user: localStorage.getItem('user_id'),

loading: false,

email: '' //here

};

And inside LOGIN_USER_SUCCESS case update the email value as follows

case LOGIN_USER_SUCCESS:

return { 

...state,

loading: false,

user: action.payload,

email: action.email

};

After that in LOGOUT_USER case empty the email state as follows

case LOGOUT_USER:

return { 

...state,

user: null,

email: ''

};

step 3. Now go to the src/components/Sidebar/UserBlocks.js and search for mapStateToProps and inside the function replace the settings with “authUser” as follows

const mapStateToProps = ({ authUser }) => {

console.log("authUser",authUser)

return authUser;

}

Now search for "Lucile Beck" in the same file, you will find this name two times. you have to choose the one which is wrap inside   i.e.

 Lucile Beck 

and replace this with the following

 {this.props.email} 

Now, whenever you log in, your email id will be displayed in the user block of vertical sidebar navigation.

Let us know if you need anything else at support@theironnetwork.org

Thanks and have a nice day!

Thank you so much for your answered actually it was exactly that i was trying to do. But it ONLY works at the first time only before the login action, if i refresh the page for example obviously i lost the state, im trying to implement (firebase) auth.onAuthStateChanged listener on the Auth.js and perform store.dispatch like login but its not working, please help me because i dont want to use localstorage because its not secure trust on that data.

Our apologies for the late reply. We have replied to your query. Let us know if you need anything else. Thanks!

Hi,

Thanks for reaching out!

You are getting this error because of uglifyjs-webpack-plugin which uses uglify-js to compress code and uglify-js doesn’t support ES6. So, you have to use https://github.com/webpack-contrib/terser-webpack-plugin

To install this, please follow the steps below:

You need to remove or uninstall the “uglifyjs-webpack-plugin” from package.json and install this plugin “terser-webpack-plugin” by hitting following command:

$ npm install terser-webpack-plugin—save-dev

Now open file “webpack.config.js” from your root directory and do the following steps:

1). Replace this line “const UglifyJsPlugin = require(‘uglifyjs-webpack-plugin’);” with this “const TerserPlugin = require(‘terser-webpack-plugin’);”

2). Now, replace the optimization object, from given below optimization: { minimizer: [ new UglifyJsPlugin({ cache: true, parallel: true, uglifyOptions: { compress: false, ecma: 8, mangle: true }, sourceMap: true }) ] }

to this

optimization: {
      minimize: true,
      minimizer: [
         new TerserPlugin({
            cache: true,
            parallel: true,
            sourceMap: true,
            terserOptions: {
               compress: false,
               ecma: 8,
               mangle: true
            }
         })
      ],
   }

Let us know if you have any info and queries at support@theironnetwork.org

Thanks and have a nice day!

Hi,

Thanks for reaching out!

Unfortunately, we haven’t used and tested as such MongoDB with this template but to use MongoDB, you can follow the below’s article. This may help you.

https://medium.com/swlh/how-to-create-your-first-mern-mongodb-express-js-react-js-and-node-js-stack-7e8b20463e66

Let us know if you have any info and queries at support@theironnetwork.org

Thanks and have a nice day!

Hi,

Thanks for reaching out!

We aren’t using this third party library(redux-persist) in our theme and we did not test this library as such. So, unfortunately, we can’t able to help you with this.

Let us know if you have others queries at support@theironnetwork.org

Thanks and have a nice day!

Hi,

Thanks for reaching out!

You might be running the seed project, that’s why you are getting the only general menus. Try to run the other packages (reactify-redux-saga or thunk) you get from by downloading the reactify from ThemeForest. Make sure you get the same packages as mentioned in this link https://docs.theironnetwork.org/reactify/folder-structure/

Let us know if you need info and queries at support@theironnetwork.org

Thanks and have a nice day ahead!

Hi,

Thanks for reaching again!

We checked and fixed with the seed project and now it is working fine. Now we are working on the main project to check and find if there are any issues with Heroku compatibility. If you could send us the error message or screenshot of the error that you are facing at support@theironnetwork.org. Will keep you posted for the same.

Thanks and have a nice day

I am still waiting for your response

Hi,

Thanks for your patience!

Sorry for the delayed response.

We are working on JWT and will release the update soon. In the coming week, we will update it on ThemeForest. Regarding the table, We have shown some basic table at our demo page. If you want more table then you can go the material UI table section and integrate the table in your project. It is very easy to integrate.

Let us know if you need anything else.

Thanks and have a nice day!

Hi,

We just completed the JWT integration as per as your requirements. We will send you the updated folder to you, for this we need your email id. Please send us your email id with your purchase code at support@theironnetwork.org

We will send you the files for the same.

Thanks and have a nice day!

I would appreciate it, if you’ll could support us, the way you are charging us for support

Hi,

Thanks for reaching out!

Note:- We are sending the steps for for Reactify-redux-saga-Laravel pkg.

We recreate the issue at our end and find out that you were missing some steps of integration. We have outlined these steps, which are following:

1. Go to resources/js/App.js and check the pathname for page3 component, Now we can do some changes in below mentioned files using that keyword, for eg:- we can take path=”/page3” . <Provider store={configureStore()}> ... <Switch> <Route exact path=’/’ component={Page1}/> <Route path=”/page2” component={Page2}/> <Route path=”/page3” component={Page3} /> </Switch> ... </Provider>

2. Now You have to add “page3” keyword in Page3 component for render the sigin and other pages.

3. Go to resources/js/container/App.js and you have to add page3 keyword in url same as below code snippet:-

const InitialPath = ({ component: Component, authUser, ...rest}) =>
   <Route
       ...
            : <Redirect
               to={{
                  pathname: '/page3/signin', // add page3 keyword in pathname
                  state: { from: props.location }
               }}
            />}
   />;

After that do same changes under render method in same file :-

render() {
   ...
   if (location.pathname === '/page3') {
      if (user === null) {
         return (<Redirect to={'/page3/signin'} />);
      } else {
         return (<Redirect to={'/page3/app/dashboard/ecommerce'} />);
      }
   }

return (
   <RctThemeProvider>
      ...
      <Route path="/page3/signin" component={AppSignIn} />
      ...
   </RctThemeProvider>
);

4. Go to resources/js/Auth/Auth.js and find handleAuthentication() method, then add page3 keyword as well in “window.location.replace” same as below code snippet:-

handleAuthentication() {
   this.auth0.parseHash((err, authResult) => {
      if (authResult && authResult.accessToken && authResult.idToken) {
         ...
         window.location.replace('/page3') // add keyword
      } ...
   });
}

5. After these changes, you have to start the project and the result will we display on the browser.

Let us know if you need anything else at support@theironnetwork.org

Thanks and have a nice day!

Hi,

Thanks for reaching out!

If you are sure that the problem is coming from browser cache then can you please explain how you are adding and updating pages? We did not test as such and we are unable to recreate the issue and if possible then would you mind sending me the project file zip folder that are you using right now at support@theironnetwork.org? Using that, we can take a look at our system and see how we can get this fixed for you.

Note: Please renew the support.

Thanks!

Hi,

Thanks for reaching and sorry for the little delay!

We are sending you the steps to run the theme. Please follow the steps below:

Note: You need to open the reactify, reactify-laravel(package that we provide) and your laravel project.‌

Step 1: Replace the contents of webpack.mix.js file of laravel project with the following code snippet:

const mix = require(‘laravel-mix’); const webpack = require(‘webpack’);

mix.autoload({ ‘jquery’: [’$’, ‘window.jQuery’, ‘jQuery’], })

mix.webpackConfig({ plugins: [ new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/) ], resolve: { alias: { ‘Actions’: path.resolve(__dirname, ‘resources/js/actions/’), ‘Components’: path.resolve(__dirname, ‘resources/js/components/’), ‘Assets’: path.resolve(__dirname, ‘resources/js/assets/’), ‘Util’: path.resolve(__dirname, ‘resources/js/util/’), ‘Routes’: path.resolve(__dirname, ‘resources/js/routes/’), ‘Constants’: path.resolve(__dirname, ‘resources/js/constants/’), ‘Helpers’: path.resolve(__dirname, ‘resources/js/helpers/’), ‘Api’: path.resolve(__dirname, ‘resources/js/api/’) } }, output: { chunkFilename:”js/chunks/[name].js” } });

mix.js(‘resources/js/index.js’, ‘public/js’);

Step 2: Open the reactify-laravel project that we have given to you and copy all the contents of package.json file and replace the contents of Laravel’s project package.jsonfile with the contents copied.‌

Step 3: Create a file .babelrc in your project directory (projectName/.babelrc) and put the following code in the file:

{ “presets”: [ ”@babel/preset-env”, ”@babel/preset-react” ], “plugins”: [ “react-hot-loader/babel”, [ ”@babel/plugin-proposal-class-properties”, { “loose”: true } ] ] }

Step 4: In your laravel project, Open the resources->js folder and delete the app.js file.

Step 5: Now go to your reactify project src folder and copy all the folders & files and paste it inside your laravel’s project resources->js folder.‌

Step 6: Now open the public folder of reactifyproject(that we have provided to you) and copy the favicon and replace it with the favicon inside your laravel’s project public folder.‌

Step 7: Now open the public folder of reactifyproject again and copy the content of index.html file, then open the resources->views->welcome.blade.php file of your laravel’s project and replace all the contents with the copied content.‌

Step 8: In welcome.blade.php file of your laravel’s project, you need to update few lines of code. They are:‌

Replace the line:

<link rel=”shortcut icon” href=”favicon.ico”>‌ with:

<link rel=”shortcut icon” href=”{{asset(‘favicon.ico’)}}”> Now add the given code before the end tag of body.

<script type=”text/javascript” src=”{{asset(‘js/index.js’)}}”></script> Step 9: Open the web.php file from your laravel’s project, routes folder and update the code as follows:

Route::get(‘{any}’, function () { return view(‘welcome’); })->where(‘any’,’.*’); ‌ Step 10: Now open terminal and go to your project directory and run the following commands:

npm install //To download the dependencies‌ If you want to run the project in development mode, then run this command:

npm run dev //compile everything in devlopment mode If you want to run the project in production mode, then run this command:

npm run prod //compile everything in production mode In the last, serve your project with the following command:

php artisan serve

Let us know if you need anything else at support@theironnetwork.org

Thanks and have a nice day!

I follow above same step but still its not working…even i didn’t find the index.html in my public folder (Downloaded laravel folder). Which laravel, node and php version is required for this.

Hi,

Thanks for reaching out again.

These steps are working fine on our side. It seems that you are facing the issues due to quotes (’’,”“). You may have copied the syntax from the comment section and these quotes gets converted. Open the screenshot to see this in detail:

https://tinyurl.com/u3xon2s

And Second thing, You have to downgrade the version of “react-swipeable-views” to 0.12.18 this library is also causing some issues.

At last, In laravel, there is no index.html file in the public folder. Laravel has only one view file which you will find in resources/views/welcome.blade.php which is responsible to work same as index.html of the public folder from simple vue version(Without Laravel).

Please follow the above-said fixes to run the project.

Let us know if you need anything else at support@theironnetwork.org

Thanks and have a nice day!

Hi,

Thanks for reaching out!

Please let us know what exactly you have problem with documentation. We will try fix it.

Let us know if you need anything else at support@theironnetwork.org

Thanks and have nice day!