Netlify Lambda function CRA - "map is not a function"

I created a lambda function to use in my CRA project to hide my token. I know the lambda function works, because I get 200 in the networks tabs. I console.log the news data, and it appears in an array…

However I get an error “map is not a function” on my components page. And none of my data appears on the browser.

I am not sure what is wrong, as it was working just fine before I added the lambda function… and the function seems to work, since I get 200.


unction CardsContainer() {
  const [news1, setNews1] = useState([]);

  useEffect(() => {
      .then((response) => response.json())
      .then((data) => {
        return setNews1(data.articles);
  }, []);

  return (
    <div className="right-side">
      {, index) => (
        <Cards key={index} props={lemons} />

export default CardsContainer;

lambda function:

import axios from "axios";
//lambda function
export async function handler(event, context) {
  //inside is our own logic

  try {
    const response = await axios.get(
    ); //get data
    const data =; // store response to a variable
    return {
      statusCode: 200,
      body: JSON.stringify({ data }), //return response as a json obj to the screen
  } catch (err) {
    console.log(err); // output to netlify function log
    return {
      statusCode: 500,
      body: JSON.stringify({ msg: err.message }), // Could be a custom message or object i.e. JSON.stringify(err)

my console.log of news:

  1. Object
  2. articleCount: 10
  3. articles: (10) [{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}]

Hey there, @ainneo :wave:

Thank you for reaching out! Apologies for the slow response here. I see that it has been a few days since you brought up this question. Are you still encountering this obstacle? If so, please let us know what you have tried in the interim!