Our website is open source
Our website has been fully open source since we released it around two years ago. We built the site using Jekyll, a popular static website generator.
The site is hosted on Github. We used Jekyll with Github for several reason:
- It’s fast
- It’s secure
- It’s version controlled
- It’s flexible
- It’s dev friendly
- It’s limited
Let us talk about those in more details.
It’s fast
There is no faster way to store a web pages then as static HTML files. It means the site is loaded straight from the server without database queries or other speed bumps.
On top of this we made performance a priority. We optimize images, minify JavaScript/CSS and lazy-load secondary parts on the pages.
The site currently ranks 75% on PageSpeed insights on mobile and 89% on desktop. Of course we aim to reach 100% on all devices 👊
It’s secure
Content Management Systems (CMS) such as WordPress need to be monitored and kept up to date. This is to prevent attackers from taking down the site if security vulnerabilities come up.
With static files, security updates are not needed to prevent these kind of attacks.
It’s version controlled
Since the website is all static files, we can use Github Pages for hosting. This is great as we already use Git with Github for version control on all open source projects.
Github has useful tools for our development process. We can suggest improvements and ideas to the site by creating a branch and make a pull request to discuss before others can approve it.
Github Pages makes deployment a breeze. We just push changes to a special gh-pages branch and voila! It’s live.
It’s flexible
Content Management Systems limit ability to layout content in a flexible way. This is what makes it easy for non-technical people to use these systems without breaking designs.
Jekyll is more flexible as content is added within the source code. It requires technical skills so we would still recommend CMS systems where non-technical people edit the content.
This approach fits 14islands perfectly as we are all technical people here that care deeply about design.
Our blog posts are written and stored as Markdown, also big parts of case studies. Other pages are simply made with good’ol HTML.
It’s dev friendly
Jekyll allows us to use any tools we like for our front-end process.
For the site we used Gulp as a build tool, Sass for CSS, CoffeeScript for JavaScript, Bower as a front-end package manager and NPM for development dependencies in NodeJS.
As a fun site note, we have totally revampted our process since two years ago. Things move so fast in the technology world. Today we use Stylus for CSS and ES6 (ES2015) for JavaScript. Then we use NPM as a package manager for both front-end, back-end and as a build tool.
The good thing is Jekyll is flexible and allows us adjust the front-end process the way we want.
It’s limited
We have endless ideas we dream up when working on our own website. It can actually be helpful to have constraints put on creativity.
With Jekyll, there is no dynamic back-end technologies. It forced us to focus on the front-end side to enhance the experience. We still use JavaScript APIs to talk to services for dynamic content such as Google Maps. Overall, this was a good limit for us and helped us ship the site on time.
Conclusion
The site was a great milestone for us as a company. We’ve been adding new case studies, blog posts and features to it constantly since we released it.
However, to be honest. We are already thinking of new directions to take our website going forward.
Write a comment