First website ever created at the CERN
First website ever created at the CERN

Hello world!

June 22, 2018

As I'm always curious, learning and testing things, I've been wanting to build a personal website where I can share my thoughts and experiences with the world.

Here it is!

The goal of this website is to first talk about IT-related stuffs but other posts could diverge on other topics. On top of sharing knownledges, I'm doing this website to improve my English writing skills as I'm not a native speaker and also, to improve my skills in summarizing and explaining things.

Implementation

This website has been implemented totally from scratch with the help of a static generator called gatsby. Gatsby combines the power of the React (expressiveness, modularity, ecosystem, ...) with an easy-to-use API to fetch data from multiple sources using graphql. The resulting output is some HTML, CSS and Javascript. The HTML is generated using React server-side rendering capabilities meaning that we remove some overhead that could be introduced by React.

Styling

I had mostly three choices to style this website:

  1. One global CSS file
  2. CSS Modules
  3. CSS-in-JS

I picked the CSS modules approach because it solves the global scoping problem of the single CSS file. Global scoping leads generally to maintenance burden and weird breakages of the styling. CSS-in-JS was not chosen because this website is expected to run for several years and CSS-in-JS libraries are moving very fast without any industry-standard yet. As I'm not especially specialized in frontend development, I didn't wanted to choose a solution which could be deprecated in the next 2 years.

Concerning the layout, I used modern technologies such as flexblox and grid to easily layout complex ideas. On top of that, CSS grid is a breeze to use to design responsive design. Of course, old browsers won't be supported but I don't really care as this blog is more focused on tech-savvy stuffs.

Deployment

This website is hosted with Github Pages and the code can found here. Thanks to Travis CI, everytime I push a commit in the main branch, Travis CI automatically builds and deploys my website to the master branch.