A Website from Your Local Folder | CORPORATE ETHOS

A Website from Your Local Folder

By: | June 25, 2018
chrome apps

A web server is a network application running continuously on some machine listening on a port and we access this server software via a web client (like our web browsers Firefox, Chrome etc). The primary purpose of a web server is to serve a web resource (like an HTML file, PDF document, an image file, video file etc) to the client. If you are building a website, access to a web server is essential. Nonetheless, even a lay user may find access to a web server useful as it will help her easily share documents with others.

muralicolIf one wants to share a few documents, the best strategy is to run a web server on his local machine, host the required documents onto it and make the server accessible to the persons concerned. Though there are umpteen ways to convert your PC into a web server (like the Microsoft personal web server), here we point out a simple means to do it.

Chrome Web Server

If you are a Chrome user, simply install the add-on ‘Web Server for Chrome’ and run it through the app launcher chrome://apps/.

chrome1

When the server app gets loaded, the first thing you do is to choose a folder to serve web content. Once the folder is set, access the server using the URL specified under the label ‘Web server URL’ (screenshot above). The advantage here is that you or anyone who has access to this URL can access/download all the resources stored in this folder from anywhere on your network. You can serve any types of files (image, text, video, HTML etc) this way.

The app offers certain other optional features. You can run the app in the background, make it available to other computers on your network, etc.  When you make it available to other computers you will be able to view the local folder content from other computers on your local network or even from the Internet. By sharing this URL with other users on your network, you can make the resources available to them too.

A website from Google Drive Folder

Before winding up this piece, let us point out yet another means to host your local content without bothering much about a web hosting service. It is likely that you have an account with a remote storage service like Google Drive or One Drive. One advantage of having such a remote storage account is that you can make the file upload/download process rather automatic. You can link a local folder to the remote storage service and whenever you modify or create a file in this folder it gets automatically uploaded to the storage service. This means if you create a website and keep it in this folder, all the modifications you make on your site pages will get updated automatically.

However, remote storage services like Google Drive can only store your files; they cannot serve your files. This means, ideally, a tool that can convert the web pages hosted on the remote storage into a publicly accessible website could come in handy. This is exactly what the service DriveToWeb does.

Initially, upload your site folder onto your Google Drive account and make it public (screenshot below).

chrome2

Now, access the DriveToWeb service, log in to it with your Google Drive account credentials and allow it to access your account. It will immediately turn the documents stored on your Google drive account into a publicly accessible website and display its URL. The obvious advantage is that it will free you from the website administration chores. Any modifications you make on the local folder gets automatically reflected on your site.

A Screenshot tool

Conventional screenshot tools (the built in facility like “Print Scrn” or other screenshot tools like Greenshot) allow you to take the screenshot of only the visible part of the screen. This means if you want to capture a full webpage you need to take several screenshots and combine them into a single file. A laborious process indeed! But don’t worry. It is no more a difficult task if you are using the latest version of Chrome, which lets you take full web page screenshot. Let us see how we can do this.

Invoke the Settings menu, access the option ‘More tools’ and then from the menu that pops-up, select the option ‘Developer tools’

chrome3

At this point, you will get a screen like the one shown below:

chrome4

Now, click on the icon labelled ‘Toggle device toolbar’. Here you will see your web page on one part of the screen (like you view it on a mobile device) and you can scroll down to check your full web page.

chrome5

Click on the ‘More Options’ button and go through the menu that pops-up (screenshot above). Here, if you pick the ‘Capture screenshot’ option, it will generate a screenshot of the visible part. On the other hand, if you click on the ‘Capture full size’ screenshot’ it will generate the screenshot of the full web page and download it as a single image.

If you are not happy with the procedure mentioned above or find it a little cumbersome, installing the Chrome extension ‘Full Page Screen Capture’ is another alternative. For this, access the page here, and add the extension to the browser. Once the extension is live on your browser, visit the web page and click on the extension’s small camera icon on the extension pane. You will see the extension scrolling the page up and down, capturing the different elements of the web page and after a while, it will combine all the elements into a single screenshot and display it in another tab, with a menu (screenshot below).

chrome6

You can use the appropriate option from the menu and download the entire page as PDF or image file.