{"id":15645177,"url":"https://github.com/anandchowdhary/remix-starter","last_synced_at":"2025-08-19T10:31:31.735Z","repository":{"id":40796846,"uuid":"451415872","full_name":"AnandChowdhary/remix-starter","owner":"AnandChowdhary","description":"💿 Starter for @remix-run with localized routing and i18n","archived":false,"fork":false,"pushed_at":"2024-06-18T08:50:32.000Z","size":882,"stargazers_count":57,"open_issues_count":3,"forks_count":3,"subscribers_count":4,"default_branch":"main","last_synced_at":"2024-12-12T17:16:07.788Z","etag":null,"topics":["i18n","javascript","nextjs","remix","remix-run","typescript"],"latest_commit_sha":null,"homepage":"https://remix-starter.netlify.app","language":"TypeScript","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/AnandChowdhary.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":"2022-01-24T10:22:46.000Z","updated_at":"2024-08-26T00:11:53.000Z","dependencies_parsed_at":"2024-08-03T03:11:47.530Z","dependency_job_id":null,"html_url":"https://github.com/AnandChowdhary/remix-starter","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AnandChowdhary%2Fremix-starter","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AnandChowdhary%2Fremix-starter/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AnandChowdhary%2Fremix-starter/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AnandChowdhary%2Fremix-starter/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/AnandChowdhary","download_url":"https://codeload.github.com/AnandChowdhary/remix-starter/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":230345781,"owners_count":18211997,"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","javascript","nextjs","remix","remix-run","typescript"],"created_at":"2024-10-03T12:04:57.816Z","updated_at":"2024-12-18T22:07:05.298Z","avatar_url":"https://github.com/AnandChowdhary.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# 💿 Remix Starter\n\nA Remix starter with intuitive defaults, like support for internationalization and localized URLs. Coming soon: Authentication and authorization, component documentation, and more!\n\n\u003e I built this in literally like 30 minutes to try out Remix. The amazing thing is that today, in 2022, Next.js still doesn't support localized URLs, and it took me a handful of minutes to set this up!\n\n## Features\n\n- 📕 Localized URLs by default\n- 🌎 Dependency-free typed translation\n- ...more coming soon!\n\n### Localized URLs by default\n\nInstead of going to `/` and `/about`, your users will always go to `/en-ch/` and `/en-ch/about` (in this example, the language is \"English - Switzerland, or en-ch). This is an SEO and i18n best practice, so you have unique URLs based on the language of your content.\n\n#### Redirection\n\nUsers will automatically by redirected to their language of choice. We parse the Accept-Language header and figure out the best language for the user.\n\n#### Language selection\n\nUsers can manually select their preferred language. We remember this in a cookie.\n\n\u003cimg width=\"754\" alt=\"CleanShot 2022-01-27 at 16 56 33@2x\" src=\"https://user-images.githubusercontent.com/2841780/151350017-c4c571d0-8633-4c5b-b3a5-04ee8be69b39.png\"\u003e\n\n#### Language recommendation\n\nIf your users have followed a link (say, on a search result) and have reached your site's version that we don't think is their preferred language, we show them a recommendation.\n\n\u003cimg width=\"918\" alt=\"CleanShot 2022-01-27 at 16 57 28@2x\" src=\"https://user-images.githubusercontent.com/2841780/151350156-458631a0-cf13-4b2e-8d5d-2e7ee9e6e9ad.png\"\u003e\n\n\n### Dependency-free typed translation\n\nThe [`app/data/i18n.json`](./app/data/i18n.json) contains all your translations. Don't worry, we never bundle the entire file; not even entire scopes — only the translations you actually use on a page are included, so your pages are always fast. You can generate this file using any i18n pipeline.\n\n\u003cdetails\u003e\n  \u003csummary\u003eScreenshot of i18n.json file\u003c/summary\u003e\n  \u003cimg width=\"365\" alt=\"CleanShot 2022-01-27 at 16 47 17@2x\" src=\"https://user-images.githubusercontent.com/2841780/151348610-69cf2445-6688-4cff-a80d-1e1c1f57f29d.png\"\u003e\n\u003c/details\u003e\n\nFirst, list the keys you require on a route:\n\n```ts\nconst i18nKeys = [\"hello\", \"world\"] as const;\n```\n\nThen, the `loader` function will fetch the translations in the current language:\n\n```ts\nconst i18nKeys = [\"hello\", \"world\"] as const;\ntype I18nKeys = typeof i18nKeys[number];\n\ntype LoaderData = {\n  i18n: Record\u003cI18nKeys, string\u003e;\n  products: { name: string }[];\n};\n\nexport let loader: LoaderFunction = (args): LoaderData =\u003e {\n  return {\n    i18n: loadTranslations\u003cI18nKeys\u003e(args.params.locale, i18nKeys),\n    products: [{ name: \"Pants\" }, { name: \"Jacket\" }],\n  };\n};\n```\n\nNow consume the translations with full type support:\n\n```ts\nconst { products, i18n } = useLoaderData\u003cLoaderData\u003e();\n```\n\n\u003cimg width=\"478\" alt=\"CleanShot 2022-01-27 at 16 50 50@2x\" src=\"https://user-images.githubusercontent.com/2841780/151349124-45e4f814-fde7-495b-9f16-e05554c330af.png\"\u003e\n\n\n## Development\n\nFrom your terminal:\n\n```sh\nnpm run dev\n```\n\nThis starts your app in development mode, rebuilding assets on file changes.\n\n## Deployment\n\nFirst, build your app for production:\n\n```sh\nnpm run build\n```\n\nThen run the app in production mode:\n\n```sh\nnpm start\n```\n\nNow you'll need to pick a host to deploy it to.\n\n### DIY\n\nIf you're familiar with deploying node applications, the built-in Remix app server is production-ready.\n\nMake sure to deploy the output of `remix build`\n\n- `build/`\n- `public/build/`\n\n### Using a Template\n\nWhen you ran `npx create-remix@latest` there were a few choices for hosting. You can run that again to create a new project, then copy over your `app/` folder to the new project that's pre-configured for your target server.\n\n```sh\ncd ..\n# create a new project, and pick a pre-configured host\nnpx create-remix@latest\ncd my-new-remix-app\n# remove the new project's app (not the old one!)\nrm -rf app\n# copy your app over\ncp -R ../my-old-remix-app/app app\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fanandchowdhary%2Fremix-starter","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fanandchowdhary%2Fremix-starter","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fanandchowdhary%2Fremix-starter/lists"}