Skip to content

Feature: Add vCard (.vcf) Export for Instant Contact Saving (Web & Mobile) #179

@anshika1179

Description

@anshika1179

overview.

DevCard is fantastic for aggregating developer profiles into one shareable link. However, when networking at conferences or hackathons, the person scanning the QR code might also want to save the developer's basic contact information directly to their phone's native contacts app for long-term reference. Currently, they have to manually copy the name and links to create a new contact.

Describe the solution you'd like

I propose adding a "Save Contact" or "Export as vCard" button to the DevCard interface (both on the SvelteKit web backup and the React Native mobile app).

When clicked, this button will dynamically generate and download a .vcf (vCard) file containing:

  • The Developer's Name
  • Their primary DevCard link (e.g., as the website URL)
  • Their bio/headline (as the contact note)
  • Any other public contact information they have chosen to display.

When a user taps this on their phone, iOS/Android will automatically prompt them to add the person to their native address book.

Describe alternatives you've considered

An alternative would be generating a secondary QR code specifically for the vCard format, but that clutters the UI and goes against the "One Screen" philosophy. A simple download/export button on the receiver's end is much cleaner.

Acceptance Criteria

  • Implement a utility function in packages/shared to dynamically generate a valid vCard string based on a user's DevCard profile data.
  • Web Backup (apps/web): Add a "Save Contact" button on the public card view that triggers a .vcf file download using a Blob URL.
  • Mobile App (apps/mobile): Add a similar button on the receiver's view utilizing the appropriate React Native file system/sharing APIs to prompt the native contact save dialog.
  • Ensure the vCard maps the fields correctly (e.g., FN for Full Name, URL for the DevCard link, NOTE for the bio).

Additional context

This feature heavily complements the "One Tap. Every Profile." vision by integrating DevCard directly with the native OS contact books of the people you meet.

Metadata

Metadata

Assignees

Labels

No labels
No labels

Type

No type
No fields configured for issues without a type.

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions