Jan Karam logo
Blog

Writing by Lilyanne

Writing by Lilyanne is a JAMstack powered blog built for my dear friend Lilyanne.
I built this project from scratch with Gatsby, React ,GraphQL, Theme-UI, Framer motion , react-intl and Sanity CMS.
The blog is available in Arabic , English and French and can be viewed in light and dark mode.

Stack

  • Gatsby
  • React
  • GraphQL
  • Theme-UI
  • Framer motion
  • react-intl
  • Sanity CMS
  • Google analytics

Code

Live

screenshots of Writing by Lilyanne on different devices

Why this stack?

I wanted the website to be multi-lang and I tried a lot of content management systems but the only one who supported internalization the way I wanted was Sanity CMS. also it's ease of use and customization made it the clear winner for me.
After choosing the CMS choosing Gatsby was easy, because of it's plugin system , how it's easy to make a site multi-lang using it and it's amazing integration with Sanity CMS.
Theme-UI was the styling choice because I wanted the blog to support dark mode without losing my sanity, it's amazing and supports multiple color modes by default. and framer motion because of it's amazing performance and ease of use.
Google analytics because I wanted to track engagement and to know which article attracts more people.

Lessons learned

I could spend all day describing the lessons that I learned while working on this project, but the most important ones involved my new found understanding of Gatsby,GraphQl, Git management, and API integration with Sanity Io and how to use google analytics. As my first large project using React, I learned a lot of lessons regarding code structure and organization.