{"id":19185497,"url":"https://github.com/qwikifiers/qwik-style-guide","last_synced_at":"2026-03-06T09:03:06.448Z","repository":{"id":64919766,"uuid":"570353321","full_name":"qwikifiers/qwik-style-guide","owner":"qwikifiers","description":"A Style Guide For Qwik","archived":false,"fork":false,"pushed_at":"2023-07-01T09:13:45.000Z","size":14,"stargazers_count":12,"open_issues_count":3,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-07-02T04:42:34.036Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":null,"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/qwikifiers.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","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":"2022-11-25T01:17:08.000Z","updated_at":"2025-02-07T09:37:31.000Z","dependencies_parsed_at":"2024-11-09T11:10:52.594Z","dependency_job_id":"b0dda11d-f4c0-441a-8435-719d18347eb4","html_url":"https://github.com/qwikifiers/qwik-style-guide","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/qwikifiers/qwik-style-guide","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/qwikifiers%2Fqwik-style-guide","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/qwikifiers%2Fqwik-style-guide/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/qwikifiers%2Fqwik-style-guide/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/qwikifiers%2Fqwik-style-guide/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/qwikifiers","download_url":"https://codeload.github.com/qwikifiers/qwik-style-guide/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/qwikifiers%2Fqwik-style-guide/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":30168608,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-03-06T07:56:45.623Z","status":"ssl_error","status_checked_at":"2026-03-06T07:55:55.621Z","response_time":250,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.6:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"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":[],"created_at":"2024-11-09T11:10:45.014Z","updated_at":"2026-03-06T09:03:06.411Z","avatar_url":"https://github.com/qwikifiers.png","language":null,"funding_links":[],"categories":[],"sub_categories":[],"readme":"\n# Qwik Style Guide\n\nCoding style guides are usually written after years of experience, lessons learned and feedback from real and big projects using a specific technology.\n\n[Qwik](https://qwik.builder.io/) is a new and revolutionary framework and because of that, many best practices are still being discovered as more Qwik apps are being built.\n\nThis guide is meant to serve as an ever evolving document, where best practices are being suggested, debated and added by Qwik community members.\n\nThe aim is to potentially \"graduate\" the most popular / agreed upon rules into the official Qwik docs and / or as rules for the Qwik ESLint plugin. \n\n\n\n\u003c!-- START doctoc generated TOC please keep comment here to allow auto update --\u003e\n\u003c!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE --\u003e\n## Table of Contents\n\n- [File Naming](#file-naming)\n  - [Use kebab-case for files](#use-kebab-case-for-files)\n- [Variables Naming](#variables-naming)\n  - [\"Sig\" Suffix for Signals](#sig-suffix-for-signals)\n- [Tasks](#tasks)\n  - [Tasks named functions](#tasks-named-functions)\n- [Translations](#translations)\n- [Inspirations \u0026 Credits](#inspirations--credits)\n- [License](#license)\n\n\u003c!-- END doctoc generated TOC please keep comment here to allow auto update --\u003e\n\n*generated with [DocToc](https://github.com/thlorenz/doctoc)*\n\n\n## File Naming\n### Use kebab-case for files\n\n  - Use the kebab case for file names\n\n#### Why? 🤔\nTo keep things consistent across the entire project.\n  \nThis is not a must rule, but whatever convention you use, stick with it. \n\n  \n\n#### Example\n\n```typescript\n/* avoid */\n\nsrc/\n  components/\n    MyComponent.tsx\n\n```\n\nPay attention to the file name below\n\n```typescript\n/* recommended */\n\nsrc/\n  components/\n    my-component.tsx\n\n```\n\n## Variables Naming\n\n### \"Sig\" Suffix for Signals\n\n  - Use the `Sig` suffix for signals variable names\n\n#### Why? 🤔\nTo make the component code more \"Scannable\" \n  \n#### Example\n\n```typescript\n/* avoid */\n\nconst counter = useSignal(0);\n\n```\n\nUse the `Sig` suffix for signals variable names.\n\n```typescript\n/* recommended */\n\nconst counterSig = useSignal(0);\n```\n\n**[Back to top](#table-of-contents)**\n\n\n## Tasks\n\n### Tasks named functions\n\n  - Use regular named functions instead of arrow functions for tasks and visible tasks.\n\n#### Why? 🤔\nWhen having several tasks inside a component, it's hard to understand what is each task doing without reading its implementation.\n\nSo having a regular function gives a name for the task describing its responsibility.\n\nPlus, it helps when debugging to see a named function in the call stack. \n  \n#### Example\n\n```typescript\n/* avoid */\n\nuseTask$(()=\u003e{ \n  // some code that should run when the component is created\n});\n\n```\n\nGive a descriptive name for the task callback function:\n\n```typescript\n/* recommended */\n\nuseTask$(function initTask(){ \n  // some code that should run when the component is created\n});\n```\n\n**[Back to top](#table-of-contents)**\n\n\n\n## Translations\n\nIf you want to translate this style guide, please feel free to submit a PR with a markdown file under `translations` folder `.md` file with the relevant locale (for example: `es-ES.md`)\n\n## Inspirations \u0026 Credits\n\nThis style guide structure is inspired by the [Angular Style guide](https://angular.io/guide/styleguide) and the [Vue Style Guide](https://vuejs.org/style-guide/). \n\n\n## License\nMIT\n\n(Feel free to use it, attributions are appreciated 😊)","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fqwikifiers%2Fqwik-style-guide","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fqwikifiers%2Fqwik-style-guide","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fqwikifiers%2Fqwik-style-guide/lists"}