{"id":13942190,"url":"https://github.com/noclocks/frontend","last_synced_at":"2025-10-06T21:13:11.234Z","repository":{"id":227108013,"uuid":"764804994","full_name":"noclocks/frontend","owner":"noclocks","description":"No Clocks Front-End Development","archived":false,"fork":false,"pushed_at":"2024-05-13T18:41:13.000Z","size":999,"stargazers_count":2,"open_issues_count":1,"forks_count":2,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-07-20T05:52:19.434Z","etag":null,"topics":["documentation","frontend","javascript","radix","react","remix","techstack","typescript","web","website"],"latest_commit_sha":null,"homepage":"","language":"MDX","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"unlicense","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/noclocks.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.md","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},"funding":{"custom":["https://www.paypal.me/noclocks","https://pay.noclocks.dev/b/7sI5o93U4gng9gs5kl"]}},"created_at":"2024-02-28T18:37:43.000Z","updated_at":"2024-05-13T18:41:16.000Z","dependencies_parsed_at":"2024-03-27T02:24:40.669Z","dependency_job_id":"081db3cf-3eff-406a-9794-5389ab7e6f61","html_url":"https://github.com/noclocks/frontend","commit_stats":null,"previous_names":["noclocks/frontend"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/noclocks/frontend","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/noclocks%2Ffrontend","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/noclocks%2Ffrontend/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/noclocks%2Ffrontend/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/noclocks%2Ffrontend/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/noclocks","download_url":"https://codeload.github.com/noclocks/frontend/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/noclocks%2Ffrontend/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":269963282,"owners_count":24504302,"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-11T02:00:10.019Z","response_time":75,"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":["documentation","frontend","javascript","radix","react","remix","techstack","typescript","web","website"],"created_at":"2024-08-08T02:01:44.591Z","updated_at":"2025-10-06T21:13:06.168Z","avatar_url":"https://github.com/noclocks.png","language":"MDX","readme":"# No Clocks Frontend\n\n\u003e This repository represents the tech stack and architecture for No Clocks frontend development.\n\n## Contents\n\n- [No Clocks Frontend](#no-clocks-frontend)\n  - [Contents](#contents)\n  - [Introduction](#introduction)\n  - [Tech Stack](#tech-stack)\n  - [Architecture](#architecture)\n  - [Development](#development)\n  - [Deployment](#deployment)\n  - [Contributing](#contributing)\n\n## Introduction\n\nThis repository serves as a foundation for all frontend development at No Clocks, LLC.\n\n## Tech Stack\n\n- [Remix](https://remix.run/) is the Web Framework of choice for No Clocks. Remix is a full-stack web framework that lets you build web apps with [React](https://reactjs.org/), server-rendered pages, and a data-fetching layer all in one.\n- Static Types are enforced with [TypeScript](https://www.typescriptlang.org/).\n- An excellent, customizable component library with [Radix UI](https://radix-ui.com/), a collection of low-level UI components and utility functions for React.\n- [shadcn/ui](https://ui.shadcn.com/) is the component library of choice for No Clocks. It is a collection of accessible, reusable, and composable React components.\n- [Vite](https://vitejs.dev/) is the build tool of choice for No Clocks. It is a fast, opinionated frontend build tool that provides a lightning-fast development experience.\n- [Storybook](https://storybook.js.org/) is used for component development and documentation.\n- Error Monitoring is handled by [Rollbar](https://rollbar.com/).\n- [Docker](https://www.docker.com/) (and [Docker Compose](https://docs.docker.com/compose/)) is used for local development, containerization, and deployment.\n- [Fly.io](https://fly.io/) is used for hosting and deployment.\n- [GitHub Actions](https://github.com/features/actions) used for CI/CD (testing, linting, and deployment).\n- [ESLint](https://eslint.org/) and [Prettier](https://prettier.io/) are used for code linting and formatting.\n- End-to-end testing is handled by [Playwright](https://playwright.dev/).\n- Unit testing is handled by [Vitest](https://vitejs.dev/guide/features.html#testing) and the [React Testing Library](https://testing-library.com/docs/react-testing-library/intro/).\n- [PNPM](https://pnpm.io/) is used for package management.\n\nFuture additions:\n\n- Database ORM is handled by [Prisma](https://www.prisma.io/).\n- Runtime schema validation is handled by `Zod`\n- [Jest](https://jestjs.io/) is used for testing.\n- E-commerce functionality is handled by [Stripe](https://stripe.com/).\n\nFuture Considerations:\n- [Biome](https://biomejs.dev/)\n- [Astro](https://astro.build/)\n\n## Architecture\n\nThe frontend architecture is based on the [Remix](https://remix.run/) framework. Remix is a full-stack web framework that lets you build web apps with React, server-rendered pages, and a data-fetching layer all in one.\n\nThe frontend is a monolithic application that is split into the following directories and files:\n\n- `src/` contains the main source code for the application.\n  - `app/` contains the main application code.\n    - `components/` contains the shared components.\n    - `routes/` contains the routes for the application.\n    - `styles/` contains the global styles for the application.\n    - `utils/` contains shared utility functions.\n    - `entry.client.tsx` is the entry point for the client-side code.\n    - `entry.server.tsx` is the entry point for the server-side code.\n    - `root.tsx` is the root component for the application.\n  - `public/` contains the public assets for the application.\n    - `favicons/` contains the favicons for the application.\n    - `img/` contains the images for the application.\n    - `robots.txt` is the robots.txt file for the application.\n    - `favicon.ico` is the favicon for the application.\n    - `site.webmanifest` is the web manifest for the application.\n  - `types/` contains shared types.\n  - `hooks/` contains shared hooks.\n  - `lib/` contains shared utility functions.\n  - `stories/` contains the stories for the components.\n- `tests/` contains the tests for the application.\n  - `e2e/` contains the end-to-end tests for the application.\n  - `fixtures/` contains the fixtures for the tests.\n  - `mocks/` contains the mocks for the tests.\n  - `setup/` contains the setup for the tests.\n  - `integration/` contains the integration tests for the application.\n  - `unit/` contains the unit tests for the application.\n- `docs/` contains the documentation for the application, written in Markdown.\n- `assets/` contains static, repo-wide assets.\n- `examples/` contains example code for the application.\n- `scripts/` contains the scripts for the application.\n- `config/` contains the configuration for the application.\n- `.storybook/` contains the Storybook configuration for the application.\n- `.github/` contains the GitHub Actions configuration for the application.\n- `.vscode/` contains the Visual Studio Code configuration for the application.\n\n\n## Development\n\nTo get started with development, clone the repository and run the following commands:\n\n```bash\npnpm install\npnpm dev\n```\n\nThis will start the development server at `http://localhost:3000`.\n\n## Deployment\n\nThe application is deployed using [Fly.io](https://fly.io/). The deployment process is handled by GitHub Actions.\n\n## Contributing\n\nPlease read the [CONTRIBUTING.md](CONTRIBUTING.md) file for more information on how to contribute to this repository.\n","funding_links":["https://www.paypal.me/noclocks","https://pay.noclocks.dev/b/7sI5o93U4gng9gs5kl"],"categories":["MDX"],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnoclocks%2Ffrontend","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fnoclocks%2Ffrontend","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnoclocks%2Ffrontend/lists"}