Creating a small personal web with free tools

June 13, 2021

Are you doing an inception post? Oh yeah!

Ok, so I made this blog with some free tools, a bit of background before: I was born in 1986, in a small town in (TODO: insert life story here) and when I was 21 I started doing web development, and I must say that back then things were much more complicated, I don't want to say you kids have it easy but you pretty much do.

- But Franco! there are so many options now, I'm so tired of not knowing whaSHUT THE FORK UP!

Options are always good, I get that choosing is hard but you know what? Almost everything is good, certainly much better than what you can code on your own even if you think the opposite. Don't get me wrong, if you have the time just go ahead and code it, it's a great way to learn, I did that when I was young, I even had the courage to sell my own PHP CMS solution called (wait for it) CMSify. Yeah I suck. But again, the options available are pretty cool, you just need to know what you need.

One option is just to use any already made solution, this is probably what you should do when some relative or friend asks for help, just send this link along, it's going to be cheap and easy, my favorite options are: wordpress, square space and wix.

A second option for the devs or enthusiasts out there is to build your own system, for this you will need:

  • A CMS (content management system): this is a place to edit and store content, if you want to do this on your own, you will need a database, a backend API to store and retrieve content from the database, a frontend which will connect to that API, and authorization system, probably a role system if you want more than one user and cache layer. That sounds like a lot no? Ok, the easiest option, use a cloud base solution, my favorite option here is contentful, other good options are wordpress or butterCMS. Contentful offers a REST API and also a GraphQL API, as I love graphql I'll go with that option. Contentful is what we call headless CMS, which is basically the backend CMS with API integrations, they also offer a website builder now, but I'll just use the free option of headless CMS.

  • A frontend system: this will display the content created for your readers, I like to keep this separated from the CMS because it makes the system decoupled. Here the options are almost endless, so I'll suggest my favorite by far: Gatsby. Gatsby provides a super simple framework to use, with connection to Contentful (or Wordpress), selection of styling library (I prefer Styled components) and TypeScript and GraphQL integration out of the box. The architecture is simple and ready to use, I forking love Gatsby, give it a try.

  • Hosting: You will need to get some computer connected to the internet 24/7, one option here is AWS Lambda, you get 1 Million requests per month for free. But because I like Gatsby, I'll go with their cloud solution which happens to be free for small websites as well.

  • DNS: you need to get a domain, you have a lot of options here, I went with Route53 from AWS but you can use almost anything, just be sure it's a good established company.

I will add more posts about each specific part later, like adding a service worker for creating a PWA and push notifications, some best practices on Typescript and React, and probably some ideas around creating a design system for your blog, but for now this is enough for you to go and create something wonderful.