{"id":47341,"library":"croods","title":"Croods","description":"Croods is a React library that abstracts REST API data layers, providing a declarative component-based API for CRUD operations. The current stable version is 3.1.0. It requires axios, lodash, react, and react-dom as peer dependencies. Key differentiators include a simple Fetch component for GET requests, built-in state management, and TypeScript support. It is designed to reduce boilerplate code when integrating REST backends with React applications. npm: croods, GitHub: SeasonedSoftware/croods, docs: croods.netlify.com. Released on npm, last update 2021.","status":"maintenance","version":"3.1.0","language":"javascript","source_language":"en","source_url":"https://github.com/SeasonedSoftware/croods","tags":["javascript","typescript"],"install":[{"cmd":"npm install croods","lang":"bash","label":"npm"},{"cmd":"yarn add croods","lang":"bash","label":"yarn"},{"cmd":"pnpm add croods","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"HTTP client for REST API calls","package":"axios","optional":false},{"reason":"Utility library for data manipulation","package":"lodash","optional":false},{"reason":"Peer dependency for React components","package":"react","optional":false},{"reason":"Peer dependency for React DOM rendering","package":"react-dom","optional":false}],"imports":[{"note":"Fetch is a named export, not default. Requires React 16.8+.","wrong":"import Fetch from 'croods'","symbol":"Fetch","correct":"import { Fetch } from 'croods'"},{"note":"Default export is an object with helper functions like createCroods; named exports are components. Check your import type.","wrong":"import { croods } from 'croods'","symbol":"croods","correct":"import croods from 'croods'"},{"note":"Hook named export. Hooks cannot be used outside React function components.","wrong":"import useCroodsState from 'croods'","symbol":"useCroodsState","correct":"import { useCroodsState } from 'croods'"}],"quickstart":{"code":"import React from 'react'\nimport { Fetch } from 'croods'\n\nconst App = () => (\n  <Fetch\n    baseUrl=\"https://dog.ceo/api/breed/beagle\"\n    name=\"images\"\n    parseResponse={response => response.data.message}\n    render={list => (\n      <div>\n        <h1>Hello Beagles!</h1>\n        <ul>\n          {list.map((item, index) => (\n            <li key={index}><img src={item} alt={`Beagle ${index}`} /></li>\n          ))}\n        </ul>\n      </div>\n    )}\n  />\n)\n\nexport default App","lang":"typescript","description":"Basic usage of the Fetch component to GET a list of beagle images from an API and render them."},"warnings":[{"fix":"Migrate to v3 with Fetch component. See migration guide.","message":"Croods v2 had a different component API (Info, List, etc.) that was removed in v3.","severity":"deprecated","affected_versions":"<3.0.0"},{"fix":"Ensure unique 'name' per unique resource unless sharing state is intended.","message":"The 'name' prop in Fetch is required and used for caching; two Fetch with same 'name' will share state.","severity":"gotcha","affected_versions":">=3.0.0"},{"fix":"Always return the parsed data from parseResponse.","message":"parseResponse must return the data array; otherwise render receives undefined.","severity":"gotcha","affected_versions":">=3.0.0"},{"fix":"Install exact versions: npm install react@17.0.2 react-dom@17.0.2 axios@0.21.1 lodash@4.17.21","message":"Peer dependencies require exact versions: react@^17.0.2, react-dom@^17.0.2, axios@^0.21.1, lodash@^4.17.21. Incompatible versions may cause runtime errors.","severity":"breaking","affected_versions":">=3.0.0"}],"env_vars":null,"search_vec":"'2021':84 '3.1.0':28 'abstract':8 'api':10,19 'applic':72 'axio':31 'backend':69 'base':18 'boilerpl':64 'built':52 'built-in':51 'code':65 'compon':17,47 'component-bas':16 'crood':1,2,74 'croods.netlify.com':78 'crud':21 'current':24 'data':11 'declar':15 'depend':40 'design':61 'differenti':42 'doc':77 'dom':37 'fetch':46 'get':49 'github':75 'includ':43 'integr':67 'javascript':85 'key':41 'last':82 'layer':12 'librari':6 'lodash':32 'manag':55 'npm':73,81 'oper':22 'peer':39 'provid':13 'react':5,33,36,71 'react-dom':35 'reduc':63 'releas':79 'request':50 'requir':30 'rest':9,68 'seasonedsoftware/croods':76 'simpl':45 'stabl':25 'state':54 'support':58 'typescript':57,86 'updat':83 'version':26","created_at":"2026-06-07T16:51:02.538144+00:00","updated_at":"2026-06-07T16:51:02.538144+00:00","problems":[{"fix":"npm install croods --save","cause":"Package not installed.","error":"Module not found: Can't resolve 'croods'"},{"fix":"Ensure parseResponse returns the array, e.g., response.data.message","cause":"parseResponse not returning correct data.","error":"TypeError: Cannot read property 'map' of undefined"},{"fix":"Use the hook inside a function component, not a class or regular function.","cause":"useCroodsState used outside a React function component.","error":"Error: Invalid hook call. Hooks can only be called inside of the body of a function component."}],"ecosystem":"npm","meta_description":null,"install_score":null,"quickstart_score":null,"quickstart_tag":null,"pypi_latest":null,"cli_name":null,"cli_version":null,"type":"library","homepage":"https://github.com/SeasonedSoftware/croods#readme","github":"https://github.com/SeasonedSoftware/croods","docs":null,"changelog":null,"pypi":null,"npm":"croods","openapi_spec":null,"status_page":null,"smithery":null,"categories":["testing"],"base_url":null,"auth_type":null,"provenance":{"verified_status":null,"verified_at":null,"last_verified":"2026-06-07","next_check":"2026-09-05","install_tag":null}}