This website is built with a pure Jamstack approach. If you don&#39;t know much about the concept, you can check the official source of the <a href="https://jamstack.org/">Jamstack</a> website.I like to draw diagrams :) So here is the basic diagram of the implemented Jamstack approach for this website.<img src="//images.ctfassets.net/74s80qkrrqkk/5LGfB8W7XHDgIMwhlZjxw5/f2103dbd490c7e4cfcb74f2bc88cfba7/How-I-Build-This-Website.drawio.png" height="391" width="751" alt=""/><ul><li>The project is based on NextJS w/ Tailwind and deployed to Vercel via Github Actions. This process was very smooth as Vercel handled the deployment pipeline out of the box. So I didn&#39;t need to manage my own server and all the related configuration. Gosh, I love serverless :)</li><li>Unlike the general approach of fetching the content from the data layer during the build phase, I also kept the data statically in the codebase similar to the CMSs based on Git repositories. <ul><li>The advantage of this behavior is, that I have full control of the data and I don&#39;t need to keep a separate environment. </li><li>The disadvantage is, that I need to push the latest data to the repository in order to update the website. And it&#39;s a terrible approach for multi-developer projects. But It is not a big deal since the website would not be updated frequently. And plus, I&#39;m the only one working on it :)</li></ul></li><li>I created a script that builds the data model interfaces and the content from Contentful. It&#39;s actually pretty cool. The script creates a structure in the following hierarchy.<ul><li>cms/entities: The directory where all the model interfaces exist<ul><li>cms/entities/blog.ts: The blog interface model</li></ul></li><li>cms/cms_data.ts: The normalized data fetched from Contentful</li><li>cms/cms_service.ts: The service layer on top of the cms_data that can be used in the pages. It has a method for listing with filtering and pagination options and a method for accessing a certain element.</li></ul></li></ul>

how-i-built-cover.jpg

How I build my personal website with NextJS, Contentful, and Vercel

How I built this website

Hi there!In case you don&#39;t know about me, my name is Seyfi. I&#39;m a software engineer based in Istanbul, Turkey.During my career, I mostly worked on building web products. At the time of writing this, I&#39;m working as a Senior/Lead Backend Engineer at <a href="https://www.brandbastion.com">BrandBastion</a>. I believe in sharing knowledge. So, I&#39;ll try to do my best to keep my blog get updated as much as possible.

Seyfi Aslan

About me

Links

Recent Blog Posts