{"id":20262583,"url":"https://github.com/nur-it/reactive-folder-structure","last_synced_at":"2026-04-21T05:33:19.825Z","repository":{"id":217628939,"uuid":"744331047","full_name":"nur-it/reactive-folder-structure","owner":"nur-it","description":"Reactive Folder Structure 2024","archived":false,"fork":false,"pushed_at":"2024-01-18T06:35:09.000Z","size":361,"stargazers_count":2,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-10-13T22:14:14.568Z","etag":null,"topics":["best-practices","boilarplate","folder-structure","react","router-dom-v6","tailwindcss","template"],"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/nur-it.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,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-01-17T04:31:46.000Z","updated_at":"2025-03-04T03:27:11.000Z","dependencies_parsed_at":"2024-01-17T15:44:35.351Z","dependency_job_id":"cc95baf9-759e-42b8-af73-4d412472fc7a","html_url":"https://github.com/nur-it/reactive-folder-structure","commit_stats":null,"previous_names":["nursoftwarebd/reactive-folder-structure","nur-it/reactive-folder-structure"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/nur-it/reactive-folder-structure","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nur-it%2Freactive-folder-structure","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nur-it%2Freactive-folder-structure/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nur-it%2Freactive-folder-structure/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nur-it%2Freactive-folder-structure/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/nur-it","download_url":"https://codeload.github.com/nur-it/reactive-folder-structure/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nur-it%2Freactive-folder-structure/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":279017159,"owners_count":26085983,"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-10-13T02:00:06.723Z","response_time":61,"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":["best-practices","boilarplate","folder-structure","react","router-dom-v6","tailwindcss","template"],"created_at":"2024-11-14T11:30:28.381Z","updated_at":"2025-10-13T22:14:15.756Z","avatar_url":"https://github.com/nur-it.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Reactive Folder Structure Documentation\n\nThis documentation provides an overview of the recommended folder structure for a reactive application. This structure is designed to enhance maintainability, scalability, and organization of your project. The structure is modular, making it easy to locate and manage different aspects of your application.\n\n## Table of Contents\n\n1. Introduction\n2. Folder Structure\n   - assets\n   - components\n     - screen\n     - shared\n   - lib\n   - services\n   - context\n   - hooks\n   - layouts\n   - pages\n   - redux\n     - app\n     - features\n   - styles\n   - utils\n3. Usage\n4. Contributing\n5. License\n\n## Introduction\n\nReactive applications benefit from a well-organized folder structure that promotes separation of concerns and ease of maintenance. This structure is based on modular components, with each folder serving a specific purpose. The goal is to enhance collaboration, reduce redundancy, and improve code readability.\n\n## Folder Structure\n\n### assets\n\nThe `assets` folder contains static resources such as images, icons, and fonts. This is the place to store media files used in your application.\n\n|-- assets/\n| |-- images/\n| |-- icons/\n| |-- fonts/\n\n### components\n\nThe `components` folder houses reusable React components. Organize them based on their functionality or type.\n\n|-- components/\n| |-- screen/\n| |-- shared/\n\n### lib\n\nThe `lib` folder is for utility libraries or external modules that are not specific to a particular feature or component.\n\n### services\n\nThe `services` folder is dedicated to managing communication with external services or APIs. Each service module within this folder encapsulates the logic related to making requests, handling responses, and managing the communication protocol for a specific external service. This modular approach allows for better organization and maintainability, making it easier to update or extend the interactions with external services independently.\n\n### shared\n\nThe `shared` folder contains shared utilities, constants, and functions that can be used across the application.\n\n### context\n\nThe `context` folder holds React context providers, facilitating state management at a higher level.\n\n|-- context/\n\n### hooks\n\nThe `hooks` folder contains custom React hooks that can be reused throughout the application.\n\n|-- hooks/\n\n### layouts\n\nThe `layouts` folder includes layout components that structure the overall page layout.\n\n|-- layouts/\n\n### pages\n\nThe `pages` folder contains top-level components that represent different pages in your application.\n\n|-- pages/\n\n### redux\n\nThe `redux` folder is dedicated to Redux state management.\n\n|-- redux/\n| |-- app/\n| |-- features/\n\n#### app\n\nThe `app` folder within `redux` contains global state management, reducers, and actions.\n\n#### features\n\nThe `features` folder within `redux` is where you organize features by grouping related components, actions, and reducers together.\n\n|-- redux/\n| |-- features/\n| |-- api/\n\n### styles\n\nThe `styles` folder contains global styles, theme files, or styling utilities.\n\n### utils\n\nThe `utils` folder is for general utility functions that don't fit into other categories.\n\n## Usage\n\nTo use this folder structure, simply organize your project based on the guidelines provided. Place relevant files and components in their respective folders.\n\nExample usage:\n\n```bash\ngit clone https://github.com/your-username/your-reactive-app.git\ncd your-reactive-app\n```\n\n## Contributing\n\nFeel free to contribute by opening issues, providing feedback, or submitting pull requests. Follow the contribution guidelines for more details.\n\n## License\n\nThis project is licensed under the MIT License. Feel free to use, modify, and distribute as per the terms of the license.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnur-it%2Freactive-folder-structure","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fnur-it%2Freactive-folder-structure","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnur-it%2Freactive-folder-structure/lists"}