How to prevent folder to deploy on Azure app serive

Keshav Kumar Naharwar — Tue, 11 May 2021 11:11:17 +0000

I build a node js project for learning purpose and i deploy it on azure app serivce. It works fine, I don't face any kind of issue during deployment or after deployment. But i want to prevent or restrict a folder to not to deploy on azure app service during deployment. Suppose my folder name is logs. So how i prevent logs folder to not to deploy.
Can any one please help me on this.

TypeError: Cannot read property 'map' of undefined

Keshav Kumar Naharwar — Mon, 05 Oct 2020 08:32:14 +0000

hi all, I am new in React js. I am creating a project using react js with redux. I hit a rest call in action.js file, and then reducer will update the state of store. In itemDetailsPage.js component i will use the store values and it will works fine, but when i use the map() method to render each image in itemImages array which is in the store state it show error that "Cannot read property 'map' of undefined". itemImages is an array , when i iterate this array in another component it will work fine, but in this component it shows error.

This is my action code:-

export const getItem = (id) => async dispatch => {
try{
const res = await axios.get(http://localhost:8086/api/item/getItem/${id});
console.log(success message ${res.data})
dispatch({
type: GET_ITEM,
payload: res.data.data
});
}catch(error){
console.log(error message ${error})
}
};

This is my reducer code:-

import { act } from 'react-dom/test-utils';
import { GET_ITEM, GET_ITEMS } from './../actions/Type';
const initialState={
items:[],
item:{}

};
export default function (state=initialState,action){
switch(action.type){
case GET_ITEMS:
return{
...state,
items:action.payload
}
case GET_ITEM:
return{
...state,
item:action.payload
}
default:
return state;
}
}

This is my ItemDetailsPage.js (where exactly i got error):-

import React, { Component } from 'react'
import { connect } from 'react-redux';

import { Link } from 'react-router-dom';
import { successAlert } from '../layout/SweetAlert';
import { getItem } from './../../actions/ItemActions';
class ItemDetailsPage extends Component {
constructor(props){
super(props);
this.onAddToCartClick=this.onAddToCartClick.bind(this)
}
onAddToCartClick(){
successAlert("Cart","Item added to the cart successfully");
}
componentDidMount(){
const { id } = this.props.match.params;
this.props.getItem(id);
}
render() {
const item=this.props.item
return (

          <div className="row">
            <div className="col-md-6 mb-4 mb-md-0">

              <div id="mdb-lightbox-ui"></div>

              <div className="mdb-lightbox">

                <div className="row product-gallery mx-1">

                  <div className="col-18 mb-0">


                    <div class="container my-4">
                    <div id="carouselExample1" class="carousel slide z-depth-1-half" data-ride="carousel">
                          <div class="carousel-inner">
                            <div class="carousel-item active">
                              <img height="500px" class="d-block w-100 " src="https://mdbootstrap.com/img/Photos/Horizontal/E-commerce/Vertical/12a.jpg" alt="First slide"/>
                            </div>
                            <div class="carousel-item">
                              <img height="500px" class="d-block w-100 " src="https://mdbootstrap.com/img/Photos/Horizontal/E-commerce/Vertical/13a.jpg" alt="Second slide"/>
                            </div>
                            <div class="carousel-item">
                              <img height="500px" class="d-block w-100" src="https://mdbootstrap.com/img/Photos/Horizontal/E-commerce/Vertical/14a.jpg" alt="Third slide"/>
                            </div>
                          </div>
                          <a class="carousel-control-prev" href="#carouselExample1" role="button" data-slide="prev">
                            <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                            <span class="sr-only">Previous</span>
                          </a>
                          <a class="carousel-control-next" href="#carouselExample1" role="button" data-slide="next">
                            <span class="carousel-control-next-icon" aria-hidden="true"></span>
                            <span class="sr-only">Next</span>
                          </a>
                        </div>


                      </div>



                  </div>
                  <div className="col-12">
                    <div className="row">
          {item.itemImages.map(itemImage=>(
                       console.log("inside itemimages array")

))}

className="img-fluid"/>

className="img-fluid"/>

className="img-fluid"/>

className="img-fluid"/>

                    </div>
                  </div>
                </div>

              </div>

            </div>
            <div className="col-md-6">

              <h5>{item.name}</h5>
              <p className="mb-2 text-muted text-uppercase small">{item.subCategory}</p>
              <ul className="rating">

                  <i className="fas fa-star fa-sm text-primary"></i>


                  <i className="fas fa-star fa-sm text-primary"></i>


                  <i className="fas fa-star fa-sm text-primary"></i>


                  <i className="fas fa-star fa-sm text-primary"></i>


                  <i className="far fa-star fa-sm text-primary"></i>

              </ul>
              <p><span className="mr-1"><strong>₹ {item.price}</strong></span></p>
              <p className="pt-1">{item.description} Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam, sapiente illo. Sit
                error voluptas repellat rerum quidem, soluta enim perferendis voluptates laboriosam. Distinctio,
                officia quis dolore quos sapiente tempore alias.</p>
              <div className="table-responsive">
                <table className="table table-sm table-borderless mb-0">
                  <tbody>
                    <tr>
                      <th className="pl-0 w-25" scope="row"><strong>Color</strong></th>
                      <td>Red </td>
                    </tr>
                    <tr>
                      <th className="pl-0 w-25" scope="row"><strong>Category</strong></th>
                      <td>{item.category}</td>
                    </tr>
                    <tr>
                      <th className="pl-0 w-25" scope="row"><strong>Sub-Category</strong></th>
                      <td>{item.subCategory}</td>
                    </tr>
                  </tbody>
                </table>
              </div>
              <hr/>
              <div className="table-responsive mb-2">
                <table className="table table-sm table-borderless">
                  <tbody>
                    <tr>
                      <td className="pl-0 pb-0 w-25">Quantity</td>
                    </tr>
                    <tr>
                      <td className="pl-0">
                      {/*
                        <div className="def-number-input number-input safari_only mb-0">
                          <button onclick="this.parentNode.querySelector('input[type=number]').stepDown()"
                            className="minus"></button>
                          <input className="quantity" min="0" name="quantity" value="1" type="number"/>
                          <button onclick="this.parentNode.querySelector('input[type=number]').stepUp()"
                            className="plus"></button>
                      </div>*/}
                      </td>
                      Y</tr>
                  </tbody>
                </table>
              </div>
              <button type="button" className="btn btn-primary btn-md mr-1 mb-2">Buy now</button>
              <button type="button" className="btn btn-light btn-md mr-1 mb-2" onClick={this.onAddToCartClick}><i
                  className="fas fa-shopping-cart pr-2"></i>Add to cart</button>
            </div>
          </div>

        </section>
        </div>
    )
}

}
const mapStateToProps=state=>({
item:state.itemReducer.item
})
export default connect(mapStateToProps,{getItem})(ItemDetailsPage);

DEV Community: Keshav Kumar Naharwar

How to prevent folder to deploy on Azure app serive

TypeError: Cannot read property 'map' of undefined

This is my action code:-

This is my reducer code:-

This is my ItemDetailsPage.js (where exactly i got error):-