2018 #Concatenateconf: The Videos and my first spin with Gatsby and Netlify

Magnificent view of the 2018 #Concatenateconf shot by Rotimi Okungbaye

So after the 2018 #Concatenateconf, I needed to find a way to unwind, rewind and remind myself of the things I learnt during the 2 days event. Then an idea hit me.

Spend a few hours to learn the basics of the tools and platforms that were mentioned which I had never heard or used before and share how easy or hard they would be for a beginner.

One of the things that got stuck in my head was Static sites and Gatsby, so I chose to give that the first shot. Netlify was also mentioned a lot and that naturally influenced my bias. Of course, ReactJs is another major deciding factor. I have never seen anything that makes life as beautiful as the React way.

Then comes the question, what will be the focus of my trial static site. I thought a resume would be a good choice. But it didn’t take long before I changed my mind, majorly because I felt not many will find such beneficial. Then I saw the massive conference videos on youtube. The rest of course is storyland.

Welcome my first gatsby based netlified static blog site containing individual videos of each talk sessions.

Yes, you read right. I pulled the videos, chopped it, merged where necessary and pushed back. The result:

concatenate-conf-on-steroids.netlify.com

You will find all the individual sessions as blog posts as they are added.

Gatsby: How easy or hard was it.

  • Documentation was top notch. It was very easy, and takes from zero to “Hello World” in a matter of ……. fill in the blanks (if your internet is the 2G claiming 4G, you will understand why I can’t complete that statement). But setup was quite fast and easy.
  • You seriously need to know React to make changes to the files. So if you are a “Reactish” person, its a stroll in the park.
  • Deployment is also a no brainer.
  • However, difficulty sets in when you want to use the themes. My advice; read the whole documentation for a theme (Yes, the entire thing) before ever NPMing anything or you will end up wasting time and resources . One of themes I tried required python and c++ build tools for those working with a Windows PC. Long story short, I abandoned it, ‘cos it wasn’t worth the trouble. Afterall, am only doing a test run.

Netlify Netlify Netlify

Ayam smiling 😅 😆 😆………….I didn’t even need to go through documentation to successfully use the dashboard and CMS interface. No wonder so many are raving about it.

You want a static site blog too. Follow the steps below

  • Click on connect to Github button on the new page that loads. You will need to grant permissions to Netlify on your Github account.
  • After granting permissions successfully, change the repository name, then click on the Save and Deploy button.
  • You will be redirected to netlify admin dashboard
Netlify admin dashboard

When the cog wheel beside step 1 (Deploying your site) changes to ✔️, the site is ready. You can visit the site at “sitename.netlify.com”.

  • To change the site name, click on settings.
Netlify static site details

Click on Change site name button. On the popup, type in your preferred site name and click save. Assumming your new site name is concatenate-conf-on-steroids, then your static site will be at concatenate-conf-on-steroids.netlify.com

  • You can access the CMS for the site at concatenate-conf-on-steroids.netlify.com/admin
  • On the CMS, you can delete the demo entries and create new ones.
  • Clone the github repo for the site to your local system to change things like logo or add items to the nav bar.

I hope you found this post interesting. I am going to try out other things from the conference and share too.

Interestingly, this is a catalog of firsts for me —

  • My first medium post
  • My first static site
  • First time working with Gatsby
  • First time working with Netlify

Hope you enjoyed this. Encourage me, Clap and share.

Gracias

Love Life + Adventure | Motivated to bring the best out in people and things | Full Stack Developer | http://github.com/adewaleadeoye | #JESUSBOY