{"id":30584232,"url":"https://github.com/jkazama/sample-ui-react","last_synced_at":"2025-08-29T09:03:18.454Z","repository":{"id":44303405,"uuid":"44380601","full_name":"jkazama/sample-ui-react","owner":"jkazama","description":"React.js + shadcn/ui + Vite","archived":false,"fork":false,"pushed_at":"2024-09-13T03:01:59.000Z","size":347,"stargazers_count":15,"open_issues_count":0,"forks_count":4,"subscribers_count":2,"default_branch":"master","last_synced_at":"2024-09-13T23:07:17.057Z","etag":null,"topics":["jotai","react","react-hook-form-zod","shadcn-ui","tailwindcss","tanstack-react-query","typescript","vite"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/jkazama.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2015-10-16T11:23:53.000Z","updated_at":"2024-09-13T02:59:34.000Z","dependencies_parsed_at":"2024-09-12T19:38:46.309Z","dependency_job_id":null,"html_url":"https://github.com/jkazama/sample-ui-react","commit_stats":null,"previous_names":[],"tags_count":15,"template":false,"template_full_name":null,"purl":"pkg:github/jkazama/sample-ui-react","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jkazama%2Fsample-ui-react","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jkazama%2Fsample-ui-react/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jkazama%2Fsample-ui-react/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jkazama%2Fsample-ui-react/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/jkazama","download_url":"https://codeload.github.com/jkazama/sample-ui-react/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jkazama%2Fsample-ui-react/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":272658791,"owners_count":24971604,"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","status":"online","status_checked_at":"2025-08-29T02:00:10.610Z","response_time":87,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"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":["jotai","react","react-hook-form-zod","shadcn-ui","tailwindcss","tanstack-react-query","typescript","vite"],"created_at":"2025-08-29T09:03:09.463Z","updated_at":"2025-08-29T09:03:18.442Z","avatar_url":"https://github.com/jkazama.png","language":"TypeScript","funding_links":[],"categories":["Boilerplates \u0026 Starters"],"sub_categories":[],"readme":"## sample-ui-react\n\n## Preface\n\nProject web resource ( HTML / CSS / JS ) based on [React](https://github.com/facebook/react) / [TypeScript](https://www.typescriptlang.org/) / [shadcn/ui](https://ui.shadcn.com/). It assumes the SPA ( Single Page Application ) model.\n\nThis is a simple implementation sample using the above libraries, not the library.\n\nWe expect one of the following as an API server for sample confirmation.\n\n- [sample-boot-jpa](https://github.com/jkazama/sample-boot-jpa)\n\n#### Getting Started\n\nFrontend Start (VSCode DevContainer)\nIt is necessary to do the following step.\n\n- Check Instablled Docker.\n- Check Instablled VSCode with DevContainer Extension.\n- API Server Started.\n\nDo the preparations for this sample in the next step.\n\n- You move to the cloned `sample-ui-react` directory.\n- Run command `code .`\n- Choose Open Container\n\nDo the dev server start in the next step.\n\n- Open VSCode Terminal.\n- `npm run dev`\n- Open Browser with `http://localhost:3000`\n  - User Login ID/Pass. `sample` / `sample`\n\n#### Use policy of React\n\n- BtoB management sites in mind.\n- [Vite](https://github.com/vitejs/vite) is used as it is based on SPA\n- Layout in shadcn/ui and [Tailwind CSS](https://tailwindcss.com/)\n- State management is used by React Hooks, [React Hook Form](https://react-hook-form.com/) with [Zod](https://github.com/colinhacks/zod), [Jotai](https://jotai.org/) and [TanStackQuery](https://tanstack.com/query/latest).\n- Page transitions use [React Router](https://reactrouter.com/en/main).\n\n#### Resource\n\nRefer to the following for the package / resource constitution.\n\n```\n+ .devcontainer      … DevContainer Related definitions\n+ .vscode            … VS Code Related Definitions\n+ public             … Vite Public Resources (Web Root)\n+ src                … Vite Development Resources\n- .editorconfig      … Format Auto-Formatting Rules (EditorConfig)\n- .env               … Environment Variable (Production)\n- .env.development   … Environment Variable (Development)\n- .eslintrc.js       … ES Lint Rule\n- components.json    … shadcn/ui Related Definitions\n- index.html         … Vite SPA Entry file\n- package.json       … NPM Package\n- postcss.config.cjs … CSS-Related Definitions\n- tailwind.confg.js  … TailwindCSS Related Definitions\n- tsconfig.json      … TypeScript Related Definitions\n- vite.config.ts     … Vite Related Definitions\n```\n\n```\n/src\n\n+ assets         … Static Resources where references via code.\n+ components     … UI Component Implementation (global domain)\n  + auth         … UI Components for Authentication\n  + layout       … UI Components for Site Layouts\n  + ui           … UI components using shadcn/ui\n+ features       … Feature (Domain) Specific Implementation\n  + *domain*     … Specific Domain Implementation\n    + components … UI Component Implementation\n    + hooks      … Hooks Implementation for Business Processes\n      + api      … API Integration Implementation with Backend\n    + types      … Type Definitions\n+ hooks          … Hooks Implementation for Business Processes (global domain)\n+ lib            … Simple Libraries that are not Dependent on a Framework\n+ providers      … Infrastructure Provider\n  - app.ts       … React Common Processes\n  - query.tsx    … TanStack Query Common Processes\n+ routes         … Routing Definition using ReactRouter.\n+ types          … Type Definitions (global domain)\n- App.tsx        … Root Component\n- index.css      … Standard CSS Definition\n- main.tsx       … SPA Entry Implementation\n- vite-env.d.ts  … TypeScript Extension Definition for Vite\n```\n\n### License\n\nThe license of this sample includes a code and is all _MIT License_.\nUse it as a base implementation at the time of the project start using Spring Boot.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjkazama%2Fsample-ui-react","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjkazama%2Fsample-ui-react","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjkazama%2Fsample-ui-react/lists"}