https://github.com/john-weeks-dev/gmail-clone

This is a Gmail Clone made with Vue 3, Tailwind CSS, Node JS, Pinia, and Firebase
https://github.com/john-weeks-dev/gmail-clone

firebase firebase-firestore firebase-firestore-database gmail gmail-clone google-cloud google-login node nodejs pinia pinia-plugin-persist tailwind tailwindcss vue3 vue3-composition-api vuejs

Last synced: 3 months ago
JSON representation

This is a Gmail Clone made with Vue 3, Tailwind CSS, Node JS, Pinia, and Firebase

• Host: GitHub
• URL: https://github.com/john-weeks-dev/gmail-clone
• Owner: John-Weeks-Dev
• Created: 2022-11-22T16:29:55.000Z (almost 3 years ago)
• Default Branch: master
• Last Pushed: 2022-12-19T12:36:02.000Z (almost 3 years ago)
• Last Synced: 2025-03-24T04:12:15.239Z (7 months ago)
• Topics: firebase, firebase-firestore, firebase-firestore-database, gmail, gmail-clone, google-cloud, google-login, node, nodejs, pinia, pinia-plugin-persist, tailwind, tailwindcss, vue3, vue3-composition-api, vuejs
• Language: Vue
• Homepage: https://youtube.com/watch?v=KE5sQiHRZQg
• Size: 621 KB
• Stars: 25
• Watchers: 1
• Forks: 17
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# Gmail Clone (gmail-clone)

### Tutorial series on how to build this

If you'd like a step by step guide on how to build this just **CLICK THE IMAGE BELOW**

[![GO TO JOHN WEEKS DEV TUTORIAL VIDEOS](https://user-images.githubusercontent.com/108229029/208315507-39a5cac2-47bc-4559-95db-db0fab56bc01.jpeg)](https://www.youtube.com/watch?v=KE5sQiHRZQg)

Come and check out my YOUTUBE channel for lots more tutorials -> https://www.youtube.com/@johnweeksdev

**LIKE**, **SUBSCRIBE**, and **SMASH THE NOTIFICATION BELL**!!!

## App Setup

Clone the repository

```

git clone https://github.com/John-Weeks-Dev/gmail-clone.git

```

Now go to https://console.cloud.google.com/

Generate an API KEY.

Add your new API KEY to the script inside **src/main.js**

![Screenshot 2022-12-19 at 14 33 10](https://user-images.githubusercontent.com/108229029/208371968-8a66bbed-d157-4ab3-927f-cc573e6f9aaf.png)

And **backend/index.js**

![Screenshot 2022-12-19 at 14 33 32](https://user-images.githubusercontent.com/108229029/208372044-a867263c-b3aa-4575-ba44-8caa8f2ba8ba.png)

Setup Firebase (firestore)

Add the details to **src/firebase-init.js**

Now run this command to start the project 

```

npm i

npm run serve

```

And to start the backend

```

cd backend

npm i

npm run watch

```

You should be good to go!

# Application Images