{"id":15099491,"url":"https://github.com/doic/diabolocom-frontend-task","last_synced_at":"2026-01-06T10:56:05.877Z","repository":{"id":224368630,"uuid":"759876163","full_name":"doic/diabolocom-frontend-task","owner":"doic","description":"ViteJS Vue TypeScript project that implements internationalization (i18n) in both English and French for four distinct Vue components.","archived":false,"fork":false,"pushed_at":"2024-02-26T12:20:17.000Z","size":549,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-02-01T18:11:19.517Z","etag":null,"topics":["i18n","tailwind","vue3","webcomponents"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":false,"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/doic.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-02-19T14:01:58.000Z","updated_at":"2024-02-25T17:21:19.000Z","dependencies_parsed_at":"2024-02-25T15:45:11.735Z","dependency_job_id":"329b5ecc-b680-4ddf-b8ac-47729bd1f4bb","html_url":"https://github.com/doic/diabolocom-frontend-task","commit_stats":null,"previous_names":["doic/diabolocom-frontend-task"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/doic%2Fdiabolocom-frontend-task","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/doic%2Fdiabolocom-frontend-task/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/doic%2Fdiabolocom-frontend-task/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/doic%2Fdiabolocom-frontend-task/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/doic","download_url":"https://codeload.github.com/doic/diabolocom-frontend-task/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":245855335,"owners_count":20683483,"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":["i18n","tailwind","vue3","webcomponents"],"created_at":"2024-09-25T17:22:13.864Z","updated_at":"2026-01-06T10:56:05.833Z","avatar_url":"https://github.com/doic.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Diabolocom Frontend Task\n\n![Vue page](./docs/vue_page.png)\n\nThis project is a demonstration of specific components development using [ViteJS](https://vitejs.dev/), [VueJS](https://vuejs.org/), [TypeScript](https://www.typescriptlang.org/) and [TailwindCSS](https://tailwindcss.com/).\n\n- [Full requirements for the task](docs/REQUIREMENTS.md)\n- [Development process](docs/DEVELOPMENT_PROCESS.md)\n- [How to use the components](docs/HOWTO.md)\n\n## Project Setup\n\nFirst, clone this repo:\n\n```sh\n# With GitHub CLI\ngh repo clone doic/diabolocom-frontend-task\n\n# Or with git CLI\ngit clone https://github.com/doic/diabolocom-frontend-task.git\n```\n\nInstall all dependencies:\n\n```sh\nnpm install\n```\n\nOn Mac, if you run into an error about `canvas` package, you can fix it this way:\n\n```sh\nbrew install pkg-config cairo pango libpng jpeg giflib librsvg\n\nbrew update\n\nbrew upgrade\n\nnpm i\n```\n\n### Run Development Server\n\nIf you want to tweak the components\n\n```sh\nnpm run dev\n```\n\nSee [how to use the components](docs/HOWTO.md)\n\n### Build Options\n\nThis command will build both Vue components and Web components:\n\n```sh\nnpm run build\n```\n\nYou can choose which components to build:\n\n```sh\n# Build only Vue components:\nnpm run build-vue\n\n# Build only Web components:\nnpm run build-wc\n```\n\n### Run Unit Tests with [Vitest](https://vitest.dev/)\n\n```sh\nnpm run test:unit\n```\n\n### Run E2E Tests with [Playwright](https://playwright.dev)\n\n```sh\n# Install browsers for the first run\nnpx playwright install\n\n# Build the project before running the e2e tests\nnpm run build\n\n# Runs the e2e tests\nnpm run test:e2e\n# Runs the tests only for Vue components\nnpm run test:e2e -- vue.spec.ts\n# Runs the tests only for Web components\nnpm run test:e2e -- wc.spec.ts\n```\n\n### See the components live\n\n| [![Vue page](./docs/vue_page.png)](https://diabolocom-frontend-task.vercel.app/)  | [![Wc page](./docs/wc_page.png)](https://diabolocom-frontend-task-wc.vercel.app/)  |\n| --------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------- |\n| \u003ccenter\u003e[VueJs components](https://diabolocom-frontend-task.vercel.app/)\u003c/center\u003e | \u003ccenter\u003e[Web components](https://diabolocom-frontend-task-wc.vercel.app/)\u003c/center\u003e |\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdoic%2Fdiabolocom-frontend-task","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdoic%2Fdiabolocom-frontend-task","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdoic%2Fdiabolocom-frontend-task/lists"}