https://github.com/abdtriedcoding/sheetonweb
Transform your Google Sheets into an interactive and visually appealing web display for seamless online sharing and presentation. 📊✨
https://github.com/abdtriedcoding/sheetonweb
Last synced: 9 months ago
JSON representation
Transform your Google Sheets into an interactive and visually appealing web display for seamless online sharing and presentation. 📊✨
- Host: GitHub
- URL: https://github.com/abdtriedcoding/sheetonweb
- Owner: abdtriedcoding
- Created: 2023-11-19T10:01:09.000Z (about 2 years ago)
- Default Branch: main
- Last Pushed: 2023-12-13T16:07:00.000Z (about 2 years ago)
- Last Synced: 2024-03-03T16:51:07.212Z (almost 2 years ago)
- Language: TypeScript
- Homepage: https://sheet-on-web.vercel.app
- Size: 277 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# SheetOnWeb - Empowering Web Data Display with Google Sheets Integration.
Built with the Next.js 14 App Router, Google Sheet API, TypeScript, Shadcn UI & Tailwind
## Features
- 🛠️ Complete solution to showcase Google Sheets data in website
- 💻 User-friendly interface with beautiful table displays
- 🏬 Using Google Sheet as database
- 🔄 Real-time updates directly from Google Sheets
- 🔍 Full pagination & sortable data (age, salary)
- 📊 Dynamic bar chart for visual insights
- 🌐 Accessible to non-technical users
- ⚙️ Easily contribute data without technical expertise
- 🔄 Automatic data fetching and display
- 🚀 Enhance team understanding with visual representations
- 📈 100% built for ease and clarity
## Getting started
To get started with this project, run
```bash
git clone https://github.com/sidd-abdullah/SheetOnWeb.git
```
and make the .env.example variables into a separate .env.local file, fill them out by making account on Google Cloud Platform & and that's all you need to get started!
By the i am using this google sheet for display data https://docs.google.com/spreadsheets/d/1WXYyIg6qmNtQZxfzD5Wv8pD6rnpcJLTUdXXSGsi2FyQ/edit?usp=sharing.
You can use according to your requirments. For new sheet you need to change a little bit of code you can do it by taking refrence from fireship vedio.
For more setup details you can watch this vedio.👉 https://youtu.be/K6Vcfm7TA5U?si=GrJ1joK5pl0Tv9Kd
## Acknowledgements
- [Fireship](https://youtu.be/K6Vcfm7TA5U?si=GrJ1joK5pl0Tv9Kd) for making this project possible by his vedio😉
## License
[MIT](https://choosealicense.com/licenses/mit/)