{"id":25392642,"url":"https://github.com/morewings/next-card","last_synced_at":"2025-04-10T01:44:55.364Z","repository":{"id":275149498,"uuid":"924283747","full_name":"morewings/next-card","owner":"morewings","description":"Business card (aka link in bio) website template","archived":false,"fork":false,"pushed_at":"2025-04-01T06:39:10.000Z","size":13402,"stargazers_count":7,"open_issues_count":5,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-04-01T07:35:23.773Z","etag":null,"topics":["business-card","link-in-bio","link-in-bio-template","link-instagram","nextjs"],"latest_commit_sha":null,"homepage":"https://morewings.github.io/next-card/","language":"TypeScript","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/morewings.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":"2025-01-29T18:25:08.000Z","updated_at":"2025-03-21T14:29:00.000Z","dependencies_parsed_at":"2025-04-01T07:28:40.366Z","dependency_job_id":"fe831525-45a5-4e6c-89ae-04bdca534dfd","html_url":"https://github.com/morewings/next-card","commit_stats":null,"previous_names":["morewings/next-card"],"tags_count":0,"template":true,"template_full_name":"morewings/ts-global-state-next","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/morewings%2Fnext-card","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/morewings%2Fnext-card/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/morewings%2Fnext-card/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/morewings%2Fnext-card/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/morewings","download_url":"https://codeload.github.com/morewings/next-card/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248142522,"owners_count":21054665,"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":["business-card","link-in-bio","link-in-bio-template","link-instagram","nextjs"],"created_at":"2025-02-15T16:56:00.228Z","updated_at":"2025-04-10T01:44:55.344Z","avatar_url":"https://github.com/morewings.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"[![Deploy to GitHub Pages](https://github.com/morewings/next-card/actions/workflows/pages.yml/badge.svg)](https://github.com/morewings/next-card/actions/workflows/pages.yml)\n\n# Next Card\n\n[![next card](./repo-logo.jpg)](#)\n\nJumpstart your online presence with this pre-built website template. Easily create a professional-looking business card or link-in-bio page to share everything you want your audience to know.\n\nDemo: [morewings.github.io/next-card/](https://morewings.github.io/next-card/)\n\n## Quick start\n\nFirst step, click the 'Use this template' button. It will offer you to clone the repository to your account.\n\nSecond, change `./next.config.js` to contain your chosen repository name. This is needed for GitHub pages or other non-index page deployment.\n\n```js\n/** @type {import('next').NextConfig} */\nmodule.exports = {\n    // ...\n    basePath: '/your-repository',\n};\n```\n\nGo to `Settings \u003e Pages` section and enable deployment via GitHub action.\n\n![Settings](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/agsm36v13ebg1j13b5ee.png)\n\n### Fill your info \n\nNow you'll have to replace `./card-image.jpg` with your picture and enter your data into `./config.ts`.\n\nHere are the available settings:\n\n- `title`: Set your or company name.  \n\n- `bio`: Add a brief description to display below the name.  \n\n- `background`: Select a background style.  There are 12 different styles available: fresh, strict, bold, gradient, rainbow, rastafari, sunset, elegant,\nselenium, evening, optimistic, mesh. See below.\n\n- `cardImage`: Set the image to be used at the header of the card.  \n\n- `gaId`: Set your Google Analytics ID to enable tracking. More later.\n\n- `shareTitle`: Localize the sharing text. \n\n```ts\nimport image from '@/card-image.jpg';\n\nexport const config: Config = {\n    title: 'Patrick Bateman',\n    bio: 'Specialist in mergers and acquisitions',\n    background: 'gradient',\n    cardImage: image,\n    gaId: 'G-XXXXXXXXX',\n    shareTitle: 'Share link',\n    // ...\n}\n```\n\n### Add contact links\n\nIn the same file, `./config.ts` fill `headerLinks` array with your contact info links and set up your hero links at the `mainLinks` section of the config.\nEach entry consists of `title`: the display name of the link; `id`: a unique identifier for the link; `url`: The URL the link points to; `icon`: an icon to be displayed with the link. You can use any icon from the [Phosphor icons collection](https://phosphoricons.com/).\n\n```ts\nimport {\n    Envelope,\n    GithubLogo,\n} from '@phosphor-icons/react/dist/ssr';\n\nexport const config: Config = {\n    // ...\n    headerLinks: [\n        {\n            title: 'Email',\n            id: 'email',\n            url: 'mailto:user@example.com',\n            icon: Envelope,\n        },\n    ],\n    mainLinks: [\n        {\n            id: 'github',\n            title: 'GitHub',\n            url: 'https://github.com/user-name',\n            icon: GithubLogo,\n        },\n    ],\n}\n```\n\n### Attach vCard file\n\nA vCard, also known as a VCF (Virtual Contact File), serves as a standardized file format for electronic business cards.  This file can be attached to your link in bio, allowing visitors to easily import your contact info into their smartphones, Outlook, and other calendar applications without having to copy/paste. You can configure this at `./config.ts`. You can also enable `isOrganization` to display contact as a company.\n\n\n```ts\nexport const config: Config = {\n    // ...\n    vCard: {\n        firstName: 'Patrick',\n        lastName: 'Bateman',\n        organization: 'Pierce \u0026 Pierce',\n        title: 'Vice President',\n        birthday: new Date(1961, 9, 23),\n        workPhone: '+1 212 555 6342',\n        email: 'patrick@psycho.us',\n        // isOrganization: true,\n    },\n}\n```\n\n### Deploy website\n\nCommit your changes, push to the main branch and wait until `.github/workflows/pages.yml` is done. Your Next Card is available at `https://\u003cuser-name\u003e.github.io/\u003crepo-name\u003e/`. \n\n## Set up analytics\n\nNext Card supports Google Analytics. You just need to set up your property ID in config. \n\nThere are two custom events to track: `link_click` and `contact_click`. Each event reports link title as a `value` parameter.\n\n\n## Custom domain\n\nYou can [set up a custom domain](https://docs.github.com/en/pages/configuring-a-custom-domain-for-your-github-pages-site) for your card.\n\nDon't forget to remove `basePath` property from the `./next.config.js`.\n\n## Font support\n\nNext card uses [Rubik font](https://fonts.google.com/specimen/Rubik). By default, it bundles with `latin` subset. You can enable additional subsets at `app/layout.tsx`.\n\n```ts\nimport {Rubik} from 'next/font/google';\n\nconst rubik = Rubik({\n    subsets: ['latin', 'cyrillic'], // \u003c==\n    display: 'swap',\n});\n```\n\n## Available themes\n\n\u003ctable\u003e\n    \u003ctr\u003e\n        \u003cth\u003eBackground example\u003c/th\u003e\n        \u003cth\u003ePreview link\u003c/th\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n        \u003ctd\u003e\u003cimg width=\"222\" height=\"222\" src=\"/theme-previews/fresh.png\" alt=\"fresh\"\u003e\u003c/td\u003e\n        \u003ctd\u003e\u003ca href=\"https://morewings.github.io/next-card/?background=fresh\"\u003eFresh\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n        \u003ctd\u003e\u003cimg width=\"222\" height=\"222\" src=\"/theme-previews/strict.png\" alt=\"strict\"\u003e\u003c/td\u003e\n        \u003ctd\u003e\u003ca href=\"https://morewings.github.io/next-card/?background=strict\"\u003eStrict\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n        \u003ctd\u003e\u003cimg width=\"222\" height=\"222\" src=\"/theme-previews/bold.png\" alt=\"bold\"\u003e\u003c/td\u003e\n        \u003ctd\u003e\u003ca href=\"https://morewings.github.io/next-card/?background=bold\"\u003ebold\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n        \u003ctd\u003e\u003cimg width=\"222\" height=\"222\" src=\"/theme-previews/gradient.gif\" alt=\"gradient\"\u003e\u003c/td\u003e\n        \u003ctd\u003e\u003ca href=\"https://morewings.github.io/next-card/?background=gradient\"\u003eGradient (Animated)\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n        \u003ctd\u003e\u003cimg width=\"222\" height=\"222\" src=\"/theme-previews/rainbow.gif\" alt=\"rainbow\"\u003e\u003c/td\u003e\n        \u003ctd\u003e\u003ca href=\"https://morewings.github.io/next-card/?background=rainbow\"\u003eRainbow (Animated)\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n        \u003ctd\u003e\u003cimg width=\"222\" height=\"222\" src=\"/theme-previews/rastafari.png\" alt=\"rastafari\"\u003e\u003c/td\u003e\n        \u003ctd\u003e\u003ca href=\"https://morewings.github.io/next-card/?background=rastafari\"\u003eRastafari\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n        \u003ctd\u003e\u003cimg width=\"222\" height=\"222\" src=\"/theme-previews/sunset.png\" alt=\"sunset\"\u003e\u003c/td\u003e\n        \u003ctd\u003e\u003ca href=\"https://morewings.github.io/next-card/?background=sunset\"\u003eSunset\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n        \u003ctd\u003e\u003cimg width=\"222\" height=\"222\" src=\"/theme-previews/selenium.png\" alt=\"selenium\"\u003e\u003c/td\u003e\n        \u003ctd\u003e\u003ca href=\"https://morewings.github.io/next-card/?background=selenium\"\u003eSelenium\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n        \u003ctd\u003e\u003cimg width=\"222\" height=\"222\" src=\"/theme-previews/evening.png\" alt=\"evening\"\u003e\u003c/td\u003e\n        \u003ctd\u003e\u003ca href=\"https://morewings.github.io/next-card/?background=evening\"\u003eEvening\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n        \u003ctd\u003e\u003cimg width=\"222\" height=\"222\" src=\"/theme-previews/optimistic.png\" alt=\"optimistic\"\u003e\u003c/td\u003e\n        \u003ctd\u003e\u003ca href=\"https://morewings.github.io/next-card/?background=optimistic\"\u003eOptimistic\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n        \u003ctd\u003e\u003cimg width=\"222\" height=\"222\" src=\"/theme-previews/elegant.png\" alt=\"elegant\"\u003e\u003c/td\u003e\n        \u003ctd\u003e\u003ca href=\"https://morewings.github.io/next-card/?background=elegant\"\u003eElegant\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n    \u003ctr\u003e\n        \u003ctd\u003e\u003cimg width=\"222\" height=\"222\" src=\"/theme-previews/mesh.gif\" alt=\"mesh\"\u003e\u003c/td\u003e\n        \u003ctd\u003e\u003ca href=\"https://morewings.github.io/next-card/?background=mesh\"\u003eMesh\u003c/a\u003e\u003c/td\u003e\n    \u003c/tr\u003e\n\u003c/table\u003e\n\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmorewings%2Fnext-card","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmorewings%2Fnext-card","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmorewings%2Fnext-card/lists"}