Git Product home page Git Product logo

milliorn / digital-business-card Goto Github PK

View Code? Open in Web Editor NEW
1.0 3.0 0.0 11.32 MB

Modern responsive web application that allows users to create and share their digital business cards online

Home Page: https://milliorn.github.io/digital-business-card/

License: MIT License

JavaScript 2.54% HTML 18.52% CSS 1.04% TypeScript 77.90%
business-card contact-information digital-business-card front-end-development personal-branding portfolio professional-portfolio react responsive responsive-design

digital-business-card's Introduction

Digital Business Card

Digital Business Card is a modern and responsive web application that allows users to create and share their digital business cards online. With this application, you can create a professional and interactive representation of your business card, including contact information, social media links, and a personal bio. It provides a convenient way for professionals to showcase their information and make lasting impressions with potential clients and contacts.

Features

  • Create and customize your digital business card with ease
  • Add your contact information, including name, email, phone number, and website
  • Include links to your social media profiles, such as LinkedIn, Twitter, and GitHub
  • Write a brief bio or introduction about yourself or your business
  • Generate a unique URL to share your digital business card with others
  • Responsive design for optimal viewing on desktop and mobile devices

Technologies Used

  • React: A JavaScript library for building user interfaces
  • React Router: A popular routing library for React applications
  • Firebase: A cloud-based platform for building web and mobile applications
  • Firebase Authentication: For user authentication and authorization
  • Firebase Firestore: A NoSQL document database for storing and retrieving data
  • Material-UI: A popular React UI framework for creating beautiful user interfaces

Getting Started

Prerequisites

  • Node.js: Make sure you have Node.js installed on your machine.

Installation

  1. Clone the repository: git clone https://github.com/milliorn/Digital-Business-Card.git
  2. Navigate to the project directory: cd Digital-Business-Card
  3. Install the dependencies: npm install
  4. Set up a Firebase project:
  • Create a new Firebase project at https://firebase.google.com/
  • Enable Firebase Authentication and Firestore in the Firebase project console
  • Add your Firebase project configuration details to the .env file
  1. Start the development server: npm start
  2. Open your browser and visit http://localhost:3000 to access the application.

Deployment

To deploy the application to a hosting platform, follow these steps:

  1. Build the application: npm run build
  2. Deploy the build folder to your hosting platform.

License

This project is licensed under the MIT License. See the LICENSE file for details.

Acknowledgements

  • This project was inspired by the need for a modern and digital way to share business cards.
  • Special thanks to the contributors who helped improve and enhance the application.

Links

Get started with Tailwind CSS -> https://tailwindcss.com/docs/installation

React Icons -> https://react-icons.github.io/react-icons

React Image -> https://github.com/mbrevda/react-image

React Visibility Sensor -> https://github.com/joshwnj/react-visibility-sensor

This project was bootstrapped with Create React App.

TypeScript -> https://www.typescriptlang.org/docs/handbook/react.html

gh-pages -> https://github.com/tschaub/gh-pages

digital-business-card's People

Contributors

deepsource-autofix[bot] avatar dependabot[bot] avatar github-actions[bot] avatar imgbot[bot] avatar milliorn avatar renovate-bot avatar renovate[bot] avatar

Stargazers

 avatar

Watchers

 avatar  avatar  avatar

digital-business-card's Issues

Dependency Dashboard

This issue lists Renovate updates and detected dependencies. Read the Dependency Dashboard docs to learn more.

Open

These updates have all been created already. Click a checkbox below to force a retry/rebase of any.

Ignored or Blocked

These are blocked by an existing closed PR and will not be recreated unless you click a checkbox below.

Detected dependencies

github-actions
.github/workflows/codeql-analysis.yml
  • actions/checkout v3
  • github/codeql-action v2
  • github/codeql-action v2
  • github/codeql-action v2
.github/workflows/combine-prs.yml
  • actions/github-script v6
.github/workflows/dependency-review.yml
  • actions/checkout v3
  • actions/dependency-review-action v3
.github/workflows/ossar.yml
  • actions/checkout v3
  • github/ossar-action v1
  • github/codeql-action v2
.github/workflows/super-linter.yml
  • actions/checkout v3
  • github/super-linter v4
npm
package.json
  • react 18.2.0
  • react-dom 18.2.0
  • react-icons 4.6.0
  • react-image 4.0.3
  • react-scripts 5.0.1
  • react-visibility-sensor 5.1.1
  • typescript 4.8.4
  • @types/node 18.11.9
  • @types/react 18.0.24
  • @types/react-dom 18.0.8
  • autoprefixer 10.4.13
  • gh-pages 4.0.0
  • postcss 8.4.18
  • tailwindcss 3.2.1

  • Check this box to trigger a request for Renovate to run again on this repository

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.