Website New Features And New Design

August 25, 20202 min read •

I have recently updated the design of the site and added a few new features to make my site complete. Continue reading to learn, which services and technologies I have used.

New Design

The previous design seemed a bit incomplete for me. Then I heard about a relatively new CSS library called Milligram in the C# 9 with Mads Torgersen podcast episode of .NET Rocks. It is a lightweight library, which weights only 2kb gzipped. I added CDN links to it and tweaked the colors a bit. Here are the links that you need to include in the HEAD part of your website.

<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,300italic,700,700italic">

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.css">

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/milligram/1.4.1/milligram.css">

New Features

I have added two new features - Mailing List and Contact Page.

Mailing List

Mailing List Subscription Form

Mailing List Subscription Form

You can now subscribe to my mailing list to keep up-to-date with the latest articles from me. Mailchimp seemed like a good choice, so I had to look if there is a plugin for Gatsby, and of course, there was already a plugin for Mailchimp integration. I have built a React function component, which you can check out in the GitHub repo of this website. I decided to add the mailing list in the two places for better engagement. The first one is at the top of the blog section, and the second one is at the end of each article.


Contact Page

Contact Me Form

Contact Me Form

I have added a contact form, which you can find here. I have used Netlify Forms as a form submission back-end because I was already using the Netlify platform to host my website, and they are also for free. I have used this Gatsby guide to get started.

What features do you think are still missing? Please share your thoughts in the comment section below.


Subscribe to my email list

#WebsiteDesign #MailingList #ContactForm

Arrow To Scroll To The Top Of The Page