DEV Community

loading...

Omega: The spreadsheet Manager (Final)

devsmranjan profile image Smruti Ranjan Rana ・2 min read

What I built

A spreadsheet manager app, which will help you to manage your spreadsheets from different Google Accounts in one place.

Category Submission:

Built for Business

App Link

https://omega-server-ydvm2.ondigitalocean.app/

Screenshots

  • Login Page
    Login Page

  • Signup Page
    Signup Page

  • Dashboard Page (Without Data)
    Dashboard Page-Without Data

  • Subscriptions Page (Without Data)
    Subscriptions Page-Without Data

  • Subscriptions Page (With Subscription)
    Subscriptions Page-With Subscription

  • Add Spreadsheet in Subscriptions Page
    Add Spreadsheet in Subscriptions Page

  • Dashboard Page (With Data)
    Dashboard Page with Data

Description

Tech Stack

  • Backend : Node JS & Express JS
  • Frontend : React JS, Redux
  • Database : Mongo DB

Features

  • Login with Username & Password
  • Add Google Accounts as Subscriptions
  • Add Spreadsheets from Subscribed Google Account
  • Get all subscribed spreadsheet in the Dashboard

Link to Source Code

Permissive License

MIT license

Background

I've different spreadsheets in different Google Accounts. But there is no way to manage these spreadsheets in one place from all the Accounts. This app will help you to manage your spreadsheets from different Google Account in one place.

How I built it

Here, In this project, we will mainly use,

  • JWT for Authentication with Username & Password
  • SendGrid to send Email Verification, Password Verification URLs.
  • Google OAuth2 to add Google Accounts
  • Google Drive API & Google Spreadsheet API to get all the spreadsheets.

Additional Resources/Info

If you want to run this project,

Server

  1. Clone Omega Server Repo from here
  2. Add .env file in the root directory
  3. Inside .env add the following variables
* API_ENDPOINT=<API Endpoint ex: /api>
* SERVER_ROUTE=<Inital route of server after domain name. ex: /app>
* CLIENT_URL=<Client URL ex: http://localhost:3000>
* MONGO_URI=<MongoDB URI>
* JWT_SECRET=<Random String for JWT Secret>
* SENDGRID_API_KEY=<Sengrid API Key>
* SENDGRID_FROM_EMAIL=<Email of the sender>
* GOOGLE_CLIENT_ID=<Google Client ID>
* GOOGLE_CLIENT_SECRET=<Google Client Secret>
Enter fullscreen mode Exit fullscreen mode
  1. Run npm install to install all the dependencies.
  2. Now run npm run dev to run the server on port 8000

Client

  1. Clone Omega Client Repo from here
  2. Add .env file in the root directory
  3. Inside .env add the following variables
* REACT_APP_SERVER_ENDPOINT=<Server API Endpoint ex: /api>
* SERVER_URL=<Server URL ex: http://localhost:5000>
Enter fullscreen mode Exit fullscreen mode
  1. Run npm install to install all the dependencies.
  2. Now run npm start to run the server on port 3000

Discussion

pic
Editor guide