{"id":26462913,"url":"https://github.com/clerk/clerk-remix-quickstart","last_synced_at":"2025-03-19T06:26:07.717Z","repository":{"id":217451198,"uuid":"743911559","full_name":"clerk/clerk-remix-quickstart","owner":"clerk","description":"Learn how to use Clerk to quickly add secure authentication and user management to your Remix application. This repo assumed you are using Remix v2 or later","archived":false,"fork":false,"pushed_at":"2024-09-17T16:54:27.000Z","size":925,"stargazers_count":7,"open_issues_count":0,"forks_count":3,"subscribers_count":2,"default_branch":"main","last_synced_at":"2024-09-17T20:52:09.017Z","etag":null,"topics":["authentication","clerk","quickstart","react","remix","tempalte"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":false,"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/clerk.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"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":"2024-01-16T08:52:35.000Z","updated_at":"2024-09-17T16:54:31.000Z","dependencies_parsed_at":"2024-06-06T14:04:40.881Z","dependency_job_id":"c0c1a38b-bf54-4513-a79d-c38a16b92bf7","html_url":"https://github.com/clerk/clerk-remix-quickstart","commit_stats":null,"previous_names":["domitriusclark/clerk-remix-v2","clerk/clerk-remix-v2"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/clerk%2Fclerk-remix-quickstart","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/clerk%2Fclerk-remix-quickstart/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/clerk%2Fclerk-remix-quickstart/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/clerk%2Fclerk-remix-quickstart/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/clerk","download_url":"https://codeload.github.com/clerk/clerk-remix-quickstart/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":244367539,"owners_count":20441905,"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":["authentication","clerk","quickstart","react","remix","tempalte"],"created_at":"2025-03-19T06:26:07.112Z","updated_at":"2025-03-19T06:26:07.709Z","avatar_url":"https://github.com/clerk.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://clerk.com?utm_source=DevRel\u0026utm_medium=docs\u0026utm_campaign=templates\u0026utm_content=clerk-remix-quickstart\" target=\"_blank\" rel=\"noopener noreferrer\"\u003e\n    \u003cpicture\u003e\n      \u003csource media=\"(prefers-color-scheme: dark)\" srcset=\"./public/light-logo.png\"\u003e\n      \u003cimg alt=\"Clerk Logo for light background\" src=\"./public/dark-logo.png\" height=\"64\"\u003e\n    \u003c/picture\u003e\n  \u003c/a\u003e\n  \u003cbr /\u003e\n\u003c/p\u003e\n\u003cdiv align=\"center\"\u003e\n  \u003ch1\u003e\n    Clerk and Remix Quickstart\n  \u003c/h1\u003e\n  \u003ca href=\"https://www.npmjs.com/package/@clerk/clerk-react\"\u003e\n    \u003cimg alt=\"Downloads\" src=\"https://img.shields.io/npm/dm/@clerk/clerk-react\" /\u003e\n  \u003c/a\u003e\n  \u003ca href=\"https://discord.com/invite/b5rXHjAg7A\"\u003e\n    \u003cimg alt=\"Discord\" src=\"https://img.shields.io/discord/856971667393609759?color=7389D8\u0026label\u0026logo=discord\u0026logoColor=ffffff\" /\u003e\n  \u003c/a\u003e\n  \u003ca href=\"https://twitter.com/clerkdev\"\u003e\n    \u003cimg alt=\"Twitter\" src=\"https://img.shields.io/twitter/url.svg?label=%40clerkdev\u0026style=social\u0026url=https%3A%2F%2Ftwitter.com%2Fclerkdev\" /\u003e\n  \u003c/a\u003e\n  \u003cbr /\u003e\n  \u003cbr /\u003e\n  \u003cimg alt=\"Clerk Hero Image\" src=\"./public/hero.png\"\u003e\n\u003c/div\u003e\n\n## Introduction\n\nClerk is a developer-first authentication and user management solution. It provides pre-built components and hooks for sign-in, sign-up, user profile, and organization management. Clerk is designed to be easy to use and customize, and can be integrated into any Remix application.\n\nAfter following the [Clerk Remix quickstart](https://clerk.com/docs/quickstarts/remix?utm_source=DevRel\u0026utm_medium=docs\u0026utm_campaign=templates\u0026utm_content=clerk-remix-quickstart), you will have learned how to:\n\n- Install `@clerk/remix`\n- Set your Clerk API keys\n- Configure `rootAuthLoader`\n- Configure `ClerkApp`\n- Protect your pages\n\n## Deploy\n\nEasily deploy the template to Vercel with the button below. You will need to set the required environment variables in the Vercel dashboard.\n\n[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fclerk%2Fclerk-remix-quickstart\u0026env=REMIX_CLERK_PUBLISHABLE_KEY,CLERK_SECRET_KEY\u0026envDescription=Clerk%20API%20keys\u0026envLink=https%3A%2F%2Fclerk.com%2Fdocs%2Fquickstart%2Fremix\u0026redirect-url=https%3A%2F%2Fclerk.com%2Fdocs%2Fquickstart%2Fremix)\n\n## Running the template\n\n```bash\ngit clone https://github.com/clerk/clerk-remix-quickstart\n```\n\nTo run the example locally, you need to:\n\n1. Sign up for a Clerk account at [https://clerk.com](https://www.clerk.com?utm_source=DevRel\u0026utm_medium=docs\u0026utm_campaign=templates\u0026utm_content=clerk-remix-quickstart).\n\n2. Go to the [Clerk dashboard](https://dashboard.clerk.com) and create an application.\n\n3. Set the required Clerk environment variables as shown in [the example `env` file](./.env.sample).\n\n4. `npm install` the required dependencies.\n\n5. `npm run dev` to launch the development server.\n\n## Where the magic happens\n\nIn Remix, `app/root.tsx` wraps your entire application in both server and browser contexts. Clerk makes two modifications to this file so the authentication state is shared with your Remix routes.\n\n1. `rootAuthLoader` exported as `loader`.\n2. The default export wrapped with `ClerkApp`.\n\nFor more details, please refer to the [Remix quickstart](https://clerk.com/docs/quickstarts/remix?utm_source=DevRel\u0026utm_medium=docs\u0026utm_campaign=templates\u0026utm_content=clerk-remix-quickstart) guide, or take a look at the [`app/root.tsx`](./app/root.tsx) file.\n\n## Learn more\n\nTo learn more about Clerk and Remix, check out the following resources:\n\n- [Quickstart: Get started with Remix and Clerk](https://clerk.com/docs/quickstarts/remix?utm_source=DevRel\u0026utm_medium=docs\u0026utm_campaign=templates\u0026utm_content=clerk-remix-quickstart)\n\n- [Clerk Documentation](https://clerk.com/docs?utm_source=DevRel\u0026utm_medium=docs\u0026utm_campaign=templates\u0026utm_content=clerk-remix-quickstart)\n- [Remix Documentation](https://remix.run/docs?utm_source=DevRel\u0026utm_medium=docs\u0026utm_campaign=templates\u0026utm_content=clerk-remix-quickstart)\n\n## Found an issue or want to leave feedback\n\nFeel free to create a support thread on our [Discord](https://clerk.com/discord). Our support team will be happy to assist you in the `#support` channel.\n\n## Connect with us\n\nYou can discuss ideas, ask questions, and meet others from the community in our [Discord](https://discord.com/invite/b5rXHjAg7A).\n\nIf you prefer, you can also find support through our [Twitter](https://twitter.com/ClerkDev), or you can [email](mailto:support@clerk.dev) us!\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fclerk%2Fclerk-remix-quickstart","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fclerk%2Fclerk-remix-quickstart","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fclerk%2Fclerk-remix-quickstart/lists"}