Jamstack Hours: Building a Product from the Idea to the Deploy in 3 Weeks

August 15, 2022

In June, we organized a series of meetings where we shared the process of developing a digital product from the idea to the deploy. During these meetings, we build Digital Product Glossary by explaining which tools and approaches we used. We talked about GatsbyJS and Tailwind CSS in the first week, Contentrain, Strapi, Contentful, WordPress in the second week, finally Netflify and Gastbycloud in the third week.

For each product we build at tio, we determine the tools we will use with a multidimensional approach, considering many factors such as product requirements, market priorities, and user profile. Although we have focused on Jamstack and the tools we use throughout the meetings, we actually aimed to convey our knowledge and approach on how we decide which tool to use.

There were several reasons for our choice of Jamstack tools for Digital Product Glossary: Speed, simplicity, development experience, having a strong community and opportunity to integrate with many other tools.

Lean Product Development

In line with the lean product development approach we have adopted at tio, we move forward with an MVP (minimum viable product) oriented perspective. We see development as a process where we discover the ideal way to bring success to a product we believe in. Since the main reason for developing an MVP is to see if the product will produce the value it aims for before allocating more resources to that product. We always think about how to achieve a functioning and testable product using as few resources as possible.

In addition to testing the idea with real users with the MVP we developed, we can easily obtain critical objectives such as the creation of the first user base, the beginning of the community around the product, which features will be prioritized in the next stages, or what other needs of the user segment of the product. So, Digital Product Glossary was developed as an MVP with many outlets like these.

Digital Product Glossary

The main value we are trying to create with the digital product glossary is to ensure that the information produced in the product development ecosystem reaches the others. The digital product space, like most niches, has a growing terminology. Almost all of the concepts we use have become part of a certain mentality and culture. tio digital product glossary was developed to be a resource that can be used by a newcomer to the product niche or an entrepreneur who wants to outsource the product development to overcome the terminology barrier.

Actually, as tio, we use various channels for this purpose and produce content in the field of digital products, but the digital product glossary stands at a different point with its organized structure and its potential to be a reference source. For all these reasons, we decided to develop a digital product glossary that will explain the terminology we use in the simplest and most enjoyable way.

Our aim was to create value for the digital product community, while also supporting our SEO efforts, increasing the organic traffic of the tio website and strengthening our topical authority. We have considered all optimization opportunities with this point of view while creating the content and choosing the tools we will use.

It was important for us that the user experience is enjoyable. We designed the product in a way that is far from reading a glossary, fun for someone who is just browsing, but also suitable for someone who is looking for information. Our goal was to create an intuitive but interesting experience. Our purpose was not to digitize the reading experience of a physical glossary, but to ensure that users who are accustomed to different digital platforms have a good time.

Digital Product Glossary developed during the Jamstack Hours meetings as it shows how quickly and with how few resources a digital product can be developed that provides the desired benefit.

Jamstack Hours #1 Gatsby Starter Project

Livestream (in Turkish): Jamstack Hours #1

In the first week of Jamstack Hours, we started with a Gatsby Starter project and installed the Tailwind CSS plugin to tailor the custom design. In order to explain the Gatsby page structure, we started with the most minimal Gatsby project. Then we created a sample component structure live on the page. We have shown how to define classes responsively with Tailwind and how to edit different states of elements.

 🛠️ GatsbyJS

🛠️ Tailwind CSS

Jamstack Hours #2 Headless CMS

Livestream (in Turkish): Jamstack Hours #2 

We compared our options, as Gatsby works seamlessly in the background with almost any CMS service. We mentioned Strapi and headless WordPress as self-hosted CMS examples, Contentful as cloud-hosted and Contenttrain as Git-based CMS examples. We talked about the advantages and disadvantages of these CMSs that we use in different products as needed.

The Contentrain team, a Git based CMS, joined our stream to show how their tools are integrated with the Gatsby starter project we prepared at Jamstack Hours #1.

 🛠️ Contentrain

 🛠️ Strapi

 🛠️ Contentful

 🛠️ WordPress

Jamstack Hours #3 Deployment

Livestream (in Turkish): Jamstack Hours #3 

We talked about easy deployment processes by automatically integrating with your git repository with products such as Netlify, Gatsby Cloud or Vercel. We deploy the Digital Product Dictionary with GatsbyCloud.

 🛠️ Netlify

 🛠️ Gatsbycloud

Result: tio digital product glossary 💙

tio

tio

OUR E-BOOK

Startup Founder'sActionable Guide toDigital Products

Startup Founder’s Actionable Guide to Digital Products

SOCIAL @ INSTAGRAM

@tio.ist

@tio.ist

@tio.ist

@tio.ist

@tio.ist

@tio.ist

@tio.ist

@tio.ist

ALSO ON TWITTER, LINKEDIN, YOUTUBE