How It's Made : EverydayStem Site

blog-feature-image

The Everydaystem blog is seemingly feature rich and aesthetically pleasing website. It would make sense to assume that constructing such a site is both costly and complex but this couldn’t be further from the truth. In this article we explore how the site is constructed, maintained and served.

When we set out to create the site we had in mind

  • Speed
  • Reliability
  • Updateability
  • Availability of blogging features
  • Cost

Static Site generators were highly recommended and we came across several alternatives

  • WordPress
  • Ghost
  • Jekyll
  • Grav
  • Hugo…

On our site we use Hugo, a very popular open-source static site generator. We’re able to make complex, content rich websites thanks to it. Hugo can generate fairly large and well optimized sites in very little time so updates can be done quickly.

If you wish to give it a go install hugo using the quick start guide provided on their site. The Hugo community has created various themes to enable others to create feature rich and pleasing websites. You may choose any for your demo.

Most hugo projects will have a structure similar to this.

. # ./EveryDayStem
├── config.toml # Contains site variables
├── content # Where you would store blog posts
├── data # Contains data that can be iterated over to create pages
├── layouts # Contains custom layouts for any pages on the site
├── public # Contains the final statically generated site
├── static # Contains files that are used throughout the site for instance logos, pdfs..
│  └── images
└── themes # Contains themes used to generate the site

Following the quick start guide should show you the basics of working with hugo but if insufficient for your purposes there is documentation and community forum to help you build your dream site.

Once the site is made you need to share it. This can be achieved in all kinds of ways

  • AWS
  • Railway # A service we use frequently to create prototypes
  • Dreamhost
  • Self-hosting # If you have spare computers you can use them to host applications and expose them to the world

We use an interesting service called github pages. It is intended for particularly large projects to host websites that can show users how to use, extend or fund the project. It is a great resource that you are encouraged to use.

And that’s how the site works.