A webpage

During my winter break (Dec. 2017 to Jan. 2018) I decided to create a webpage from scratch to brush up on my HTML, CSS, and JavaScript and to practice creating a simple web API to dynamically update the page using Ajax.

I took inspiration from the page of my local barber, Anthony Canamucio, and created a new site based off of the style of his barbershop: green paneling, neon signs, and retro fonts among other accents.

“/hours” API

On top of the static page, I wanted to create a RESTful /hours API so the page could fetch business hours in the background. A privileged user could then add or delete ‘hours set’ objects with a user-friendly front-end, without someone having to manually update the HTML for every holiday or temporary change in regular hours.

Implementation

I implemented my service using the Gin framework for golang and hosted it on a DigitalOcean droplet.

Business hours are represented and stored as JSON blobs on the server. When the homepage loads, the latest hours are fetched, converted into 0 or more HTML tables, and inserted into the document.

As of now, the following methods are supported and enabled:

  • GET: /hours
  • GET: /hours/findActive
  • GET: /hours/findByName/:name

Try it out

Enter one of the paths above into the text box below (e.g. /hours/findByName/regular).

GET: 

{}

Note: The PUT and DELETE methods (for adding and removing sets of business hours) are implemented but disabled since neither endpoint currently supports authentication and I have yet to create a user-friendly front-end.

The Webpage

Click here to view the stand-alone webpage.

Business hours are populated in the “When we do it” section at the bottom of the homepage.