Google Drive: Publicly hosting a static website
I frequently need to demo work in progress web sites and web apps to people I’m working with. I was looking for the most convenient way to do this and found that Google Drive was a good fit to letting me publicly share web development projects.
Google Drive provides an easy way to store and share documents in the cloud. The Google Drive desktop app also conveniently keeps a folder on your machine in sync with your online Google Drive folder in the same way Dropbox does. This post explains how to use Google Drive to publicly share a folder that contains a static website from your machine.
Publicly sharing a Google Drive folder as a website
First visit your online Google Drive folder at https://drive.google.com then:
Create a new folder e.g. called
Right-click on the new folder and select “Share…”.
Select the “Anyone with the link can view” permission for the folder.
Take note of the sharing link that is display. It will look something like this
FOLDER_IDis a long string of text and numbers.
Save the updated folder permissions.
Copy your website files into your new Drive folder. One way to do this is to drag and drop the files into your browser. Another way is to copy the files into the local Google Drive folder that corresponds to your new public Drive folder and waiting for the Google Drive desktop app to sync the files.
If you now visit
http://googledrive.com/host/FOLDER_ID/in your browser, the
index.htmlpage in this folder will be opened as a web page. If you want to open a specific page within the folder such as one called
example.html, use the URL
Publicly sharing multiple websites easily using Google Drive
Instead of having to go through this every time you want to share a new website with someone in the future, a simple approach is to use subdirectories within a single publicly shared folder:
Create and publicly share one Google Drive folder called
Publicas described above.
To share a new website, create a folder under the
Publicfolder such as one called
website1, copy the website files into this folder and then use a URL of this form to share the website:
With the above system set up, you can now conveniently share a static website with somebody by copying the files to your local Google Drive folder and emailing a link. When working in remote teams, this can be valuable for quickly demoing and getting feedback on iterative changes being made to a work in progress site.
Get internal and external IP address on Mac with Bash