SiteSheet - Convert Google Sheet into API or Website in a Snap.
SiteSheet is a simple web app that allows you to convert google sheets instantly into API or you can make websites out of Site Sheet.
Inspiration 🦾
Well, a few days back I shared a trick to easily use google sheet as an API, but there was a lot of hard work involved in that, I just want that trick available to every developer just two clicks away...
But later I got more deeply devoted to this and thought why not make I could make an instant website builder out of this, there are many people who don't know how to code, even editing JSON or HTML files is quite difficult for them(one year back I was the same). so, I thought let's build a tool that allows you to make a website out of google sheet and for developers the possibilities are unlimited.
Demo 🧐
Converting a google sheet into API
Converting a google sheet into a website
just make sure your google sheet is published on the web before converting it into a website or API.
well, I will recommend you to try it ones yourself... https://sitesheet.vercel.app/
How does it work?? 🤔
well ... every google sheet has a unique id/name ( a long random string after sheets.google.com) this app is extracting that from the URL the user is inputting and using that it is generating the API endpoint. once we have the API endpoint everything is done. (you can API as the waiter in a cafe or restaurant it basically helps to get data from the server. just like a waiter helps you to place an order and get your food from the chef )
also here every time the website is rendered on the client site, and if any change is done in the google sheet, it would be reflected immediately.
How I create it 🤓
warning this part might be boring
Well, firstly I am a beginner with web dev so I decided to go with React, I am taking URLs in input from the user and have made few functions to extract the unique id of google sheet. In all the web templates the unique id is passed through the URL Parameters and to handle API's I am using Axios, also Funnies is also included so that users have a great mood while the website is loading. All errors are handled using React - Toasty. There are great packages, maybe you can use these in your own project.
I am using React for this project, and some awesome npm packages such as Axios to handle API requests, funnies to make users laugh when the data is being fetched. React Router to handle routing and react-toasty to handle all errors.
Features 🍨
- It can convert any google sheet into API instantly.
- Make your own portfolio faster than instant noodles.
- Well you can link all your social media from an excel file.. yes you can. -Currently, it has 5 templates you can choose from ... you can make your own personal website, the website for your cafe, Your own page with all your social media profiles, , Share a list of youtube, Facebook, and other social media links in style and also select a random user from excel file.
- Easy to use.
- Have a great UI (I think so.. 😅)
- Saves a lot of time.
- Mobile Friendly
- what else you need? (comment it I will try to add that to the project )
Future Roadmap🔮
So, building this project was fun but it's not the end.
- I will be adding more templates.
- Support for google from (in google from the response can be extracted into a google sheet, so it can work )
- Support for custom domains
- Much Much more...... (please give me more ideas in the comment section )
The whole project is open source, Please contribute to it. (if you find any bug free to report it.)
Github Repo Link:- https://github.com/tewarig/SiteSheet
Project Link:- https://sitesheet.vercel.app/
Also, thanks to Hashnode and Vercel for organizing such an awesome event. 🤞Wish me luck.
