Skip to content

Source code behind the personal website (Firebase + LWC + Zapier). 🌐⚡

Notifications You must be signed in to change notification settings

Deepak-K-Anand/Personal-Website

Repository files navigation

🌐 Personal Website

Source code behind the website dkanandbio.web.app dkanandbio-web-app

🛠️ How is it built

The database is served from Firebase (https://firebase.google.com/) and the front-end is built using Lightning Web Components OSS (https://lwc.dev/)

Firebase Lightning Web Components (OSS)

🖌️ CSS Framework

The styling (grid system, timeline, meters and avatar) is implemented using Spectre.css (https://picturepan2.github.io/spectre/)

⚡ LWC Components

Each section is a Lightning Web Component namely:

  1. HEADER
  2. EXPERIENCE
  3. INDUSTRY EXPERIENCE
  4. SKILLS
  5. EDUCATION
  6. ACHIEVEMENTS
  7. STRENGTHS
  8. CERTIFICATIONS
  9. SOCIAL MEDIA
  10. AWARDS
  11. VOLUNTEERING
  12. PRODUCTS

See - https://github.com/Deepak-K-Anand/Personal-Website/tree/master/src/modules/resume

💾 Data Flow

Here is a brief outline of how the Data Flows:

  1. The APP component (https://github.com/Deepak-K-Anand/Personal-Website/blob/master/src/modules/resume/app/app.js) uses the Firebase Web SDK to query the entire JSON document from the Firebase Server
  2. This entire JSON document is then passed as an attribute to all the child components

💬 Interactive Chat

image

The interactive Chat Widget is a re-imagined Contact Me built using the Open Source Conversational Chat Form Framework - https://space10-community.github.io/conversational-form/

The submissions are saved into a Firebase database and email notifications are sent using Zapier (https://zapier.com/apps/firebase/integrations).

Releases

No releases published

Packages

No packages published