{"id":15310784,"url":"https://github.com/gsimone/cra-template-cracodile","last_synced_at":"2025-06-20T17:06:45.560Z","repository":{"id":57210411,"uuid":"276348161","full_name":"gsimone/cra-template-cracodile","owner":"gsimone","description":"🐊 A create-react-app template with tailwind and nice-to-haves","archived":false,"fork":false,"pushed_at":"2020-09-08T17:42:44.000Z","size":267,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-06-20T17:06:02.175Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/gsimone.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2020-07-01T10:30:25.000Z","updated_at":"2020-09-08T17:42:43.000Z","dependencies_parsed_at":"2022-09-01T08:10:40.184Z","dependency_job_id":null,"html_url":"https://github.com/gsimone/cra-template-cracodile","commit_stats":null,"previous_names":["gsimone/cracodile"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/gsimone/cra-template-cracodile","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gsimone%2Fcra-template-cracodile","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gsimone%2Fcra-template-cracodile/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gsimone%2Fcra-template-cracodile/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gsimone%2Fcra-template-cracodile/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/gsimone","download_url":"https://codeload.github.com/gsimone/cra-template-cracodile/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gsimone%2Fcra-template-cracodile/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":260985153,"owners_count":23092884,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-10-01T08:29:30.320Z","updated_at":"2025-06-20T17:06:40.527Z","avatar_url":"https://github.com/gsimone.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"A custom create-react-app template\n\n### Install\n\n```\nnpx create-react-app --template cracodile my-app\n```\n\n### What's included\n\n- [tailwindcss](https://tailwindcss.com/)\n- [craco](https://github.com/gsoft-inc/craco)\n  - postcss-import\n  - autoprefixer\n  - css-nano\n  - tailwind\n- [Inter variable webfont](https://rsms.me/inter/)\n- prettier + pretty-quick at pre-commit via husky\n- .editorconfig\n- npm-check-updates via script `yarn ncu`\n\n### Adding the 3D package\n\nTo add the usual 3D package:\n\n```bash\nyarn add threejs react-three-fiber drei react-spring@next\n```\n\n- three.js\n- react-three-fiber\n- react-spring\n- drei\n\nHere's a quick scene to copy-paste:\n\n```jsx\nimport React, { Suspense } from \"react\";\nimport { Canvas } from \"react-three-fiber\";\nimport { OrbitControls, StandardEffects, Box } from \"drei\";\n\nfunction App() {\n  return (\n    \u003cCanvas\n      shadowMap\n      colorManagement\n      camera={{ position: [-4, 4, -4], far: 50 }}\n      style={{\n        background: \"#121212\",\n      }}\n    \u003e\n      \u003cambientLight /\u003e\n      \u003cspotLight\n        intensity={2}\n        position={[20, 20, 20]}\n        shadow-bias={-0.00005}\n        angle={Math.PI / 6}\n        shadow-mapSize-width={2048}\n        shadow-mapSize-height={2048}\n        castShadow\n      /\u003e\n      \u003cBox /\u003e\n      \u003cSuspense fallback={null}\u003e\n        \u003cStandardEffects smaa bloom={{ luminanceThreshold: 0.99 }} /\u003e\n      \u003c/Suspense\u003e\n      \u003cOrbitControls /\u003e\n    \u003c/Canvas\u003e\n  );\n}\n\nexport default App;\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgsimone%2Fcra-template-cracodile","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fgsimone%2Fcra-template-cracodile","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgsimone%2Fcra-template-cracodile/lists"}