Uninstall Typography.js

July 31, 2020

To make a clean switch to TailwindCSS in this gatsby-starter-blog-mdx based website, uninstall typography from the project and remove…

Improving performance with guess.js

July 30, 2020

By accessing Google Analytics data, gatsby-plugin-guess-js is a plugin that can determine which pages a user is most likely to visit next…

Google Analytics

July 28, 2020

You can use Google Analytics to track how much traffic your website is getting, where those visitors are coming from and how they are…

Sitemap and SEO

July 28, 2020

SEO and adding title and description to the header came preinstalled with the starter gatsby-starter-blog-mdx . I added keywords to each…

Access dynamic data from GraphQL in a component that only has access to a Static Query

July 25, 2020

A component in gatsby only has access to a static query by which it can access data in the siteMetadata section of gatsby-config.js or…

MDX and gatsby-plugin-sharp Graphql schema basics

July 19, 2020

I've had a lot of trouble understanding how featuredImage in the frontmatter of an MDX/MD post gets picked up by graphql. Where does MDX…

TailwindCSS in MDX

July 17, 2020

You can use TailwindCSS to style components in MDX posts. I hit a bug where it was working in development builds but not in production…

Adding a custom favicon to your Gatsy site

July 17, 2020

Tufan in Hindi means storm and tufan.io has a very cute storm favicon . I wanted to add that to my replicated tufan website. Medium…

Embedding youtube video in mdx

July 16, 2020

To embed a youtube video in mdx, you need the gatsby-remark-responsive-iframe plugin which comes pre-installed with gatsby-starter-blog…

Creating a nav bar using TailwindCSS

July 16, 2020

I had some trouble using a "nav" tag with "li" items to create a navbar. It's possible that I have CSS specificity issues that I haven't yet…

Formatting of the blog/blogindex using TailwindCSS

July 15, 2020

In a previous post on using TailwindCSS in Gatsby I'd mentioned that installing TailwindCSS ruined the formatting of my blog index page…

The CSS learning curve

July 13, 2020

I'm a newbie at front-end development and have been winging it when it comes to CSS and realized that I needed to go a bit deeper and really…

Overlaying text on a background image

July 13, 2020

I am beginning to realize that when trying to solve a new problem in Gatsby, a smart solution is to first look for a plugin. I've spent some…

Gatsby-image on the landing page

July 11, 2020

An introduction to using Gatsby image by codebushi is a very good resource to incorporate the power of Gatsby's fast loading of images…

Using Font Awesome icons in Gatsby

July 11, 2020

The original landing page used icons and I wanted to replicate that on this website. I went down a couple of rabbit holes before finding the…

Using TailwindCSS in Gatsby

July 09, 2020

I got two recommendations to use Tailwindcss for its ease of use and flexibility. One was from a colleague and the other was Kent C Dodds…

Using Google fonts in Gatsby

July 02, 2020

I styled the html in JSX using a vanilla css stylesheet that I imported into my src/pages/index.js . I am styling the page for my laptop…

The Landing Page

June 29, 2020

Welcome! This website has been built with Gatsby and this blog attempts to document my learnings in building this website. This blog assumes…

New Beginnings

May 28, 2015

Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts. Separated they live in…

tufan.io
Making it simple to create, manage & secure cloud applications.